WordPress関連コラム  2020.9.14

超簡単!ワードプレスで文字サイズを変更する3つの方法

「ワードプレスでブログを書いているけど、文字サイズが変更できない!」とお悩みではありませんか?

ワードプレスの投稿ページや固定ぺージのビジュアル画面には、文字サイズを変更するボタンが実装されていません

そのため、文字サイズを変更したいのであれば、プラグインを使ったりhtml画面でタグを打ち込む必要があります。

今回は、ワードプレスで文字サイズを変更する方法を簡単にご紹介!

すぐに実践できるよう分かりやすく解説しているので、参考にしてください。

ワードプレスの文字サイズを簡単に変更できるようになって、視覚的に訴える記事を作りましょう。

ビジュアル画面で簡単に文字サイズ変更をする方法

「ビジュアル画面で簡単に文字サイズを変更したい!」という人は、プラグイン「TinyMCE advanced」をインストールしましょう。

TinyMCE advanced

TinyMCE advancedを実装すれば、読み手により伝わりやすい文字装飾や表の作成などが簡単にできるようになるのです。

たとえば、以下のようなことができるようになります。

  • 文字サイズ・フォントの変更
  • 表づくりができるテーブルタグの挿入
  • 「続きを読む」のタグ挿入
  • YouTube動画の挿入

これらのことをHTMLやCSSでコンテンツに実装しようとすると、時間と労力がかかってしまいます。

専門知識なしでワンクリックで作れるようにしたいのであれば、TinyMCE advancedを活用しましょう。

TinyMCE advancedの使い方

早速、プラグイン「TinyMCE advanced」の使い方を見ていきましょう。

まずは、ワードプレス管理画面のメニューから「プラグイン」>「新規追加」で「TinyMCE advanced」を検索し、インストールしてください。

インストールが完了したら、「有効化」をクリックします。

これだけで、投稿のビジュアル編集画面から文字サイズが変更できるようになっているのです。

実装されていることを確認するためには、ワードプレス管理画面のメニューから「投稿」>「新規追加」を開き、「ビジュアル」のタブをクリックします。

すると、まるでMicrosoftのWordのように、簡単に文字装飾や表の挿入ができるようになっているのです。

文字サイズを変更するには、変更したい文字列を選択して「フォントサイズ」から変更したい大きさをクリックします。

たったこれだけで、文字サイズが変更されます。

TinyMCE advancedのカスタマイズ方法

もし、「もっと自分に使いやすいように表示内容を変えたい」と思うのであれば、カスタマイズすることも可能です。

カスタマイズは、ワードプレス管理画面のメニューから「設定」>「TinyMCE advanced」で「エディター設定」をクリックします。

入れたい機能があれば、「使用しないボタン」の欄のアイコンをドラッグ&ドロップして画面上のエディターメニューに入れると、実装されます。

メニューバーは3段までであれば、入れることが可能です。

ボタンの配置も簡単に変更できるので、使いやすいようにカスタマイズしましょう。

テキスト画面でタグを入れて文字サイズを変更する方法

「余計なプラグインをインストールしたくない」と言う人もいるでしょう。

プラグインを使わずに文字サイズを変更するには、テキスト画面にタグを入れなければなりません。

まずは、ワードプレス管理画面のメニューから「投稿」>「新規追加」をクリックし、「テキスト」のタブを開きましょう。

ここにタグを打ち込めば、簡単にサイズ変更が可能です。

<font size=”大きさを指定”>サイズを変更したい文字</font>

このように、サイズ変更したい文字を挟んでタグを打ち込みます。

「大きさを指定の数字」は1〜7までの数字を入れ、段階的にフォントサイズを指定しましょう

フォントサイズ1

フォントサイズ5

フォントサイズ7

font size=”1″が一番小さく、font size=”7″が一番大きくなっています。

そこまで難しいタグではないので、何度か使っているうちにタグも覚えられるでしょう。

デフォルトの文字サイズをCSSで変更する方法

部分的でなく、デフォルトの文字サイズを変更したいのであれば、CSSファイルから変更する必要があります。

文章全体の文字を小さくしたり大きくしたい時に、参考にして下さい。

CSSファイルから文字サイズを変更するには、ワードプレス管理画面のメニュから「外観」>「テーマの編集」から文字サイズを変更したいテーマのスタイルシートを選びましょう。

スタイルシートの一番下に、以下の記述を加えればデフォルトの文字サイズは変更されます。

p { font-size:18px;}

18pxの部分が文字の大きさを指定する箇所です。

どの大きさの文字サイズにしたいのかを事前に確認しておきましょう。

目安としてワードプレスの文字サイズの標準は、15px程度です。

それ以上大きいサイズを指定すれば「大きい」という印象を与えます。

記述できたら「ファイルを更新」をクリックし、記述に誤りがなければ指定した文字数に変更されているはずです。

注意!必ずバックアップを取っておこう

必ずCSSファイルのバックアップを取っておきましょう。

なぜなら、編集作業中に間違った箇所を削除してしまった場合、ぐに元に戻すことができるからです。

CSSへの打ち込みを1文字でも間違うと、サイト全体が表示されなくなってしまう可能性も0ではありません

万が一に備えて、必ずバックアップを取っておきましょう。

ワードプレスの文字サイズを変更するメリットとは?

そもそも「文字サイズを変更した方が良いの?」「文字サイズなんてそのままで良くない?」と思う人もいるかもしれません。

結論から言うと、文字サイズの変更はあってもなくても問題なくユーザーにコンテンツを届けることができます。

しかし、文章の中で強調したい言葉を大きく表示することで、メリハリのあるコンテンツ作りができるメリットがあります。

紙の本と異なり、WEB上で公開されているコンテンツは「視覚的に見るもの」だと聞いたことがあるかもしれません。

そのため、「読まれる」ためにしっかり内容の詰まった文章でコンテンツ作りをしなければならない一方で、視覚的に「面白そうだ」と思わせる工夫も必要です。

たとえば、以下のような箇所を大きくするだけで、記事の印象を高めることができます。

  • 重要な箇所
  • 読んで欲しい箇所
  • インパクトを持たせたい箇所

一部を大きく表示させるだけでも、 ページを開いた瞬間に、「読みやすそう」「おもしろそう」と思ってもらえます。

このように、文字サイズでメリハリを付けることは有効と言えます。

まとめ

ワードプレスの投稿ページや固定ぺージのビジュアル画面には、文字サイズを変更するボタンが実装されていません。

そのため、文字サイズを変更したいのであれば、プラグインを使ったりhtml画面でタグを打ち込む必要があります。

ワードプレスの文字サイズを自由に変更し、視覚的に訴える記事を作りましょう。