FC2ブログのテンプレート工房

カスタマイズが簡単な共有テンプレートを配布しています。テンプレートをカスタマイズして自分だけのオリジナルブログを作りませんか?

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
[ --/--/-- --:-- ] スポンサー広告 | TB(-) | CM(-)

『最新の記事』の便利ナビに「NEW」マークを表示する

以前に新着記事に新着表示「NEW」マークを付けて目立たせる方法、更に『最新の記事』の便利ナビを設置する方法(standard,lightframe)を紹介しました。

今回はこの2つのカスタマイズが既に施されていることを前提に『最新の記事』の便利ナビに「NEW」マークを表示する方法を紹介します。
スポンサーサイト

個別記事ページの文末に広告などを表示させる

以前に記事文末にランキング投票や広告等を入れる カスタマイズを紹介しましたが、これはトップページなどでも表示されるものでした。

今回は個別の記事ページのみに表示させる方法を紹介します。

リストマークをアイコン画像にする

リストマークの「・」をアイコン画像にする方法を紹介します。

スタイルシートの末尾に次の記述を加えてください。

ul { list-style-image: url("http://~"); }



http://~の部分にはアイコン画像のURLを入れてください。
リストマークの画像なので小さい画像を使うのがよいと思います。

【2010/02/02 追記】マウスを乗せたときに「リストマークは動かさずにリンクテキストを少し右へ移動」するように見せるには、さらにこれをスタイルシートの末尾に加えてください。

ul a:hover { padding-left:5px; }


逆に「リンクテキストを動かさずにリストマークを少し右へ移動」するように見せるには背景画像を利用する必要があります。
上記の今までのカスタマイズを施さずに下記をスタイルシートの末尾に加えてください。

ul,li {
list-style:none;
margin-left:0px;
padding-left:0px;
}

li a {
background-image: url("画像URL");
padding-left: 20px; /* 左に背景画像分の余白設定 */
background-repeat: no-repeat; /* 繰り返し表示しない */
background-position: 0px 2px; /* 左からの位置、上からの位置 */
}

/* マウスを乗せたとき */
li a:hover {
background-position: 2px 2px; /* 左からの位置、上からの位置 */
}


各数値はいろいろ変えて調整してください。

lightframeの左右カラム幅を固定、記事カラム幅を可変にする

テーブル構成ではないlightframeで、左右のカラム幅を固定、記事カラム幅はブラウザサイズにあわせた可変にするカスタマイズを紹介します。

『最新の記事』の便利ナビを設置する (standard)

私のテンプレートにはmuhurtさんの便利ナビが標準装備されています。ただ「最新の記事」の便利ナビは取り外していました。この「最新の記事」の便利ナビを取り付ける方法を紹介します。

このカスタマイズはテンプレート standardシリーズが対象です。
lightframeシリーズをお使いの方は『最新の記事』の便利ナビを設置する (lightframe)をご覧ください。

『最新の記事』の便利ナビを設置する (lightframe)

私のテンプレートにはmuhurtさんの便利ナビが標準装備されています。ただ「最新の記事」の便利ナビは取り外していました。この「最新の記事」の便利ナビを取り付ける方法を紹介します。

このカスタマイズはテンプレート lightframeシリーズが対象です。
standardシリーズをお使いの方は『最新の記事』の便利ナビを設置する (standard)をご覧ください。

サイトマップの記事を別窓で開く

以前にブログのサイトマップの作り方を紹介しましたが、このサイトマップの記事を別窓で開くようにするカスタマイズを紹介します。
ブログ内検索1
プロフィール

Author:いたお
更新は非常にマイペースです
現在休止中です

当サイトはリンクフリーです。

いたおの他の運営サイト
カレンダー
04 | 2007/05 | 06
- - 1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31 - -
なんでもスクロール
このように
縦に長く伸びた
プラグインを
スクロールバーによって
一定の長さに
抑えることが
出来ます。

※スクロールさせる文字やプラグインのHTMLをここに
今日の日付入りカレンダー

04 | 2007/05 | 06
- - 1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31 - -
ユーザータグ


△ ページトップへ戻る
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。