Movable Type備忘録さまのbzbellさまにご指導頂き、タグクラウドのページが出来ました。
参考：TagSupplementals プラグインでタグクラウドを作る
1.TagSupplementals プラグインをダウンロードする。
2.Movable Typeのインストール先 mtディレクトリ内（mt/plugins/）へアップロード。
3.タグクラウド用の JavaScript を作成します。tagcloud.jsをダウンロードする。
●デザイン⇒テンプレート⇒インデックステンプレート
インデックステンプレートを作成する。
テンプレート名称：JavaScript(tagcloud.js)
出力ファイル名称：tagcloud.js
編集部分にダウンロードしたものをコピーしてペーストする。
4.タグクラウド用のテンプレートモジュールを作成する。
●デザイン⇒テンプレート⇒テンプレートモジュール
上記コードをコピー & ペーストしてテンプレートモジュールを作成する。
テンプレート名称：タグ一覧
<MTIfArchiveTypeEnabled archive_type="Individual">
<div class="archive-tagcloud archive">
<div class="archive-content">
<ul id="tags">
<MTTags>
<li title="<$MTTagName$>:<$MTTagCount$>:<$MTTagLastUpdated format="%Y-%m-%d"$>"><a href="<$MTTagSearchLink$>" rel="tag"><$MTTagName$></a></li>
</MTTags>
</ul>
<script type='text/javascript' src='<$MTLink template="JavaScript(tagcloud.js)"$>'>"></script>
</div><!-- archive-content -->
</div><!-- archive -->
</MTIfArchiveTypeEnabled>5.タグクラウド用のインデックステンプレートを作成する。
メインページなどをベースに作成して、上記（4.）作成したテンプレートモジュールを
インクルードします。
<$MTInclude module="タグ一覧"$>6.これで再構築すれば完了なのですが・・・
私のブログの場合・・・タグがズラズラと並んでしまう為にスタイルシートを入れる事で
表示する事を教えて下さいました。
●デザイン⇒テンプレート⇒インデックステンプレート⇒スタイルシート（メイン）
#tags {
margin: 0;/*ul タグのマージン／パディングを初期化します */
padding: 0;
list-style: none;
}
#tags li {
margin: 0;/* li タグのマージン／パディングを初期化します */
padding: 0;
display: inline;/*各タグを横に並べます */
line-height: 1.7;/* 各タグの行間を設定します */
}
#tags li a {
padding: 0 .1em;/* タグ間の余白を設定します */
text-decoration: none;/*アンカーのアンダーラインを消します */
color: #8fabbe;/* リンク(タグ)の初期カラーを設定します */
}
#tags li.rank-1 a {
color: #192f60;/* レベル1 のカラーを設定します */
font-weight: bold;
}
#tags li.rank-2 a {
color: #003f8e;/* レベル2 のカラーを設定します */
}
#tags li.rank-3 a {
color: #4753a2;/* レベル3 のカラーを設定します */
}
#tags li.rank-4 a {
color: #7a99cf;/* レベル4 のカラーを設定します */
}
#tags li.rank-5 a {
color: #bcc7d7;/* レベル5 のカラーを設定します */
}
#tags li.rank-6 a {
color: #ff80c0;/* レベル6 のカラーを設定します */
}
#tags li a:hover {
text-decoration: none;/*ホバー時のアンダーラインを消します */
color: #8fabbe;/*ホバー時のカラーを設定します */
}
Post a Comment