上記の広告は１ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
新しい記事を書く事で広告が消せます。
FC2ブログ専用ですが、標準装備されているタグリストを、簡単にタグクラウドにしてしまうスクリプトの紹介です。
公式プラグインから追加する
まずは、FC2管理画面より、公式プラグインの「プラグインの設定」から「公式プラグインの追加・ユーザータグ」を追加し、「詳細・HTMLの編集」画面を開きます。
※デフォルトがこんな感じ。（新着順表示）
コレを、以下のように書き換えるだけ。
「10」の値が、一番小さいサイズ・基準の大きさ。
「0.30」の値を大きくすると、大きいサイズと小さいサイズの大きさの差が大きくなる。
※ランダム順などに変えたい場合は、すべての「rtag」を「stag」に書き換えます。
より濃ゆいカスタマイズを検討される方は、こちらでスクリプトの基本を解説。
スクリプト部分の解説
[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」となり、あまりにフォントサイズが小さくなりすぎるのを防ぎます。
まずは、FC2管理画面より、公式プラグインの「プラグインの設定」から「公式プラグインの追加・ユーザータグ」を追加し、「詳細・HTMLの編集」画面を開きます。
※デフォルトがこんな感じ。（新着順表示）
<p class="plugin-tag" &align>
<!--rtag-->
<a href="<%rtag_url>"><%rtag_name></a>
<!--/rtag-->
</p>
<!--rtag-->
<a href="<%rtag_url>"><%rtag_name></a>
<!--/rtag-->
</p>
■FC2ブログ独自タグに注意
「ユーザータグ」用のFC2独自構文は、並び順で3種類有るので注意。
<!--rtag--> …新着順
<!--ctag--> …記事数順
<!--stag--> …ランダム
「ユーザータグ」用の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>
<!--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>">
<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>
<!--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
Trackback URL
Comment Form
質問するときは？
やっぱり自分で解決したい時
特定の記事のみでレイアウトが崩れる場合
全ページでレイアウトが崩れる場合
メールフォーム
- 不具合が出ているページのURLを書き込む。
- 使っているブラウザ（IE、Firefoxなど）を書き込む※IE6はサポート外です。
- 次の人が確認できるように、使っているテンプレートの記事ページ、或いは各カスタマイズ記事ページにコメントを書きこむ。
特定の記事のみでレイアウトが崩れる場合
全ページでレイアウトが崩れる場合
メールフォーム
