こんにちは、nozomiです。
ブログの記事を読んでもらうには、内容だけでなく「見た目」もとても大切です。
文字ばかりが並んだ記事では、読者さんが読むのに疲れてしまい、途中で離脱してしまうこともありますよね。
せっかく書いた記事なので、最後まで読んでもらいたいですよね＾＾
この記事では、WordPressのブロックエディタ（Gutenberg）で、記事を読みやすく、わかりやすく装飾するテクニックをご紹介します。
初心者さんにも使いやすいように、よく使う装飾方法を４つ選びました。
最初はこの装飾方法を覚えておけばOKですよ♪
目次
WordPressでよく使う文字装飾の方法
今回はCocoonの画面で解説します。
テーマによっては少し操作が違うかもしれませんが、この記事を参考にしながら、試してみてくださいね。
ご紹介する装飾方法は次の４つです。
- 文字の大きさを変える
- 文字に色をつける
- 文字を太字にする
- 文字の背景に色をつける
それでは、ひとつずつ解説していきますね。
文字の大きさを変える
①まず、大きさを変えたい文字のブロックをクリックして選択します。
②画面右側の①「ブロック」タブをクリックし、②「タイポグラフィ」のS～XLからサイズをクリックして選びます。
③サイズを変えると、文字の大きさは下の画像のようになります。
文字に色をつける
文字に色をつける方法は2種類あります。
- ブロックの文字全部に色をつける方法
- 文字ごとに色をつける方法
それぞれ解説していきますね。
ブロックの文字全部に色をつける方法
①色をつけたい文字のブロックをクリックして選択します。
②画面右側の①「ブロック」タブをクリックし、【色】の②「テキスト」をクリックします。すると、カラーパレットが表示されるので、③使いたい色をクリックして選びます。
③赤を選んでみると、下の画像のように、ブロックの文字全体が赤になりました。
文字ごとに色をつける方法
①①色をつけたい文字をドラッグし、メニューの②「A（文字）」のマークをクリックします。すると、文字色の一覧が表示されるので、③使いたい色をクリックして選択します。
ただ色をつけるだけでなく、さらに太字にすることもできます。
②赤を選んでみると、下の画像のように、「色をつける」の文字が赤になりました。
文字を太字にする
①①太字にしたい文字をドラッグし、メニューの②「A（文字）」のマークをクリックします。表示されたリストの③「B 太字」をクリックして選択します。
②下の画像のように文字が太くなりました。
文字の背景に色をつける
①①背景に色をつけたい文字をドラッグし、メニューの②「ペン（文字）のマーク」をクリックします。表示されたリストから③使いたいマーカーをクリックして選びます。
②黄色マーカーを選ぶと、下の画像のように文字の背景が黄色になりました。
まとめ
文字装飾は、読者さんが読みやすい記事にするための大切な工夫です。
ただし、やりすぎると逆に読みにくくなってしまうこともあります。
強調したいポイントだけに絞って装飾を使うことで、メリハリのある読みやすい記事になりますよ。
また、装飾にばかり時間をかけすぎず、「まずは書くこと」を大切にするのもポイントです。
少しずつ自分のスタイルに合った装飾の使い方を見つけていきましょう！
