上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
 FC2ブログ専用ですが、標準装備されているタグリストを、簡単にタグクラウドにしてしまうスクリプトの紹介です。


公式プラグインから追加する

 まずは、FC2管理画面より、公式プラグインの「プラグインの設定」から「公式プラグインの追加・ユーザータグ」を追加し、「詳細・HTMLの編集」画面を開きます。

※デフォルトがこんな感じ。(新着順表示)
<p class="plugin-tag" &align>
<!--rtag-->
<a href="<%rtag_url>"><%rtag_name></a> 
<!--/rtag-->
</p>

■FC2ブログ独自タグに注意

 「ユーザータグ」用のFC2独自構文は、並び順で3種類有るので注意。

<!--rtag--> …新着順
<!--ctag--> …記事数順
<!--stag--> …ランダム



 コレを、以下のように書き換えるだけ。

<p class="plugin-tag" &align>
<!--rtag-->
<span id="rtag_cloud_<%rtag_parsename>">
<a href="<%rtag_url>"><%rtag_name></a> 
</span>
<script type="text/javascript"><!--
document.getElementById("rtag_cloud_<%rtag_parsename>").style.fontSize=((<%rtag_count>*0.30)+10)+"px";
//--></script>
<!--/rtag-->
</p>


「10」の値が、一番小さいサイズ・基準の大きさ。
「0.30」の値を大きくすると、大きいサイズと小さいサイズの大きさの差が大きくなる。
ランダム順などに変えたい場合は、すべての「rtag」を「stag」に書き換えます。



濃ゆいカスタマイズ


 より濃ゆいカスタマイズを検討される方は、こちらでスクリプトの基本を解説。

<p class="plugin-tag" &align>
<!--rtag-->
<span id="rtag_cloud_<%rtag_parsename>">
各タグを「spanタグ」で囲み、そのIDネームに「rtag_cloud_%E%R%F%G」などという、URLエンコード化したユーザタグ名を含む、一つ一つが別のID名を付けています。

<a href="<%rtag_url>"><%rtag_name></a> 
</span>

スクリプト

<script type="text/javascript"><!--
document.getElementById("rtag_cloud_<%rtag_parsename>").style.fontSize=((<%rtag_count>*0.30)+10)+"px";
//--></script>
<!--/rtag-->
</p>


スクリプト部分の解説

[getElementById("").style]
 スクリプトから直接スタイルを変える構文です。「Id("")」IDネームに、先ほどの「spanタグ」のIDネームを対応させています。ID名は「rtag_cloud_<%rtag_parsename>
 赤字部分がFC2構文の「URLエンコード化したユーザタグ名」となっていて、タグごとに違うIDが付いています。

[fontSize=((<%rtag_count>*0.30)+10)+"px"]
 各ID付きspanタグに、フォントサイズを当てています。
 赤字部分がFC2構文の「ユーザタグの累計数(使用された数)」というもの。ブログ内で10回そのタグを使っていれば「10」と言う値が返ってきます。

 *0.30 で、フォントサイズが大きくなりすぎるのを防ぎます。
 例えば、タグが100個使われていると、計算式は「(100個 x 0.30) + 10」pxとなり、実際のフォントサイズは「30px」と言う表示になります。

 +10 というのが、基準値。
 例えば、タグが1回しか使用されていない場合は、計算式は「(1 x 0.30) + 10」pxとなり、実際のフォントサイズは「10.3px」となり、あまりにフォントサイズが小さくなりすぎるのを防ぎます。
このエントリーをはてなブックマークに追加
Mon.09.20.2010
Comment
Trackback
Comment Form
質問するときは?
  • 不具合が出ているページのURLを書き込む。
  • 使っているブラウザ(IE、Firefoxなど)を書き込む※IE6はサポート外です。
  • 次の人が確認できるように、使っているテンプレートの記事ページ、或いは各カスタマイズ記事ページにコメントを書きこむ。
コメント時の注意
やっぱり自分で解決したい時
特定の記事のみでレイアウトが崩れる場合
全ページでレイアウトが崩れる場合
メールフォーム
Bookmarks
Page Top
Copyright © SAKILab All Rights Reserved.
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。