隠居のBlog備忘録：MT4.1 で TagCloud ページをつくる

　MT3.3 のときに、はじめて TagCloud を設置したときはかなり苦労した。

　MT4.1 では「小粋空間」さんのテンプレート・セットの "two-colomn-liquid-right" を使わせてもらっている。TagCloud は右サイドメニューの中で表示する仕様になっている。Msajii's Blog のようにタグ（キーワード）が多いと「小粋空間」さんの「タグクラウドの折りたたみ for Movable Type 4」を使わせてもらって、折りたたみができる。ただ、私の場合はメッシュを細かくしてタグ（キーワード）をつけたので700 ちかくになっているから、全てを表示すると縦に長くなってしまう。

　それで、MT3.3 のときのようにページで表示できないかネットをググッテみたが、適切なインストラクションがヒットしなかった。それでもいろいろなページを参考に、MT3.3 のときに使っていた「小粋空間」さんの「Movable Type 3.3 エントリー・タグ詳説」のコードを使って、TagCloud ページを作るとうまくいったので備忘録的に書き留めておきたい。

　わかってみれば設置は簡単である。

方法はインデックステンプレートを新しく作るのである。（追記：2013/1/22）。インデックステンプレートのメインページをまるまる C&P して、新しく名前は何でもいいのだが、TagCloud とでもし、出力ファイル名はこれも名前は何でもいいのだが tagcloud_page.php としてインデックス・テンプレートに保存する。

このテンプレートページの下記の部分を削除し、

<MTEntries>
   <$MTEntryTrackbackData$>
   <$MTInclude module="ブログ記事の概要"$>
</MTEntries>

「Movable Type 3.3 エントリー・タグ詳説」の下方にある次のコードを挿入する。

<div class="module-tagcloud module">
    <h2 class="module-header">Tag cloud</h2>
    <div class="module-content">
        <ul class="module-list">
            <MTTags>
                <li class="module-list-item taglevel<$MTTagRank$>">
                    <a href="<$MTTagSearchLink$>"><$MTTagName$></a>
                </li>
            </MTTags>
        </ul>
    </div>
</div>

<h2> Tag Cloud </h2> の部分には、TagCloud の説明などに変更できる。

スタイルシートには、次のCSS を追加する。

/* (タグクラウド用) */

.module-tagcloud .module-content a {text-decoration: none; }
.module-tagcloud .module-content {text-align: left; }
.module-tagcloud .module-content .module-list { list-style: none; }
.module-tagcloud .module-content .module-list .module-list-item { display: inline; }
.module-tagcloud .module-content .module-list li.taglevel1 { font-size: 32px; }
.module-tagcloud .module-content .module-list li.taglevel2 { font-size: 28px; }
.module-tagcloud .module-content .module-list li.taglevel3 { font-size: 24px; }
.module-tagcloud .module-content .module-list li.taglevel4 { font-size: 20px; }
.module-tagcloud .module-content .module-list li.taglevel5 { font-size: 16px; }
.module-tagcloud .module-content .module-list li.taglevel6 { font-size: 12px; }

.module-tagcloud .module-content .module-list li.taglevel1 a{ color: #000000; }
.module-tagcloud .module-content .module-list li.taglevel2 a{ color: #0000ff; }
.module-tagcloud .module-content .module-list li.taglevel3 a{ color: #000000; }

表示するフォントの大きさや色は、ここでいじれる。ランクの区分は６段階が初期値である。

作ったページへのパス（私の場合：http://n-shuhei.net/atelier/tagcloud_page.php ）でブラウザに TagCloud ページが表示できれば成功である。
あとは適当な位置に　TagCloud ページへのリンクボタンを設定すれば終わりである。右サイドにボタンを置いたので、サンプルはそちらをみて欲しい。

隠居のBlog備忘録：MT4.1 で TagCloud ページをつくる

タグ:

トラックバック

コメントする