2006/6/30

MT3.3への移行とTag Cloudの導入

Folksonomyの代表格がTaggingによる分類なわけで、Technoratiを使いつつ、いつしかMovableTypeでもタグがデフォルトで本格採用されないかと楽しみにしていたのですが、ようやくここにきてMovableType 3.3でTagによるエントリの管理がサポートされ、MovableTypeのアップグレードと共に色々いじってみました。

MovableType 3.3 で Tag cloud を簡単に実装する方法 – pur*log

検索で見つけたpur*logさんを参考にして、Tag Cloudを左のサイドバーに用意しました。僕はあのプライオリティが高いものを文字サイズ大きくして表示する、っていうのが視覚的にあまり好きではないので、文字サイズは統一して色の濃度で識別できるようにソースを書き換えてみました。

Tag Cloud部分のソース

<div id="tag-cloud">
<MTTags>
<div class="tag">
<a class="tag level<$MTTagRank$>" href="<$MTTagSearchLink$>" title="<$MTTagName$>(<$MTTagCount$>)" rel="tag"><$MTTagName$></a> </div>
</MTTags>
</div>

CSSのソース

.tag {display: inline;}
.tag a.level1 {color: #679000;}
.tag a.level2 {color: #76B900;}
.tag a.level3 {color: #87D300;}
.tag a.level4 {color: #BAE55F;}
.tag a.level5 {color: #CDE985;}
.tag a.level6 {color: #D7E9A1;}

各エントリに挿入するソース

<MTEntryIfTagged>
<div class="entry-tags">
<h4 class="entry-tags-header">Tag: </h4>
<div class="entry-tags-list">
<MTEntryTags>
<div class="entry-tag"><a href="<$MTTagSearchLink$>" rel="tag"><$MTTagName></a> </div>
</MTEntryTags>
</div>
</div>
</MTEntryIfTagged>

これでいい感じにブログにTaggingを導入できます。後はこれから応用編がちらほら出てくるでしょうから、積極的にカスタマイズしていきたいなあと思います。

ひとり仕事: フリーランスという働き方
(2012-10-5)
売り上げランキング: 14,705
100円

加藤 康祐 / 企画・設計

1980年1月12日生まれ。フリーランス歴15年。プランナー、デザイナー。加藤康祐企画設計代表。学生時代にデザイン会社でWebデザインを経験。2005年よりフリーランスとしてキャリアスタート。これまでに個人から上場企業まで、100以上のクライアントとのプロジェクトを経験。主な仕事としてベンチャー企業でのサービスのUXデザイン、独法との防災メディアの編集・運営、社会的養護の子どもたちの自立を支援するNPOのサポート等。趣味はラグビーと料理。Keep the head up, Bind tight & Stay low.

加藤康祐企画設計

是非、フォローしてください!
Twitter / Instagram