WordPressのメニューバー&ブログタイトル&本文のフォントを変更

この記事には広告を含む場合があります。

記事内で紹介する商品を購入することで、当サイトに売り上げの一部が還元されることがあります。

「外観」「テーマ編集」 より style.cssを編集します。

メニューバー(ナビゲーションメニュー)のフォントを変更

【編集前】

/* =Basic structure
-------------------------------------------------------------- */

/* Body, links, basics */
html {
	font-size: 87.5%;
}
body {
	font-size: 14px;
	font-size: 1rem;
	font-family: Helvetica, Arial, sans-serif;
	text-rendering: optimizeLegibility;
	color: #444;
}

【編集後】

	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック',sans-serif;/*[deflt-font] Helvetica, Arial, sans-serif;*/
}

ブログタイトルのフォントを変更

【編集前】

/* =Main content and comment content
-------------------------------------------------------------- */
                    ・
                    ・
                    ・

.entry-header .entry-title {
	font-size: 20px;
	font-size: 1.428571429rem;
	line-height: 1.2;
	font-weight: normal;
}

【編集後】

/* =Main content and comment content
-------------------------------------------------------------- */
	font-weight: normal;
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック',sans-serif;/*tuika*/
}

コンテンツ内(本文)のフォントを変更

【 変更前 】

body.custom-font-enabled {
	font-family: "Open Sans", Helvetica, Arial, sans-serif;
}


【 変更後 】

body.custom-font-enabled {
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック',sans-serif;/*[deflt-font] "Open Sans", Helvetica, Arial, sans-serif;*/
}


フォントはお好みで設定してください。
基本的なことですが、見る側の人のPCに指定したフォントがインストールされていなければ、
指定したフォントは表示されませんのでフォントは複数指定します。