リンクの先頭に画像を挿入する1

新着記事やカテゴリなどのサイドバーに表示されるコンテンツはリンクが箇条書きになっています。
テンプレートによっては改行が分りにくいものもあります。

サイドリンク

そこで「サイドリンク」このような画像を準備してリンクの先頭に挿入しました。

このカスタマイズは新着記事コンテンツの編集です。マイブログメニューの[デザイン]⇒[コンテンツ]の[新着記事]から編集を行います。ソース中段あたりに次の記述があります。

<% loop:list_article -%>
(<% article.createstamp | date_format("%m/%d") %>)<a href="<% article.page_url %>"><% article.subject | tag_break %></a><br />
<% /loop -%>
※各カスタマイズの紹介を独立させるために、初期状態のソースで説明します。

これがリンクを表示している箇所です。
<img>タグを用いてリンクの先頭に画像を挿入します。

<% loop:list_article -%>
<img src="http://blogcustomize.seesaa.net/image/link.png" alt="リンク" width="13" height="18" />
(<% article.createstamp | date_format("%m/%d") %>)<a href="<% article.page_url %>"><% article.subject | tag_break %></a><br />
<% /loop -%>

以上で作業は完了です。変更後は次のように表示されます。

サイドリンク

このカスタマイズをカテゴリ、過去ログ、新着記事、最近のコメント、最近のトラックバックで行いました。

関連記事:箇条書きリンクの補完2
トップページへ戻る

サイトマップ

Seesaaブログのカスタマイズ > 新着記事 > 箇条書きリンクの補完1
スタイルシート カスタマイズ

スタイルシート作成ツール

HTMLカスタマイズ
サイト全体

記事コンテンツ

コメント、トラックバック
新着記事

カテゴリ

最近のコメント、トラックバック

検索ページ

その他