WordPressを開設したものの、グーテンベルグで記事を書く方法がわかりません。初心者向けに教えてください。
hideこういった疑問に答えます。
WordPressで記事を書くときに使うのがGutenberg（グーテンベルク）です。
最初はとまどうかもですが、最低限必要な使い方さえ覚えてしまえば誰でも簡単に記事を書けます。
本記事では、グーテンベルクで記事を書いて公開するまでの流れを、わかりやすく解説しました。
よく使うブロックの使い方も紹介してますので、初心者の方はぜひごらんください！
グーテンベルグで記事を書くイメージをつかむ
グーテンベルグは、WordPressに標準装備されたエディタです。
エディタとは、記事を書くための道具。ふだんパソコンで、メモ帳とかのアプリを使ってませんか？あれもエディタです。
グーテンベルグは、ブロックエディタとも呼ばれており、ブロックを使って記事を書くのが特徴のエディタです。
以降では実際にWordPressの画面を見ていきましょう。
なお、テーマは、WordPressインストール時に初期設定された「Twenty Twenty-Four」をそのまま使っています。
WordPressで「新規」＞「投稿」をクリックします。
すると、グーテンベルグの画面が開きます。
ここにブロックを追加して記事を書いていきます。
グーテンベルグはブロックでできている
グーテンベルクで試しに記事を少し書いてみました。
上記をブロックで見てみると、こんなイメージ↓
上記のように、グーテンベルグで作成した記事は、段落や箇条書き、画像のブロックで構成されているわけです。
ブロックの種類
ブロックの種類を説明します。
エディタ内にある [+]ボタンをクリックしてみましょう。
すると、以下のような表示がでてきます。これがブロックです。
「すべて表示」をクリックすると、左側にブロックが全て表示されます。
ブロックの数は、ご使用のテーマによって異なります。WordPressインストール時に初期設定されたテーマ「Twenty Twenty-Four」だと90個ほど。
ただ、ご安心ください。全てを理解する必要はありません。
よく使うブロックは、以下の４つくらい。
- 見出し
- 段落
- リスト
- 画像
実際のアイコンは以下のとおり。
まずは上記の４つを覚えておけばOKです。
ブロックの性質
ブロックには以下のような性質があります。
- 変換
- 移動
- 複製
- グループ化
- パータン作成
上記のなかで、「変換」「移動」は割と使うので覚えておきましょう。
変換
変換とは、
・段落ブロック←→見出しブロック
・段落ブロック←→箇条書ブロック
のように、ブロックの切り替えを簡単にできる機能です。
例として、「段落ブロック→見出しブロック」をやってみます。
以下のように、文章を３つ書いたあと、「あ、これを箇条書きにしたい」と思った場合もあるかと。
そんなときは、文章３つを選択した後、このボタンをクリックします。
すると、変換のメニューが出てくるので、その中から、「リスト」を選びます。
すると、以下のように、一瞬で箇条書きに変わります。
上記のように、ブロックを一瞬で変換できるのが、グーテンベルグの便利な点です。
移動
移動とは、その名のとおりで、ブロックを上下に移動できる機能です。
たとえば、以下の記事で「文章１」を「文章２」の下に移動したい場合ってこともあるかと。
そんなときは、「文章１」にカーソルを置き、出てきたメニューの中にある下向きのマークをクリックします。
すると、「文章１」を「文章２」の下に簡単に移動できます。
移動の方法として、もう１つやり方があります。
それは、メニュー内の以下のマークをつまみ、ドラッグ＆ドロップして、ブロックの場所を移動させる方法。
この移動を使うと、記事執筆のスピードが早くなりますよ。
覚えておきたい２つの名前
以下の２つは覚えておきましょう。
- サイドバー
- ツールバー
サイドバー
画面の右側に表示された設定エリアのこと。
ブロックを選択していないときは「投稿」タブがアクティブになり、記事の細かい設定をできます。
ブロックを選択しているときは「ブロック」タブがアクティブになり、ブロックの細かい設定ができます。
ツールバー
記事内の各ブロックにカーソルをあてると、そのすぐ上に表示されるのがツールバー。ブロックの変換や細かい設定をできます。
グーテンベルグで記事を書いてみる
では、記事を書いてみましょう。
初心者でもわかるように、グーテンベルクを開いて記事を書き、公開するまでの一連の流れを、ゼロから解説します。
- タイトルを記入する
- 本文を書く
- 見出しブロックを使う
- 箇条書きブロックを使う
- 画像ブロックを使う
- 記事を公開する
step1: タイトルを記入する
まずはタイトルを記入します。
タイトルは後からでも変更できるので、決まっていない場合は仮のタイトルでもOKです。
以下の場所にカーソルをあて、タイトルを記入しましょう。
タイトルを記入し終わったら「Enterキー」を押します。
Enterキーを押すと、下の段落ブロックにカーソルが移動します。
段落ブロックは文章を書くブロックですね。
step2: 本文を書く
続いて、本文を書いていきます。
文章を書いて「Enter」を押す（改行する）と、その下の「段落ブロック」にカーソルが移動します。
文章は上記の繰り返し。文章を書いて改行、文章を書いて改行、を繰り返していきます。
なお、段落ブロックかどうかはサイドバー（またはツールバー）から確認できます。
ブロックを選択したときに、サイドバーの一番上にブロックの種類が表示されます。
文字の色や大きさや変える
段落ブロックのサイドバーで設定します。
step3: 見出しブロックを使う
記事を見やすくするための「見出しブロック」を使ってみましょう。
見出しブロックを使う方法は以下の３通りあります。
- 段落ブロックから見出しブロックに変換する
- [+]マークを押して「見出し」を選ぶ
- 「##」を最初に書く
今回は、１番目の方法を紹介します。これは、ブロックの性質のひとつ「変換」を使う方法ですね。
段落ブロックで、見出し用の文字を記入した後、ツールバー内の段落ブロックのマークをクリックします。
ポップアップメニュー内の「見出し」をクリックします。
すると、段落ブロックが見出しブロックに変換されます。
ツールバーで、見出しの種類も変更できます。
step3: 箇条書きブロックを使う
記事の中でまとめでよく使う箇条書きブロックは以下の３通りあります。
- 段落ブロックから見出しブロックに変換する
- [+]マークを押して「リスト」を選ぶ
- 「-」を最初に書く
今回は、１番目の方法を紹介します。これも、ブロックの性質の１つ「変換」を使う方法ですね。
段落ブロックで、箇条書き用の文字を記入した後、それらを選択して、ツールバー内の段落ブロックのマークをクリックします。
ポップアップメニュー内の「リスト」をクリックします。
すると、段落ブロックが見出しブロックに変換されます。
ツールバーで、数字付きの箇条書きにも変更できます。
前述した「見出し」も、今回の「箇条書き」も、基本は段落ブロックで記事を書いていけば、後から該当のブロックに変換できる、というわけです。
step5: 画像ブロックを使う
記事の中に画像を追加したいときもありますよね。そんなときに使うのが「画像ブロック」です。
画像ブロックの使い方は以下の２通りあります。
- 画像をグーテンベルグにドラッグ＆ドロップする
- [+]マークを押して「画像」を選ぶ
まずは方法１を説明しましょう。
パソコンのフォルダから、挿入したい画像をグーテンベルグにドラッグ＆ドロップします。
すると、これだけで画像ブロックとしてグーテンベルクに追加されます。
いちど登録した画像を記事内に挿入するときは、2番目の方法を使いましょう。[+]ボタンを押して、「画像」を選べばOKです。
step6: 記事を公開する
「段落」「見出し」「箇条書き」「画像」のブロックを使うと、ブログっぽくなってきましたよね。
記事が完成したらいよいよ記事を公開しましょう。
もし、公開前にいったん記事を保存しておきたいときは、「下書き保存」をクリックすればOKです。
公開前に最低限やっておく設定は以下の2つです。
- URL（パーマリンク）
- アイキャッチ画像
いずれもサイドバーから設定できます。
URL（パーマリンク）
URL（パーマリンク）は、記事のURLとなるもの。
URLは、公開後に変更すると、内部リンクのエラーなったり、SEOの評価がリセットされたり、と不都合が生じます。よって公開後にはURLは変更できない、というつもりでURLを決めましょう。
URLを設定するときは、いったん記事を保存します。
サイドバー内のURLをクリックし、表示されたメニューの枠内に、URLの後半部分を入力します。
記事の内容を完結に表した英語にしておくのがおすすめです。
入力すると、URLに反映されます。
アイキャッチ画像
アイキャッチ画像は記事の冒頭に表示する画像のこと。
アイキャッチ画像の設定方法は、前述した画像ブロックのやりかたとほぼ同じです。
サイドバーの以下の枠内に画像をドラッグ＆ドロップする、もしくは、以下の枠内をクリックして画像を選択する、です。
設定が終わったらいよいよ「公開」です。
右上にある「公開する」ボタンをクリックします。
再確認されるので、「公開」ボタンをクリックします。
以上で、記事の公開が完了！
これでグーテンベルクで記事を書けますね。
他のブロックやレイアウトの変更などは徐々に覚えていけばOKです。
グーテンベルグの記事執筆を時短するショートカット
ショートカットを使うと、記事執筆を時短できます。
少しずつ覚えていくことをおすすめします。詳しくは以下をご覧ください。
WordPressのグーテンベルグでよくある質問
グーテンベルグでよくある質問として、以下があります。
- ブロックの削除ってどうやるの？
- ブロックのコピー（複製）ってどうやるの？
以降で説明しましょう。
ブロックの削除
ブロックを削除するには以下の２とおり。
- ブロックを選択してツールバーから削除
- BackSpaceかDeleteで削除
１番目の方法を紹介します。
削除したいブロックにカーソルをあて、ツールバーの[︙]をクリックした後、「削除」を選びます。
ブロックのコピー（複製）
ブロックを削除するには以下の２とおり。
- ブロックを選択してツールバーから複製
- 複数を選択してCtrl+C（and Ctrl+V）
ブロックを選択してツールバーから複製
複製したいブロックにカーソルをあて、ツールバーの[︙]をクリックした後、「複製」を選びます。
すると、同じブロックが作成されます。
複数を選択してCtrl+C（and Ctrl+V）
複数のブロックを離れた位置に複製したい場合は、複数ブロックを選択したのち、「Ctrl+C（コピー）」→「Ctrl+V（貼り付け）」するとよいです。
グーテンベルグ対応のおすすめ有料テーマ
最後に、グーテンベルグ対応のおすすめ有料テーマを紹介します。
有料テーマを導入するメリット
私が当サイトで使っているWordPressテーマは、有料のものです。
しかし本記事では、WordPressインストール時に初期設定された無料のテーマ「Twenty Twenty-Four」をそのまま使いました。
なぜかというと、ブロックの基礎的な使い方を初心者向けに説明するため。
その甲斐あって、「無料のテーマでも、グーテンベルグで最低限のブログ記事を書けること」をご理解いただけでしょう。
ただ、「これからブログを長く続けて行きたい」という方には、有料テーマの導入をおすすめします。
グーテンベルグ対応の有料テーマを使うと、専門知識がなくてもおしゃれなデザインのブログを簡単に作成できるからです。
グーテンベルグ対応のおすすめ有料テーマ
ブログ記事を500以上執筆してきた私がおすすめするテーマは「SWELL」です。
- おしゃれなブログを簡単に作成できる
- 記事装飾も簡単で、記事執筆を時短できる
- SEO対策が万全なので、記事執筆に集中できる
- 利用者が多くマニュアルも完備で、トラブル時も安心
- 最新のWordPressエディタに完全対応。今後もテーマの乗換えが不要
料金は17,600円（税込み）で、デザインテーマの中ではやや高めですが、支払う価値は十分すぎるほど。
hide当ブログでもSWELLを使ってます。おしゃれなブログを簡単に作れるので、ブログ運営が楽しくなりますよ！
SWELLについては以下の記事で紹介してますので、いちどご覧ください。
>> WordPressテーマSWELLのレビュー【評判どおり最強だった】
まとめ：WordPressのグーテンベルグは簡単、すぐに慣れる！
WordPressのグーテンベルグ（ブロックエディタ）で、ブログ記事を書く方法を解説しました。
グーテンベルグの各ブロックの使い方も紹介しました。
おさらいすると、グーテンベルグで記事を書く流れは以下のとおり。
- タイトルを記入する
- 本文を書く
- 見出しブロックを使う
- 箇条書きブロックを使う
- 画像ブロックを使う
- 記事を公開する
本記事を参考にして、グーテンベルグでブログ記事を書いていきましょう！
WordPressのテーマは無料のものでもOKですが、おしゃれなブログを作りたい方は、有料の「SWELL」がおすすめ。
ぜひいちど、以下の記事をご覧ください。
>> WordPressテーマSWELLのレビュー【評判どおり最強だった】