• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

FOXWP

WordPressの始め方と使い方をわかりやすく解説!

  • HOME
  • WordPressブログの始め方
  • おすすめテーマ
  • おすすめプラグイン
  • お問い合わせ
You are here: Home / WordPressテーマ / テーマカスタマイズ / Stork(ストーク)で文字サイズ(フォントサイズ)を変更する方法

Stork(ストーク)で文字サイズ(フォントサイズ)を変更する方法

2018年3月14日 2018年4月21日

Stork(ストーク)で文字サイズ(フォントサイズ)を変更する方法

この記事では、WordPressテーマ「Stork(ストーク)」で文字サイズを変更する方法を紹介します。

トップページと投稿ページの一部の文字サイズの変更方法を紹介します。文字サイズの変更には、CSSの編集が必要となります。詳しくはWordPressでCSSを編集する方法の記事を参考にしてください。

文字サイズはどうやって決まる?

Webサイトの文字サイズは、CSSのfont-sizeプロパティの値で決まります。

CSS

body {
  font-size: 15px;
}

文字サイズを大きくしたい場合はfont-sizeの数値を大きく、文字サイズを小さくしたい場合はfont-sizeの数値を小さくしてください。

font-sizeの値の単位は、「px」、「%」、「em」などがあります。単位については、この記事では詳しく説明しません。

例えば、15pxから文字サイズを大きくしたい場合は、次のように修正します。

CSS

body {
  font-size: 18px;
}

15pxから文字サイズを小さくしたい場合は、次のように修正します。

CSS

body {
  font-size: 12px;
}

値は任意ですので、お好みの大きさに合わせて修正を行ってください。

※注:この後の説明で出てくるfont-sizeの単位に「em」があります。これは小数単位で文字サイズの指定ができます。emの値が1以下の場合、小数点の前の「0」を省略することができます。つまり「.9em」と「0.9em」は同じ文字サイズを表します。

トップページの文字サイズを変更する

まずトップページの文字サイズを変更するCSSを紹介します。紹介する文字サイズに対応する箇所は、次の画像で記載のある通りです。

トップページの文字サイズ変更箇所

トップページ

次のCSSが上の画像の文字サイズに対応するCSSです。記載してあるfont-sizeの値は、デフォルトのものです。

デフォルトの文字サイズ

/* サイト説明 */
.site_description {
	font-size: 10px;
}

/* ヘッダー情報 */
.header-info a {
	font-size: .8em;
}

/* カード型タイトル */
.post-list-card .post-list .entry-content .entry-title {
	font-size: 1.15em;
}

/* カード型記事本文 */
.post-list-card .post-list .entry-content p {
	font-size: .9em;
}

/* ウィジェットタイトル */
.widgettitle {
	font-size: 1em;
}

上記のfont-sizeの数値をお好みに合わせて変更してください。

投稿ページの文字サイズを変更する

次に投稿ページの文字サイズを変更するCSSを紹介します。紹介する文字サイズに対応する箇所は、次の画像で記載のある通りです。

投稿ページの文字サイズ変更箇所

投稿ページ

次のCSSが上の画像の文字サイズに対応するコードです。記載してあるfont-sizeの値は、デフォルトのものです。

デフォルトの文字サイズ

/* 記事タイトル */
.single-title {
	font-size: 1.5em;
}

/* 本文 */
.entry-content p {
	font-size: 103%;
}

/* 見出し(h2) */
.entry-content h2 {
	font-size: 1.25em;
}

/* パンくずリスト */
#breadcrumb {
	font-size: .7em;
}

上記のfont-sizeの数値をお好みに合わせて変更してください。

カテゴリー:テーマカスタマイズ タグ:Stork(ストーク)

ブロガーやアフィリエイターで話題のWordPressテーマ
THE THOR(ザ・トール)
THE THOR(ザ・トール)とは、SEO・デザイン・機能の3拍子揃った一押しのWordPressテーマ
  • 自分好みのWordPressのデザイン
  • なかなか検索順位が上がらないといったSEOの悩み
  • アフィリエイトでもっと効率良く稼ぎたい

こういった悩みをテーマを変更するだけで簡単に解決できます。
WordPressのカスタマイズやトラブルで時間を取られている方は、ぜひ利用してみてください。

THE THOR(ザ・トール)の特徴を詳しくみる

WordPress初心者の方に読んで欲しい記事

  • あとで後悔しない!WordPress初期設定の基本事項
  • 安全にサイトを運営しよう!WordPressセキュリティ対策の基本マニュアル

おすすめプラグイン

【2018年版】コメント機能を改善するおすすめWordPressプラグイン

【2018年版】コメント機能を改善するおすすめWordPressプラグイン

Post Snippetsの使い方|初心者でもショートコードやPHPコードが簡単に利用できる

Post Snippetsの使い方|初心者でもショートコードやPHPコードが簡単に利用できる

【2018年版】WordPressのおすすめPDFプラグイン

【2019年版】WordPressのおすすめPDFプラグイン

Redirection(WordPressプラグイン)の使い方と注意点

Redirectionの使い方と注意点|プラグインで簡単リダイレクト!

おすすめテーマ

ブログ・アフィリエイトにおすすめのWordPressテーマ

ブログ・アフィリエイトにおすすめのWordPressテーマ【2019年版】

ポートフォリオ向けWordPressテーマ

ポートフォリオ向けWordPressテーマ|魅せるギャラリーが簡単にできる

女性向けおしゃれなWordPressブログテーマ特集

【女性向け】おしゃれでかわいいWordPressブログテーマ特集!

ヘッダーに動画を設定できるWordPressテーマまとめ

ヘッダーに動画を設定できるWordPressテーマまとめ

Previous Post: « Stork(ストーク)でコメント欄を非表示・削除する方法
Next Post: 検索順位チェックツールGRCをMacで利用する手順を徹底解説! »

Primary Sidebar

最新WordPressテーマ

あなたの悩みは?

WordPress
セキュリティ
WordPress
トラブル
アクセスアップアフィリエイト

カテゴリー

  • WordPress
    • WordPressのSEO対策
    • WordPressのエラー・トラブル
    • WordPressのセキュリティ対策
    • WordPressの使い方
    • WordPressカスタマイズ
  • WordPressテーマ
    • おすすめテーマ
    • テーマカスタマイズ
  • WordPressプラグイン
    • プラグインカスタマイズ
  • WordPress入門講座
  • WordPress設定関連
  • お役立ち情報
    • 便利ツール
  • アフィリエイト
  • レンタルサーバー
    • ColorfulBox
    • mixhost
    • エックスサーバー
    • ロリポップ!
おすすめASP
トップページへ

プライバシーポリシー|お問い合わせ
Copyright © 2019 FOXWP All rights reserved.