こんにちは、カスタマイズと復興支援で頑張るたっくんです。


今日は、サイドバーにリストマークをつけてみました。


ほんの小さな画像ですが、あるとだいぶ印象が変わりますよ。


以下のCSSを追加してみてください。


注:新CSS編集用デザインのカスタマイズです。


/*リストマーク*/
/*最近の記事*/
.recentEntriesMenu li{
padding-left:16px;
background-image:url(画像URL);
background-repeat:no-repeat;
background-position:left center;
}
/*最近のコメント*/
.recentCommentMenu li{
padding-left:16px;
background-image:url(画像URL);
background-repeat:no-repeat;
background-position:left center;
}
/*テーマ*/
.themeMenu li{
padding-left:16px;
background-image:url(画像URL);
background-repeat:no-repeat;
background-position:left center;
}
/*アーカイブ*/
.archiveMenu li{
padding-left:16px;
background-image:url(画像URL);
background-repeat:no-repeat;
background-position:left center;
}
/*読者一覧*/
.readerMenu li{
padding-left:16px;
background-image:url(画像URL);
background-repeat:no-repeat;
background-position:left center;
}
/*お気に入り*/
.favoriteMenu li{
padding-left:16px;
background-image:url(画像URL);
background-repeat:no-repeat;
background-position:left center;
}
/*ブックマーク*/
.bookmarkMenu li{
padding-left:16px;
background-image:url(画像URL);
background-repeat:no-repeat;
background-position:left center;
}



お気に入りの画像が見つかりましたら、


ぜひチャレンジしてみてください。


ちなみに、現在使用しているリストマークは、


こちらの素材サイトで見つけました。


よろしかったら、参考にしてみてください。


全体的にパステル調で、和みますよ。


http://bluegreen.jp/sozai/list/

(リンクしています↑)

リストマーク/フリー素材「blue-green」-シンプルかわいいWEB用フリー素材テンプレートを無料配布。


なお、今回も、いつもお世話になっています、


わざめーばさんのこちらの記事を参考にしました。


ありがとうございます。


あなたも、ぜひ参考にしてみてください。


【新】サイドメニューの各一欄部分にリストマーク画像を表示する方法