【初心者向け】WordPressブロックエディタでテキストを入力する方法〈Gutenbergの使い方 その2〉

WordPress標準ブロックエディタ「Gutenberg（グーテンベルグ）」での記事作成入門。第二回の今回は、記事制作の基本中の基本、テキストの入力にまつわる使い方を見ていきましょう。
きっちりと整えられた文章を作ることで可読性も上がり、より多くの人に長く記事を見てもらうことが期待できます。テキスト入力の基本をマスターして、よりよい記事を作っていきましょう。

WordPressブロックエディタにテキストを入力する

それでは、実際にエディタを触っていきましょう。
（注　本記事ではバージョン: 5.8.1を使用していきます）

タイトルを入力する

本文の前に、まずはタイトルを入力していきましょう。
画面上部の「タイトルを追加」という大きな文字をクリックすることで、タイトルを入力できるようになります。こちらに任意のタイトルを打ち込んでください。

段落ブロックを追加

次にテキストを入力します。通常のテキストの入力は「段落」というブロックが積み重なった状態とみなされるため、まずは、「段落」ブロックを追加していきます。

とはいえ特別な操作をする必要はありません。「ブロックを追加するには / を　入力」という文字が書かれている箇所をクリックし、テキストを入力してください。テキストを入力すれば、任意「段落」ブロックを追加することができます。

また、画面左上や「ブロックを追加するには / を　入力」の右側にある「＋」ボタンからも段落を追加することができます。

段落と改行について

文章を入力し、Enterキー（もしくはReturnキー）を押すと、少し間を開けた下側に次の段落が生成されます。実際にページに表示される際も同じように少し間を開けた別の段落として表示されることが多いようです。（テーマにより異なる）

一方で、段落は変えたくないけれど改行だけしたい。ということもあるかと思います。
そのような場合は、Shiftキーを押しながら、Enterキー（もしくはReturnキー）を押すことで、段落を変えずに改行することができます。

テキストを装飾する

テキストを入力すると、テキストの上部にテキスト用の装飾メニューが現れます。

「 B 」をクリックすることで、文字を太文字にすることができます。
「 I 」をクリックすることで、文字を斜体にすることができます。

また、右側の「 ⌄ 」をクリックすると、ドロップダウンメニューが現れます。
こちらから、打ち消し線をつけたり、上付き文字などの装飾を加えることも可能です。

テキストの大きさを変える

テキストのの大きさを変えるには、右側のブロックエディタメニューを使用します。

まず、画面右上の「ブロック」タブをクリックし、「段落」のブロックエディタメニューを開きます。
次に、「タイプグラフィ」メニューを展開し（①）、「フォントサイズ」のドロップダウンメニューから大きさを選びます（②）。「デフォルト」「小」「標準」「大」「特大」が用意されています。

また、「特大」以上の大きさを指定したい場合や、特定の大きさを指定したいと言った場合は、「フォントサイズ」のドロップダウンメニュー隣の「カスタム」となっている箇所に数値を入力することで、任意の大きさに変更することが可能です。

段落の間隔を変える

次に、段落同士の間隔を変更してみます。

「段落」のブロックエディタメニューから「タイプグラフィ」メニューを展開し（①）、「行の高さ」の部分に任意の数値を入力します（②）。こうすることで、段落同士の間隔を変更することができます。

テキストの色を変える

次に、テキストの色を変更してみます。

「段落」のブロックエディタメニューから「色」メニューを展開し（①）、「テキスト色」の部分から、変更したい色を選択します（②）。

また、任意の色に変更したい場合は、下の「カスタムカラー」リンクをクリックすると、カラーピッカーが展開します。こちらの画面から色を選択することで、任意の色をテキストにつけることができます。

また、変更した色を元に戻したい場合は、「クリア」ボタンを押せば色がデフォルトの状態に戻ります。

テキストの背景に色をつける

次に、テキスト背景に色をつけてみます。

「段落」のブロックエディタメニューから「色」メニューを展開し（①）、「背景色」の部分から、変更したい色を選択します（②）。

また、背景色の高さは段落の高さに応じて高さが変化します。

テキストの揃え位置を変える

次に、テキストの揃え位置を指定してみます。

まず入力テキストを選択し、テキストの上部の装飾メニューを展開してください。
次に、メニューから三本線の「 ≡ 」マークをクリックします（①）。
すると、下部に「テキスト左寄せ」「テキスト中央寄せ」「テキスト右寄せ」を選択するメニューが現れますので、指定したい揃え位置を選択します（②）。

テキストにリンクの貼る

次に、テキストにリンクを追加してみます。

リンクを追加したいテキストを選択し、テキストの上部の装飾メニューを展開してください。展開されたら、装飾メニューからリンクマークをクリックします（①）。
すると、下部にURLの入力欄が出現しますので、入力欄にリンク先のURLを入力し、右側の矢印「⤾ 」マークをクリックします（②）。これで、リンクを追加することができました。

また、リンク先を別タブで開きたい場合は、URL入力欄下側の「新しいタブで開く」ボタンを押すことで、URLを別のタブで開くリンクを挿入できます。

本日のまとめ

テキスト入力は、記事制作の基本中の基本。だからこそ、さまざまな見せ方のバリエーションをマスターすることで、読みづらい記事をなくしより読まれる記事を作っていくことができます。読みやすく内容の濃い記事を更新することで、ご自身のWEBサイトの価値を高めていきましょう。

WordPressサイトの構築ならマックスストーン

マックスストーンでは、お客様の業種業態に合ったWordPressサイト構築のお手伝いをさせて頂いております。
WEBの知識や経験に乏しいお客様にも、一人ひとり丁寧にご説明差し上げております。
制作事例はこちらからご確認頂けます。ぜひご覧ください。