INTEREST

↓テンプレート「basic_white」のカスタマイズ用に作ったブログです。（そのまんまのタイトル...ｗ）
「 FC2ブログのテンプレート「basic_white」をカスタマイズ 」

---

【「basic_white」のカスタマイズ】

1. 1.サムネイルに記事ページへのリンクを付ける方法
2. 2.「このエントリーの固定リンク」部分に記事タイトルを表示する

---

1.サムネイルに記事ページへのリンクを付ける方法

変更箇所は「テンプレートの設定」の「basic_white のHTML編集」内に記述されてる以下の部分です。 ※「Ctrl」+「F」で「 <%topentry_image> 」を検索すればOKです

<!--body_img-->
<div class="entry_image"><%topentry_image></div>
<div class="entry_description"><%topentry_body></div>
<!--/body_img-->
<!--body_img_none-->
<div class="entry_image">
<img src="http://blog-imgs-66.fc2.com/b/a/s/basicwhite/no-image200.gif" 
alt="NO IMAGE" /></div>
<div class="entry_description"><%topentry_body></div>
<!--/body_img_none-->

※前回のカスタマイズ後のHTMLなので初期状態とは異なり、記事本文の表示及び、画像が無い場合は7行目の代替画像が表示されるようになってます。

<!--body_img-->
<div class="entry_image">
<a href="<%topentry_link>" title="<%topentry_title>"><%topentry_image></a>
</div>
<div class="entry_description"><%topentry_body></div>
<!--/body_img-->
<!--body_img_none-->
<div class="entry_image">
<a href="<%topentry_link>" title="<%topentry_title>">
<img src="http://blog-imgs-66.fc2.com/b/a/s/basicwhite/no-image200.gif" 
alt="NO IMAGE" /></a></div>
<div class="entry_description"><%topentry_body></div>
<!--/body_img_none-->

※3行目の「<%topentry_image>」の部分と、10行目の代替画像「<img ～省略～ />」の部分を
「<a href="<%topentry_link>" title="<%topentry_title>">」と「</a>」で挟んでいます。

以上の編集で、サムネイルをクリックすると記事ページへリンクするようになり、サムネイルにマウスを乗せると記事タイトルが表示されるようになります。
また、サムネイルにマウスを乗せた時に画像を少し透明化して分かり易くする場合は、スタイルシートに下記の記述を追加します。（追加する場所はスタイルシートの末尾でもOKです）

#main_contents .entry_body .entry_image a:hover img { opacity: 0.7; }

※数字を下げるとより透明化します。（ 0.0 ～ 1.0 の範囲で指定する 1.0が初期値で不透明の状態）

---

2.「このエントリーの固定リンク」部分に記事タイトルを表示する

初期状態だと「記事タイトル」や「続きを読む」にマウスを乗せた時に「このエントリーの固定リンク」と表示されるので、その部分を編集しリンク先の「記事タイトル」が表示されるようにしました。

変更箇所は「テンプレートの設定」の「basic_white のHTML編集」内に記述されてる以下の部分です。
※「Ctrl」+「F」で「 <%template_abs_link> 」を検索すればOKです（2箇所あります）

<a href="<%topentry_link>" title="<%template_abs_link>">

<a href="<%topentry_link>" title="<%topentry_title>">

<a href="<%topentry_link>" title="「<%topentry_title>」の全文を表示">

※「記事タイトル」と「続きを読む」でそれぞれちょっとだけ表示される内容を変えてみました。