Attitudeのフォント変更

このホームページをWordPressで作成するにあたり、「Attitude」というテーマを使っています。

このテーマでは、タイトルなどのフォントが、英数字については筆記体っぽい洒落たフォントになっているのですが、日本語フォントはゴシック系のフォントになっており、日本語とアルファベットが混在すると見た目がいまひとつです。

このため、フォントをゴシック系に統一しました。

外観→カスタマイズ→Design Options→Custom CSS で、

body, input, textarea {
color: #000000;
font: 14px 'Avenir', 'Helvetica Neue', 'Helvetica', 'Arial', 'Hiragino Sans', 'ヒラギノ角ゴシック', YuGothic, 'Yu Gothic', 'メイリオ', Meiryo, 'MS Pゴシック', 'MS PGothic', sans-serif;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Avenir', 'Helvetica Neue', 'Helvetica', 'Arial', 'Hiragino Sans', 'ヒラギノ角ゴシック', YuGothic, 'Yu Gothic', 'メイリオ', Meiryo, 'MS Pゴシック', 'MS PGothic', sans-serif;
}
#site-title {
font: 36px 'Avenir', 'Helvetica Neue', 'Helvetica', 'Arial', 'Hiragino Sans', 'ヒラギノ角ゴシック', YuGothic, 'Yu Gothic', 'メイリオ', Meiryo, 'MS Pゴシック', 'MS PGothic', sans-serif;
}
.entry-title {
font: 24px 'Avenir', 'Helvetica Neue', 'Helvetica', 'Arial', 'Hiragino Sans', 'ヒラギノ角ゴシック', YuGothic, 'Yu Gothic', 'メイリオ', Meiryo, 'MS Pゴシック', 'MS PGothic', sans-serif;
}

という記述を追加することで、フォントが変更できました(本文については、フォントサイズと文字色も変更しています)。

なお、私がWordPressの使い方を習得するのにあたっては、以下の書籍を参考にさせていただきました。


WordPressについては、Web上にもたくさんの情報がありますが、きちんと理解して使いたい場合には、一度書籍も読んでおいた方がいいかもしれません。

 


このサイトで書いている、ワードプレスに関するブログ記事を、「さとやまノート」という別のブログページに、あらためて整理してまとめました。

他のワードプレス記事にも興味のある方は「さとやまノート」をご覧ください。