[MT覚書]タグクラウドの表示ソース(MT4デフォルトテンプレ参考)

2011年8月22日

以前に作ったものに、タグクラウドの表示だけ付けることになったのですが、
決まった書式は持ってないので、デフォルトのものから引っ張ってきました。

MT4デフォルトのウィジェットセットで設定されているソース

タグクラウド

で、上のものを利用するときには、下の関連スタイルが一式必要です。
数に応じて大きくなるという仕様になってるので、
結構スタイルが混みいったことになってます。
現状のCSSに合わせて修正も必要です。

MT4デフォルトで設定されているCSS

/* Widgets */

.widget {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.widget-content {
    position: relative;
    margin: 5px 0 20px;
}

.widget-list,
.archive-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.widget-list .widget-list {
    margin-left: 15px;
}

.widget-list-item {
    margin-top: 5px;
    margin-bottom: 5px;
}

.widget-cloud .widget-list {
    margin-right: 0;
    margin-left: 0;
}

.widget-cloud .widget-list-item {
    display: inline;
    margin: 0 5px 0 0;
    padding: 0;
    line-height: 1.2;
    background: none;
}

.widget-cloud .rank-1  { font-size: 1.75em; }
.widget-cloud .rank-2  { font-size: 1.75em; }
.widget-cloud .rank-3  { font-size: 1.625em; }
.widget-cloud .rank-4  { font-size: 1.5em; }
.widget-cloud .rank-5  { font-size: 1.375em; }
.widget-cloud .rank-6  { font-size: 1.25em; }
.widget-cloud .rank-7  { font-size: 1.125em; }
.widget-cloud .rank-8  { font-size: 1em; }
.widget-cloud .rank-9  { font-size: 0.95em; }
.widget-cloud .rank-10 { font-size: 0.9em; }