「WordPressで記事を書こうとしたら、見慣れない編集画面が出てきて戸惑ってしまった」
そんな経験はありませんか。WordPressのブロックエディタは、慣れるまで少し不安に感じるかもしれません。
でも、安心してください。ブロックエディタは、基本的な操作さえ覚えれば初心者の方でも直感的にページを作成できる便利な機能です。この記事では、WordPress制作のプロが、ブロックエディタの基本的な使い方を画面の見方から記事公開までの流れに沿って分かりやすく解説します。
読み終わる頃には、ブロックエディタで「記事を書いて公開する」という一連の作業に自信を持てるようになるはずです。それでは、さっそく見ていきましょう。
この記事を書いた人
ブロックエディタ（Gutenberg）とは？
ブロックエディタとは、WordPress5.0から標準搭載された記事編集機能のことです。正式名称は「Gutenberg（グーテンベルク）」で、活版印刷の発明者ヨハネス・グーテンベルクにちなんだ名前が付けられています。
最大の特徴は、文章や画像、見出しなどを「ブロック」という単位で組み合わせてページを作る点にあります。たとえば、テキストを書きたいときは「段落ブロック」、写真を載せたいときは「画像ブロック」を使いましょう。それぞれのブロックを積み木のように並べていくだけで、見た目の整ったページが完成します。
実際の制作現場では、ブロックエディタの登場によって、HTMLの知識がなくてもレイアウトの調整ができるようになりました。以前のエディタと比べて、操作の自由度が大きく向上しています。
ブロックエディタとクラシックエディタの違い
WordPress5.0より前は「クラシックエディタ」（かんたんに言うと、Wordのような画面で記事を書く旧式のエディタのこと）が使われていました。クラシックエディタとブロックエディタの違いを知っておくと、ブロックエディタの便利さがよく分かります。
クラシックエディタは、1つの大きな入力欄に文章をまとめて書くスタイルです。シンプルですが、レイアウトの自由度には限界がありました。一方、ブロックエディタでは要素ごとに独立したブロックとして管理できるため、並び替えやデザイン変更がかんたんです。
多くの制作案件で見てきた中で、ブロックエディタに切り替えてから「更新作業が楽になった」という声をよく聞きます。クラシックエディタ用のプラグイン「Classic Editor」は将来的にサポートが終了する可能性もあるため、これからWordPressを使い始める方にはブロックエディタをおすすめします。
次のセクションでは、実際にブロックエディタの画面がどのような構成になっているかを見ていきましょう。
ブロックエディタの画面構成を理解しよう
ブロックエディタを使いこなすためには、まず画面の各エリアの役割を把握することが大切です。画面は大きく分けて3つのエリアで構成されています。それぞれの役割を順番に見ていきましょう。
ヘッダーメニューバー
画面上部にあるのがヘッダーメニューバーです。ここには、ブロックの追加ボタンや元に戻す・やり直しボタン、リスト表示の切り替え、下書き保存、プレビュー、公開ボタンなど、記事作成に必要な基本ツールが並んでいます。
特に覚えておきたいのが左上の「+」ボタンです。このボタンをクリックすると、使用できるブロックの一覧が表示されます。ブロックの追加は、この「+」ボタンから行うのがもっとも基本的な操作になるでしょう。
設定サイドバー
画面右側に表示されるのが設定サイドバーです。このサイドバーには「投稿タブ」と「ブロックタブ」の2つがあります。
「投稿タブ」では、パーマリンク（かんたんに言うと、その記事専用のURLのこと）やカテゴリー、アイキャッチ画像（かんたんに言うと、記事の表紙となるサムネイル画像のこと）などの記事全体の設定を行えます。「ブロックタブ」では、選択中のブロックの色やフォントサイズなどを個別に変更することが可能です。
メインエディタエリア
画面中央の広いエリアが、実際に記事を書いていくメインエディタエリアです。ここにブロックを追加しながらコンテンツを作成していきましょう。
一番上にはタイトルの入力欄があり、その下にブロックを積み重ねていく形式です。プロの視点では、このエリアで「リスト表示」機能を活用すると、記事が長くなったときにブロックの構造を俯瞰できるので便利です。リスト表示は、ヘッダーメニューバーの三本線アイコンから切り替えられます。
画面構成を把握したところで、次は実際に記事を作成して公開するまでの流れを見ていきましょう。
ブロックエディタで記事を公開するまでの流れ
ブロックエディタで記事を作成し公開するまでの手順は、大きく6つのステップに分かれます。この流れを一通り覚えておけば、初めての方でもスムーズに記事を投稿できるでしょう。
タイトルを入力する
まず、WordPress管理画面の「投稿」から「新規投稿を追加」をクリックしてエディタを開きます。画面上部に「タイトルを追加」と薄い文字で表示されている欄があるので、そこに記事のタイトルを入力してください。
タイトルは検索結果にも表示される重要な要素です。記事の内容が一目で分かる、具体的なタイトルを付けるように意識しましょう。読者が検索したときに「この記事を読みたい」と思えるタイトルが理想的です。
本文をブロックで作成する
タイトルの下にカーソルを移動すると、本文を入力できる状態になります。そのまま文字を打てば「段落ブロック」としてテキストが入力されるでしょう。
見出しを追加したい場合は、段落ブロック内で「/」（スラッシュ）を入力するか、「+」ボタンから「見出し」ブロックを選んでください。見出しのレベル（H2、H3など）は、ブロックツールバーから切り替えることができます。
画像を追加する場合は、「+」ボタンから「画像」ブロックを選択しましょう。「アップロード」「メディアライブラリ」「URLから挿入」の3つの方法で画像を挿入できます。箇条書きにしたい場合は「リスト」ブロックが便利です。
実際の制作現場では、まず見出しの骨組みを先に作ってから本文を書いていくと、記事全体の構成が崩れにくくなります。この方法は初心者の方にもおすすめです。
こまめに下書き保存する
記事の作成中は、「こまめに下書き保存する」ことがとても大切です。ヘッダーメニューバーの「下書き保存」をクリックするだけで、作成途中の記事を保存できます。
万が一ブラウザが固まったり、パソコンの電源が落ちたりしても、下書き保存しておけば記事の内容を失わずに済むでしょう。多くの制作案件で見てきた中で、保存し忘れて書いた内容がすべて消えてしまうケースは少なくありません。5分〜10分に1回は保存する習慣を付けておきましょう。
投稿設定を行う
記事を書き終えたら、公開前に投稿設定を確認しましょう。設定サイドバーの「投稿タブ」を開くと、以下の項目を設定できます。
パーマリンクは、記事のURLの末尾部分です。記事の内容を反映した英単語を設定するのが一般的でしょう。たとえば、ブロックエディタの使い方に関する記事なら「block-editor-guide」のようにします。日本語のままだと、URLが長い文字列に変換されて見づらくなることがあるので注意してください。
カテゴリーやタグは、記事をグループ分けするための機能です。あらかじめ作成しておいたカテゴリーから選択するか、新しく追加できます。
アイキャッチ画像は、記事一覧やSNSでシェアされたときに表示されるサムネイル画像です。記事の内容に合った画像を1枚設定しておくと、クリック率の向上が期待できるでしょう。
プレビューで確認する
投稿設定が完了したら、ヘッダーメニューバーの「プレビュー」をクリックして、実際に公開される画面を確認してください。デスクトップ・タブレット・モバイルの3種類の表示を切り替えてチェックできます。
プロの視点では、「スマートフォンでの見え方」を特に念入りに確認することをおすすめします。現在、多くのホームページではスマートフォンからのアクセスが半数以上を占めているためです。文字が小さすぎないか、画像がはみ出していないかをしっかりチェックしましょう。
記事を公開する
プレビューで問題がなければ、いよいよ記事の公開です。ヘッダーメニューバーの「公開」ボタンをクリックすると、確認画面が表示されます。公開範囲や公開日時を確認し、もう一度「公開」をクリックすれば完了です。
公開後でも、記事はいつでも編集・修正できます。投稿一覧から該当の記事をクリックすれば、再びブロックエディタが開くでしょう。初めての記事は完璧を目指す必要はないので、まずは気軽に公開してみてください。
ここまでで記事を公開する一連の流れをお伝えしました。次は、ブロックエディタをもっと使いこなすためのブロック操作を解説します。
ブロックの基本操作を覚えよう
ブロックエディタを効率よく使うためには、ブロックの基本操作を覚えておくことが重要です。ここでは、記事作成で頻繁に使う6つの操作を紹介します。
ブロックの追加
新しいブロックを追加する方法は主に3つあります。
1つ目は、ヘッダーメニューバー左上の「+」ボタンをクリックする方法です。ブロック一覧がパネルで表示され、検索もできます。2つ目は、ブロックとブロックの間にカーソルを合わせると表示される「+」ボタンを使う方法です。3つ目は、段落ブロック内で「/（スラッシュ）」を入力して、ブロック名を直接指定するやり方になります。
最初は1つ目の方法が分かりやすいですが、慣れてきたら3つ目のスラッシュコマンドが最も素早く操作できるでしょう。
ブロックの移動
ブロックの順番を入れ替えたいときは、移動機能を使いましょう。ブロックを選択すると表示されるツールバーに、上下の矢印アイコンがあります。これをクリックすれば、ブロックを1つ上または1つ下に移動できます。
もう一つの方法として、矢印アイコンの間にある6つの点のアイコン（ドラッグハンドル）をドラッグすることで、任意の位置にブロックを移動させることも可能です。長い記事で大きく順番を変えたいときは、ドラッグ操作の方が素早く移動できるでしょう。
ブロックの変換
すでに入力したブロックを、別の種類のブロックに変換することもできます。たとえば、段落ブロックとして書いた文章を見出しブロックやリストブロックに変更したい場合に便利な機能です。
ブロックを選択したときに表示されるツールバーの左端にあるアイコンをクリックすると、変換可能なブロックの候補が表示されます。すべてのブロック間で自由に変換できるわけではありませんが、テキスト系のブロック同士であれば多くの場合に対応しています。
ブロックの複製
同じ形式のブロックを繰り返し使いたいときには、「複製」の機能が便利です。ブロックを選択し、ツールバー右端の「︙」（オプション）メニューから「複製」を選ぶと、まったく同じ内容のブロックがすぐ下に作成されます。
レイアウトが決まっているセクションを複数作りたいときなど、同じ構造を繰り返す場面で作業時間を大幅に短縮できるでしょう。複製したブロックの内容を書き換えれば、ゼロから作り直す手間が省けるので効率的です。
ブロックの再利用（パターン登録）
何度も使うブロックの組み合わせは、「パターン」（かんたんに言うと、ブロックの雛形として保存して使い回せる機能のこと）として登録しておけます。ブロックのオプションメニューから「パターンを作成」を選ぶと登録画面が表示されるでしょう。
登録したパターンは、ブロック追加の画面から呼び出していつでも使えます。たとえば、問い合わせへの誘導文や定型の注意書きなど、複数の記事で繰り返し使う内容に最適です。
パターンには「同期」と「非同期」の2種類があります。「同期パターン」は、パターンの内容を1か所変更すると、そのパターンを使っているすべての場所にも変更が反映される仕組みです。「非同期パターン」は、挿入した時点の内容がコピーされ、個別に編集できます。用途に応じて使い分けましょう。
ブロックの削除
不要になったブロックは、かんたんに削除できます。削除したいブロックを選択し、オプションメニューから「削除」を選んでください。
キーボードショートカットを使う場合は、ブロックを選択した状態でShift + Alt + Z（Macの場合はControl + Option + Z）を押すと素早く削除が可能です。間違って削除してしまった場合は、Ctrl + Z（Macの場合はCommand + Z）で元に戻せるので安心してください。
基本操作を覚えたら、次はよく使うブロックの種類について見ていきましょう。
記事作成でよく使うブロックの種類
ブロックエディタにはたくさんのブロックが用意されていますが、記事作成で実際に使うのは限られています。ここでは、初心者の方がまず覚えておきたい主要なブロックを紹介します。
段落ブロック
もっとも基本的なブロックが段落ブロックです。通常のテキストを入力するときに使います。エディタを開いてそのまま文字を打てば、自動的に段落ブロックとして認識されるため、特別な操作は必要ありません。
段落ブロックでは、テキストの色や背景色の変更、フォントサイズの調整、太字・イタリックなどの装飾が可能です。また、テキスト内の一部を選択して「リンク」アイコンをクリックすれば、テキストリンクを設定することもできます。
見出しブロック
見出しブロックは、記事の章や節のタイトルを設定するためのブロックです。見出しはH2からH6まで設定できますが、一般的な記事ではH2とH3を使うことがほとんどでしょう。
見出しは記事の読みやすさだけでなく、検索エンジンに記事の構造を伝える役割もあります。プロの視点では、「H2で大きなテーマを示し、H3でそのテーマの中身を詳しく説明する」という使い方を意識すると、読者にも検索エンジンにも分かりやすい記事構成になります。
画像ブロック
画像ブロックは、記事内に写真やイラストを挿入するためのブロックです。画像をアップロードするか、メディアライブラリから選択するか、URLで指定して表示することができます。
画像を挿入する際には「代替テキスト（Alt属性）」（かんたんに言うと、画像の内容を説明するテキストのこと）を入力しておきましょう。代替テキストは、画像が表示されないときに代わりに表示されるほか、検索エンジンが画像の内容を理解するためにも使われる重要な要素です。
リストブロック
リストブロックは、箇条書きや番号付きリストを作成するためのブロックです。手順の説明やポイントの整理など、情報を分かりやすくまとめたい場面に適しています。
ブロックツールバーで「箇条書きリスト」と「番号付きリスト」を切り替えることが可能です。リスト項目の中でインデント（字下げ）を使えば、階層を持った入れ子のリストも作成できるでしょう。順序が重要な手順には番号付きリスト、並列な情報には箇条書きリストを使い分けると読みやすくなります。
テーブルブロック
テーブルブロックは、表を作成するためのブロックです。料金表や比較表、スケジュール表など、情報を表形式で整理して見せたい場面で活用しましょう。
ブロックを追加すると、まず列数と行数を指定する画面が表示されます。数値を入力して「表を作成」をクリックすれば、指定したサイズの表が挿入される仕組みです。行や列の追加・削除は、ブロックツールバーの「表を編集」メニューから行えます。設定サイドバーでヘッダーやフッターのセクションを追加することもできるので、用途に応じて使い分けてください。
カラムブロック
カラムブロック（かんたんに言うと、画面を複数の列に分割してコンテンツを横並びに配置できるブロックのこと）は、コンテンツを2列や3列のレイアウトで表示したいときに使います。
たとえば、左側に画像、右側にテキストを配置するレイアウトや、サービスの特徴を3つ横並びで紹介するレイアウトを作ることができます。スマートフォンでは自動的に縦に積み重なって表示されるため、モバイルでの表示崩れを心配する必要はありません。
ここまで主要なブロックを見てきました。次は、ブロックエディタをさらに便利に使うためのコツを紹介します。
ブロックエディタを使いこなすためのコツ
ブロックエディタの基本操作とブロックの種類を理解したら、さらに効率よく作業するためのコツを知っておくと便利です。実際の制作現場で役立っているテクニックを紹介します。
キーボードショートカットを活用する
ブロックエディタには、作業を効率化するキーボードショートカットが用意されています。代表的なものを覚えておくと、マウス操作の手間が減って記事作成のスピードが上がるでしょう。
よく使うショートカットとしては、Ctrl + Z（元に戻す）、Ctrl + Shift + Z（やり直し）、Ctrl + S（下書き保存）が挙げられます。ブロックの追加は「/（スラッシュ）」を使えば、キーボードだけで完結します。Macの場合は、CtrlをCommandに置き換えてください。
リスト表示でブロック構造を把握する
記事が長くなると、目的のブロックを見つけるのが難しくなることがあります。そんなときは、ヘッダーメニューバーにある「リスト表示」機能を使いましょう。
リスト表示をオンにすると、画面左側にブロックの一覧がツリー形式で表示されます。ブロックの種類や階層構造が一目で分かるため、目的のブロックを素早く選択できるようになるでしょう。ブロックのドラッグ移動もリスト表示上で行えるので、長い記事の構成を整理するときにも非常に便利です。
ブロックの検索機能を使う
ブロックの種類が多くて探すのが大変だと感じたら、ブロック追加画面の検索機能を活用してください。「+」ボタンをクリックしたあとに表示される検索欄に、ブロック名の一部を入力するだけで候補が絞り込まれます。
たとえば「画像」と入力すれば画像ブロックがすぐに見つかりますし、「テーブル」と入力すれば表のブロックが表示されるでしょう。すべてのブロックの場所を覚える必要はないので、検索を上手に活用する方が効率的です。
段落ブロック内での改行と段落分けの違い
段落ブロックでEnterキーを押すと、新しい段落ブロックが作成されます。一方、Shift + Enterを押すと、同じ段落ブロック内で改行される仕組みです。
この2つの違いは、表示上の行間に影響します。段落分け（Enter）ではブロック間に広めのスペースが入るのに対し、改行（Shift + Enter）では行間が狭くなります。住所やメニュー項目のように、行を変えたいけれど間隔を空けたくない場面ではShift + Enterを使うと見た目がきれいになるでしょう。
続いて、ブロックエディタに関するよくある質問にお答えしていきます。
ブロックエディタに関するよくある質問
ブロックエディタを使い始めると、いくつかの疑問やトラブルに遭遇することがあります。ここでは、初心者の方からよく寄せられる質問とその回答をまとめました。なお、このセクションの内容はFAQ Schema（構造化データ）としてマークアップすると、検索結果でリッチリザルト表示される可能性があります。
ブロックエディタは使いにくい？
結論から言えば、「慣れてしまえば使いやすい」というのが多くのユーザーの実感です。
クラシックエディタから切り替えた直後は、操作の違いに戸惑うことがあるかもしれません。しかし、ブロック単位でコンテンツを管理する仕組みに慣れると、レイアウトの変更や要素の並べ替えがかんたんにできるようになります。多くの制作案件で見てきた中で、1〜2週間ほど使い続けると「もうクラシックエディタには戻れない」とおっしゃる方がほとんどです。
クラシックエディタに戻す方法は？
「Classic Editor」というプラグインをインストールして有効化すると、クラシックエディタに戻すことができます。
WordPress管理画面の「プラグイン」→「新規プラグインを追加」で「Classic Editor」と検索し、インストール・有効化してください。ただし、このプラグインはWordPress公式のサポートが将来的に終了する可能性があります。新しくWordPressを始める方には、ブロックエディタの使用をおすすめします。
ブロックエディタが表示されない場合はどうすれば？
ブロックエディタが表示されない原因としてもっとも多いのは、Classic Editorプラグインが有効になっているケースです。
プラグインの一覧画面でClassic Editorが「有効」になっていないか確認してください。有効になっている場合は「無効化」をクリックすれば、ブロックエディタに切り替わります。それでも表示されない場合は、WordPressのバージョンが5.0未満の可能性があるため、WordPressのアップデートを行いましょう。
「更新に失敗しました」とエラーが出るときの対処法は？
「更新に失敗しました。返答が正しいJSONレスポンスではありません」というエラーは、ブロックエディタでよく見かけるトラブルの一つです。
もっとも多い原因は、レンタルサーバーのセキュリティ機能「WAF（かんたんに言うと、Webサイトへの不正な通信を遮断する仕組みのこと）」が誤って通信をブロックしているケースになります。お使いのレンタルサーバーの管理画面からWAFの設定を一時的にオフにして、保存を試してみてください。保存が成功したら、WAFを再びオンにするのを忘れないようにしましょう。
まとめ
この記事では、WordPressブロックエディタの使い方を、画面構成の理解から記事公開までの手順、ブロックの基本操作、よく使うブロックの種類、効率的に使うためのコツまで解説しました。
ブロックエディタは、文章・画像・見出しなどを「ブロック」という単位で組み合わせてページを作る仕組みです。最初は操作に慣れないかもしれませんが、段落・見出し・画像・リストの4つの基本ブロックを覚えれば、日常的な記事作成には十分に対応できます。
操作に不安を感じたときは、こまめな下書き保存とプレビュー確認を心がけてください。失敗してもCtrl + Zで元に戻せるので、恐れずにいろいろなブロックを試してみましょう。実際に手を動かしながら触れていくうちに、ブロックエディタでの記事作成がきっと楽しくなるはずです。