blog -under construction-: 2005年07月アーカイブ

« 2005年06月 | メイン | 2005年08月 »

2005年07月28日

8月号

theme of this month
「サイトナビゲーションを工夫する」

　ブログをカスタマイズする際、デザインに凝るのはもちろんだが、サイトナビゲーションの向上についても考慮していきたい。今回は読者がページ内の目的の場所にスムーズに移動したり、読みたい記事を簡単に探すことができるような機能を考えてみることにする。

●個別エントリーアーカイブを選び、ヘッダーの下に以下のソースを追加します。

<ul class="inline navigation">
<li> <a href="<$MTBlogURL$> " title="トップページ"> Top</a> <img src="http://www.○○○○.com/arrow.jpg" width="12" height ="12" alt="に含まれる" />
<ul class="inline">
<li> <MTParentCategories> <a href="<$MTCategoryArchiveLink$> " title="カテゴリー"<$MTCategoryLabel$> ""> <$MTCategoryLabel$> </a> </MTParentCategories> <img src="http://www.○○○○.com/arrow.jpg" width="12" height ="12" alt="に含まれる" />
<ul class="inline">
<li> <a href="<$MTEntryPermalink$> " title="<$MTEntryTitle$> "> <$MTEntryTitle$> </a> </li>
</ul>
</li>
</ul>
</li>
</ul>

●スタイルシートを選び、以下のソースを追加してください。

ul.inline li ul.inline {
display: inline;
padding: 0;
margin: 0
}

ul.inline li {
display: inline;
}

ul.navigation {
border: 1px solid black;
background-color: white;
margin: 1em 0;
padding: 1em 0 1em 1em;
}

ul.navigation li a {
color: black;
text-decoration: none;
}

ul.navigation li a:hover {
color: black;
text-decoration: underline;
}