以前にTwenty Fourteenの配色を変更する記事を書いたが、今回は検索枠部分の背景色を変更してみた。
Twenty Fourteenの左サイドバー部分にある検索枠である。
デフォルトでは検索枠はほぼ透過しており、サイドバー部分の背景色が変われば検索枠部分も背景色が変わったかのように見える。
しかし、検索枠のみの配色を変えるには別の指定が必要なのである。
style.cssの編集
ほんの少しのコードなんだけど、意外にも解析が大変であった．．．.primary-sidebar .widget input { background-color: rgba(100, 100, 100, 0.1); border-color: rgba(100, 100, 100, 0.2); color: #000; } |
本記事上部の画像の色設定と透過となっているので、適宜変更を。
感想
サイト内の情報量が膨大になった時に役に立つ検索機能。検索枠が目立つようになれば、使いやすいサイトとなるので、ぜひとも工夫を！！
関連記事
Twenty Fourteenの背景色を変更するWordPressのデフォルトテーマにも採用されたTwenty Fourteenの背景色を変更するカスタマイズの紹介です。意外と手こずるカスタマイズですので、参考になれば幸いです。
Twenty FourteenのヘッダーにSNSアイコン設置レスポンシブで使いやすいWordPressテーマTwenty Fourteenのヘッダー部分に、SNSアイコン画像を貼り付けるカスタマイズを紹介します。
Twenty Fourteenのトップをタイトル一覧にするTwenty Fourteenのトップページをカスタマイズし、アイキャッチ画像と記事タイトルの一覧にしスッキリとレイアウトにする方法を紹介します。
Twenty Fourteenのコンテンツ部分横幅を広げるTwenty Fourteenはデフォルト状態ではメインコンテンツ部分が若干狭いので、余白サイズを変更し横幅を広げるカスタマイズを紹介します。
