先日、zenbackのリニューアルに伴いラベル色の変更をしました。。

当ブログでは他の部位と統一させる為にラベル色を
サイドリストのタイトルバックの色に変更しました。

っつ〜事で、当ブログで行った
ラベル色の変更方法を記しておきます☆


ご参考にされる方がいらっしゃればど〜ぞ☆


尚、カスタムにあたって…

こちらを参考にさせていただきました(^^

【ブログパーツのid／class構造とcssについて - Zenbackブログ】 まず…
このカスタムを行うにあたり、ウィジェット
テーマを

zenbackデフォルトテーマに設定しておいてください。



以下、それぞれのラベルとCSS記述です。。

赤文字で記した部分について、お好きなアイコンと配色に設定する事でカスタマイズできます☆

【変更前】

#zenback-widget #zenback-related-article .zenback-module-label {
background-image: url(アイコンのＵＲＬ)!important;
background-color: #ラベル色!important;
}
#zenback-widget #zenback-related-article .zenback-module-content {
border-color: #ライン色!important }

【変更後】
ラベル色を変更するとアイコンと色違いになる為、画像挿し換えしました。
※元アイコン
（http://widget.zenback.jp/_p/images/icon-article.png）




【変更前】

#zenback-widget #zenback-related-links .zenback-module-label {
background-image: url(アイコンのＵＲＬ)!important;
background-color: #ラベル色!important;
}
#zenback-widget #zenback-related-links .zenback-module-content {
border-color: #ライン色!important
}

【変更後】
こちらも関連する記事と同じくアイコンが色違いになる為に画像挿し換えしました。
※元アイコン
（http://widget.zenback.jp/_p/images/icon-link.png）




【変更前】

#zenback-widget #zenback-twitter .zenback-module-label {
background-image: url(アイコンのＵＲＬ)!important;
background-color: #ラベル色!important;
}
#zenback-widget #zenback-twitter .zenback-module-content {
border-color: #ライン色!important
}

【変更後】
Twitterのアイコンに関しては、元々透過PNGが使われているのでラベルの色変更だけでも対応可能かと思います。
※元アイコン
（http://widget.zenback.jp/_p/images/icon-twitter.png）
オリジナルにされたい方は挿し換えてみては？




【変更前】

#zenback-widget #zenback-facebook-comment .zenback-module-label {
background-image: url(アイコンのＵＲＬ)!important;
background-color: #ラベル色!important;
}
#zenback-widget #zenback-facebook-comment .zenback-module-content {
border-color: #ライン色!important
}

【変更後】
フェイスブックについてもアイコンは挿し換えませんでした。
※元アイコン
（http://widget.zenback.jp/_p/images/facebook_icon.png）
オリジナル画像に変更されたい方はど〜ぞ☆




【変更前】

#zenback-widget #zenback-hatena-bookmark .zenback-module-label {
background-image: url(アイコンのＵＲＬ)!important;
background-color: #ラベル色!important;
}
#zenback-widget #zenback-hatena-bookmark .zenback-module-content {
border-color: #ライン色!important
}

【変更後】
はてなブックマークについてもあえてアイコン変更しませんでした。
※元アイコン
（http://widget.zenback.jp/_p/images/icon-hatebu.gif）

デフォルトでも、ある程度テーマカラーに沿った配色になってるので…
変更しなくても充分に使えるんですけどね(^^;

まぁ…
あくまでカスタマイズの参考に…って感じで(^^