道化師ラッパンのボヤキ

移行してから、だいぶデザインが前の状態になってきた。

今回も昔の記事を見ながらいじっていき・・・その順をメモ。

 

1）PHP化

モジュール化はまだ先にのばして・・・拡張子だけとりあえず変えた感じ。そうそう、XML宣言については、修正やなしに削除の方選びました。

2）MTPhotoGalleryプラグインの導入

これ、タイトルの横に付いてる画像を入れ替えるプラグインです。

3）InsertIconプラグインの導入

コメント入力フォームとコメント詳細を書き換え。

4）PreviousNextInCategoryプラグインの導入

同カテゴリ内の前後記事へのリンクを表示するものです。 アーカイブテンプレート＞ブログ記事の上部にある、class="content-nav"の中身をごっそり書き換えました。

 5）PageButeプラグインの導入

 メインページ下部にある、「Google」をマネして作ったアレです。今回は、メインページ以外のブログ記事リストにも表示するようにしました。

 6）カテゴリリストのツリー化

 ウィジェット＞カテゴリアーカイブの中にスクリプト記述。

7）タグクラウド

タグクラウドは、前のようにカラフルにしました。まず、ウィジェット＞タグクラウドの中身。8段階・40単語を表示するようにしました。タグクラウドは場所を取るので、全部の表示は別ページでやろうと思っています。青字を追加。

<dd class="side">
  <ul id="tags">
<mt:tags limit="40" sort_by="name | rank">
    <li class="module-list-item taglevel<mt:tagRank max="8" />">
      <a href="<mt:tagSearchLink />"><mt:tagName /></a>
    </li>
</mt:tags>
  </ul>
</dd>

ほんで、それに対するスタイルシートを以下のように記述。

ul#tags {
  margin-top: 5px;
  padding: 0.5em 0px;
  line-height: 1.1;
}
ul#tags li{
  margin: 0;
  padding: 0;
  display: inline;
  font-size: 100%; /* ここで相対的に文字サイズを変更 */
}
ul#tags li a {
  padding: 2px 5px;
  border-width: 1px;
  border-style: solid;
  position: relative;
  text-decoration: none;
  background-color: #ffffff;
}
ul#tags .taglevel1 a{
  z-index: 8;
  border-color: #d74984;
  color: #d74984;
  font-size: 175%;
  font-weight: bold;
  top: 5px;
}
ul#tags .taglevel2 a{
  z-index: 7;
  border-color: #c2478e;
  color: #c2478e;
  font-size: 160%;
  font-weight: bold;
}
ul#tags .taglevel3 a{
  z-index: 6;
  border-color: #bd479e;
  color: #bd479e;
  font-size: 145%;
  font-weight: bold;
  top: 5px;
}
ul#tags .taglevel4 a{
  z-index: 5;
  border-color: #a44da3;
  color: #a44da3;
  font-size: 130%;
}
ul#tags .taglevel5 a{
  z-index: 4;
  border-color: #85549c;
  color: #85549c;
  font-size: 115%;
}
ul#tags .taglevel6 a{
  z-index: 3;
  border-color: #7861a5;
  color: #7861a5;
  font-size: 100%;
  top: 5px;
}
ul#tags .taglevel7 a{
  z-index: 2;
  border-color: #6e7db0;
  color: #6e7db0;
  font-size: 85%;
}
ul#tags .taglevel8 a{
  z-index: 1;
  border-color: #4891b6;
  color: #4891b6;
  font-size: 70%;
}
ul#tags li a:hover {
  border-color: #ffffff;
  z-index: 10;
  color: #ffffff;
  background-color: #cc0063;
}

8）カウンター設置

今回は、ミリオンシステムさんのHiCntを使わせていただきました。画像はMOVEさんの数字を使わせてもらいました。

 

あと、もうちょっと変更したいとこはあるんやけど・・・。また順次やっていこうと思ってます。