ブームラボ > MovableType >
About

2007年03月18日に投稿されたMovableType「カテゴリーのナビ部分 CSSを用いて枠線を作る」のページです。

ひとつ前の投稿は「Internet Explorerのシェアはジワジワ下がる」です。

次の投稿は「ソニー AM FM ラジオ対応ワンセグテレビ発売!」です。

他にも多くのエントリーがあります。メインページアーカイブページも見てください。

« Internet Explorerのシェアはジワジワ下がる | メイン | ソニー AM FM ラジオ対応ワンセグテレビ発売! »

Movable Typeのカテゴリーで「Paged Archivesプラグイン」を利用して分割したのですがそのまま使うと少し味気ない感じになります。
せっかくなのでカテゴリーのページを表示するナビ部分をCSSを用いて枠線を作ってみます。この方法は「Paged Archivesプラグイン」を利用する
場合有効です、Movable Typeカテゴリーのページ分割をご覧ください。

CSSを用いて枠線を作る
↑こんな感じになります。

Movable Typeのスタイルシートに以下を貼り付けてください。

.paged-archives a, .paged-archives a:visited{
padding: 0 5px;
border: 1px solid #cccccc;
text-decoration: none;
color: #000066;
}
.paged-archives b{
padding: 0 5px;
border: 1px solid #cccccc;
text-decoration: none;
color: #000066;
background-color: #dae0e6;
}

カテゴリーアーカイブのナビゲーション用のタグ部分に以下を貼り付けます。

<MTPAIfMultiplePages>
<p class="paged-archives"><MTPAPageList></p>
</MTPAIfMultiplePages>

これでナビ部分に枠が追加され現在のページ部分に背景がつきました。background-colorやフォントのcolorを変えれば見栄えも良くなるかもしれません。


関連記事

スポンサード リンク
トラックバック

このエントリーのトラックバックURL
(お手数ですが本文中に言及リンクを含めて送信してください。)

この一覧は、次のエントリーを参照しています: カテゴリーのナビ部分 CSSを用いて枠線を作る:

» ページ分割の方法を変えた 【Paged Archives Plugin】 送信元 臨機応変?
 MovableTypeではカテゴリーアーカイブや月間アーカイブなどは、それぞれ、カテゴリーごとに1ページ、月ごとに1ページという形で構成されるため、投稿...

コメントを投稿

since 2007/03/03
累計:
本日:
昨日:

MovableType
コンピュータ
Kaze to Desktopアイコンとウィンドウが飛び回るスクリーンセイバー
デスクトップ上のアイコンやウィンドウが竜巻のように吹っ飛んでいく面白いスクリーン...
SafePasswdパスワードを自動で生成してくれる「SafePasswd」
パスワードを自動で生成してくれる「SafePasswd」。アルファベットと数字を...
Create Your Own Snowflakes雪の結晶を作成「Create Your Own Snowflakes」
雪の結晶を作って遊べる「Create Your Own Snowflakes」。...
相関図メーカー相関図メーカーで「昼ドラ」を体験しました
今さら?と言われてしまいそうですが相関図メーカーで遊んでみました!相関図メーカー...
スクリーンセイバー「PolarClock」MacとWindowsに!おしゃれな時計スクリーンセイバー
MacとWindowsに対応しているすごくおしゃれなスクリーンセイバー「Pol...
FunnyLogo「Googleのロゴを作成するFunnyLogo」
Googleのロゴを作成してくれるFunnyLogoで遊んでみました!作り方は簡...