SEO賢威6.1のウィジェットのタイトルの背景色の変更
ご訪問有難うございます。
当サイトのSEO賢威のウィジェットの背景色はデフォルトでは黒色ですが、ｈ２見出しをグレードのグラデーションの画像に変更しましたのでh２に合わせてウィジェットのタイトルの背景色も変える必要があるとは考えていましたので、本日はｈ２と同じ系統の色で#838383の色に変更しようと考えました。
SEO賢威6.1のウィジェットのタイトル背景色の変更前のウィジェットの画像です
上図の赤丸の色が#000000ですので#838383のグレー系統の色へとへんこうさせます。
SEO賢威6.1のウィジェットのタイトル背景色の変更後の画像です。
上図のようにSEO賢威6.1のウィジェットの背景色がグレー色に変わりこのような感じになりました。
ついでに背景色のアンダーラインも赤色のラインから黄色へと変更いたしました。
管理画面＞＞外観＞＞テーマ編集＞＞design.cssと進んでいきます。
desigh.cssの・・・・・・サブコンテンツ / サイドバーという部分を探して編集します。
変更前
.sub-column hr{ clear: both; }
.sub-column h3{
padding: 0.7em;
border: 1px solid #959595; /*サイドバー見出しの枠線*/
border-bottom: 4px solid #a6a6a6; /*見出しの上部の線*/
background: url(./images/common/bg-dot.png) #333; /*背景にドットの透過画像*/
color: #fff;
font-weight: bold;
}
* html .sub-column h3{ background: #333; } /* IE6 */
.sub-column .contents h3{
margin: -0.5em;
margin-bottom: 0.8em;
}
変更後
.sub-column hr{ clear: both; }
.sub-column h3{
padding: 0.7em;
border: 1px solid #959595; /*サイドバー見出しの枠線*/
border-bottom: 8px solid #FFFF00; /*見出しの上部の線*/
background: url(./images/common/bg-dot.png) #838383; /*背景にドットの透過画像*/
color: #fff;
font-weight: bold;
font-size: 1.8em;
}
* html .sub-column h3{ background: #000000; } /* IE6 */
.sub-column .contents h3{
margin: -0.5em;
margin-bottom: 0.8em;
}
SEO賢威6.1のウィジェットタイトル背景色の変更方法でした。
Google+
この記事を読んだ人は次の記事も読んでいます。
賢威でヘッダー右上のサイトマップと固定ページをひもづける方法
SEO内的対策完璧・賢威６．１でｈ２見出しを画像に変更
SEO内的対策万全の賢威6.1＋ワードプレスでｈ３タグを太くしてみた
賢威6.1のヘッダー画像とトップとメニューの間を詰める方法です。
SEO賢威6.1の『コメントは停止中です』を削除する
内的SEO満載の賢威６．１でトップメニューの色と文字色を変える方法
SEO内的対策満載の賢威６．１で発リンク画像アイコンを付ける方法
賢威６．１でwidgetsのフォントサイズを変更するには
賢威６．１で見出しｈ２の文字を大きくする方法。
賢威６．１でトップを固定ページにし、最新情報と投稿ページたす方法
内的SEO満載の賢威6.1プリティー版のヘッダーストライプを消したい
賢威のヘルシーテンプレートで葉っぱの画像を削除する方法とは
SEO内的対策完璧な賢威6.1でアイキャッチ画像に枠線
賢威6.1+ワードプレスのヘッダー画像を横幅いっぱいに広げたい
SEO賢威6.1のフッターにグーグルマップを表示する方法
賢威＋ワードプレスでコピペで使える枠線のHTMLソース
SEO内的対策・賢威6.1のアイキャッチ画像に影を
賢威で投稿ページの最後に、次・以前のページをタイトルで入れる方法
賢威６．１のグローバルメニューのプルダウンの横幅を広げたい。
ワードプレス（賢威６．１）に枠線をつけました。
最近のコメント