WordPressへの道

WordPressを始めたばかり。備忘録として書き込みます。

テーマTwenty Sixteenのカスタマイズ

フォント変更☆明朝→ゴシック・メイリオ

Twenty Sixteenのフォントは明朝体でなんかイマイチ。 そんなわけで、私は大好きなメイリオを設定したいと思います。

f:id:akonomunon:20160212111345j:plain

「外観」テーマの編集から「style.css」を選択。
[ctrl+f]で「font-family」を検索し、「textarea」のフォントを変更します。

font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "MS Pゴシック" , "MS PGothic" , sans-serif;

私は上記のように設定しました。

ウィジェットのボーダー色変更

次にサイドバーのウィジェットを区切っているラインの色を変えたいと思います。

f:id:akonomunon:20160212112344j:plain

「.widget」で検索して「border-top」の色を変更。

検索フォームの色変更

ボーダーの色を変えたら、検索フォームも変えたくなりました。f:id:akonomunon:20160212113720j:plain

「input」で検索し、backgroundとborderの色を変えます。
backgroundは検索文字を入力するところ。
borderはその回りの線です。
次は右側の虫眼鏡マークのボタンの色を変えます。

f:id:akonomunon:20160212113941j:plain

こちらは「button」で検索しました。
backgroundで四角い部分の色を変えます。
虫眼鏡の色はcolorで変えられるはずです♪