TCDテーマSERUM：サイドアイコンボタンの文字色と背景色を変更する方法

Q.サイドアイコンボタンでアイコンを表示した場合、背景色が白で文字色がアクセントカラーになります。アイコンを表示したまま、背景色をアクセントカラー、文字色を白にしたいです。

デフォルトでは以下のようになっています。

アイコンを表示する場合

• 背景色：白
• 文字色：アクセントカラー

アイコンを表示しない場合

• 背景色：アクセントカラー
• 文字色：白

▼変更前イメージ

A.背景色と文字色を反転させる場合、TCDテーマオプション＞基本設定＞カスタムCSSに以下を入力し変更してください。

/* アイコンありの調整 */
#side_icon_button a { 
    color: #fff !important; /* 文字色を白に設定 */
    background: #937960 !important; /* 背景色をブラウンに設定 */
}
/* アイコンなしの調整 */
#side_icon_button a.no_icon {
    border-color: #937960 !important; /* ボーダー色をブラウンに設定 */
    color: #937960 !important; /* 文字色をブラウンに設定 */
    background: #fff !important; /* 背景色を白に設定 */
}

カラーコードはアクセントカラーに合わせて適宜ご変更ください。

▼変更後イメージ

サイトアイコンボタンについては、以下のページもご覧ください。

サイドバーのアイコンボタンでサイト内外の導線を確保しよう | SERUM皮フ科クリニック

SERUMはサイドバーが特徴的なテンプレートです。左右のサイドバーには次のコンテンツを表示できます。