
こういうの最近よく見かけますよね (´・ω・`)
いわゆる タグクラウド と呼ばれるものですが、こちらのサイト様をお手本に導入してみました。
スクリプト不使用のFC2ブログ用タグクラウド kofumo 様
とってもわかりやすく説明してくださってますのでここで私が再度説明する間でもないのですが。一つだけ付け足しとして「全体のスタイルをどこに記述するか」なんですけども。
スタイリングだからCSSの出番ということで、各テンプレートのCSSソースに追記するのが最も推奨される方法ですが、その方法だとテンプレを変更するたびに追記しなければいけなくなります。というわけで、html5テンプレートの場合には こういうこともできますよ ↓
(id名やclass名は任意ですので 私は私のわかりやすい名称に変更しています)
<style>
.tag_cloud {
line-height: 1;
font-size: 13px;
padding: 10px 0;
}
.tag_cloud li {
display: inline-block;
padding: .3em;
list-style-type: none;
}
.t_large a {
font-size: 167%;
font-weight: bold;
}
.t_ordinary14 a, .t_ordinary13 a, .t_ordinary12 a,
.t_ordinary11 a, .t_ordinary11 a, .t_ordinary10 a {
font-size: 136%;
font-weight: bold;
}
.t_ordinary9 a, .t_ordinary8 a, .t_ordinary7 a,
.t_ordinary6 a, .t_ordinary5 a {
font-size: 122%;
font-weight: normal;
}
.t_ordinary4 a, .t_ordinary3 a,
.t_ordinary2 a, .t_ordinary1 a {
font-size: 100%;
font-weight: normal;
}
</style>
<ul class="tag_cloud">
<!--stag-->
<li class="t_large t_ordinary<%stag_count>">
<a href="<%stag_url>" title="<%stag_count>hits"><%stag_name></a>
</li>
<!--/stag-->
</ul>
記入するのは『プラグインの設定』の『フリーエリア』です。プラグインの書式の中にCSSを style要素 として書くことができます。html5.2からは head内 以外、つまり body内 にstyle要素を書くことがinvalid(不正)ではなくなりました。こうしておくと毎度毎度の手間も省けますし、公式や共有テンプレのプレビュー画面でも反映されますので楽チンってことであります (´・ω・`)
意外とご存知ない方がおられるようですので情報として (o'д`o)ゝ
body内のstyle要素については以下の記事をご参照ください。

body内のstyle要素が一定条件下で再びエラーに
head内限定だったstyle要素の記載がHTML5.2からはbody内にも書けるようになりました ということで私のその件を記事にしております。 ところがW3C validatorでbody内style要素が再びエラー対象に。その理由と解決策など。...
There are no comments yet.