【LION BLOG】サイドバーに設置した検索ウィジェットを『LION MEDIA』風にカスタマイズ

【LION BLOG】サイドバーに設置した検索ウィジェットを『LION MEDIA』風にカスタマイズ

少し前に『LION BLOG』サイドバーの背景色を変更する方法をご紹介しましたが、背景色を「白」にして検索ウィジェットを設置した場合、背景に溶け込んでしまい見づらくなってしまいます。

【LION BLOG】サイドバーに設置した検索ウィジェットを『LION MEDIA』風にカスタマイズ

そこで、検索ボックスの背景色を変更(カスタマイズ)する方法をご紹介したいと思います。

広告

CSSを追加する

 

外観 > カスタマイズ を選択し、カスタマイザーを表示させます。次に、一番下の「追加CSS」をクリックし開きます。

『LION BLOG』の検索ボックスのCSSは「.searchBox__form」で指定されているので、そこにボックスの背景色を記述し変更します。

『LION MEDIA』で指定されている背景色は「#F2F2F2」です。

.searchBox__form { background: #F2F2F2; }

 

searchBoxの後の「 _ 」(アンダーバー)は1つに見えますが、2つあります。

 

これで「公開」ボタンを押せば、終了です。

広告