WordPressブロックエディタの使い方を徹底図解|基本操作から応用テクニック・トラブル対処法まで

【初心者向け】WordPressブロックエディタの使い方を徹底解説|基本から応用まで

WordPressでブログやWebサイトを作成するとき、記事の編集に使うのが「ブロックエディタ」です。ブロックエディタはWordPress 5.0から標準搭載された編集機能で、文章や画像、動画などのコンテンツをブロック単位で直感的に配置できます。しかし、初めて触れる方にとっては「どこから手をつければいいのかわからない」と感じることも多いのではないでしょうか。本記事では、WordPressのブロックエディタの使い方を基本操作から応用テクニックまで丁寧に解説します。初心者の方でもこの記事を読み終えるころには、自信を持って記事を書けるようになるはずです。

この記事でわかること
  • WordPressのブロックエディタの基本的な操作方法

ブロックの追加・編集・移動・削除など、記事作成に必要な基本操作を一通り理解できます。

  • よく使うブロックの種類と活用法

段落・見出し・画像・リストなど、頻出ブロックの特徴と効果的な使い方がわかります。

  • ブロックエディタを使いこなす応用テクニック

再利用ブロックやグループ化など、作業効率を大幅に上げる便利な機能を習得できます。

目次

ブロックエディタとは何か

ブロックエディタとは何か

クラシックエディタとの違い

ブロックエディタでは、各要素をドラッグ&ドロップで自由に並べ替えできるため、レイアウトの自由度が飛躍的に向上しています。クラシックエディタはWordやメモ帳のようなテキスト入力方式で、装飾にはHTMLの知識が求められる場面がありました。

以下の表で、両者の違いを比較してみましょう。

比較項目 ブロックエディタ クラシックエディタ
編集方式 ブロック単位で操作 テキストベースで入力
レイアウト変更 ドラッグ&ドロップ対応 コードの書き換えが必要
HTMLの知識 基本的に不要 装飾には必要な場合あり
対応状況 WordPress標準搭載 プラグインで利用可能

このように、ブロックエディタは初心者にとって扱いやすい設計になっています。今からWordPressを始めるなら、ブロックエディタの使い方を覚えることが効率的です。

ブロックエディタの画面構成

ブロックエディタの編集画面は、大きく3つのエリアで構成されています。画面上部にはツールバーがあり、ブロックの追加や元に戻す操作などが行えます。中央が実際にコンテンツを編集するメインエリアです。

画面右側のサイドバーでは、選択中のブロックの詳細設定や投稿全体の公開設定を行えます。サイドバーには「投稿」タブと「ブロック」タブがあり、切り替えながら操作します。まずはこの3つのエリアの役割を把握しておくと、スムーズに編集作業を進められるでしょう。

ブロックエディタはHTMLの知識がなくても使える直感的な仕組みです。まずは画面構成を把握するところから始めてみましょう。

あわせて読みたい
WordPressの本おすすめ8選!初心者から上級者まで目的別に厳選 WordPressでWebサイトを作りたいと思っても、何から始めればよいか分からないという方は多いのではないでしょうか。インターネット上には情報が溢れていますが、体系的...

ブロックエディタの基本的な使い方

ブロックエディタの基本的な使い方

ブロックを追加する方法

新しいブロックを追加するには、いくつかの方法があります。もっとも一般的なのは、エディタ上の「+」アイコンをクリックする方法です。画面左上のツールバーにある「+」ボタンを押すと、利用できるブロックの一覧が表示されます。

さらに便利なのが、ブロック内で半角スラッシュ「/」を入力する方法で、キーボードから手を離さずに素早くブロックを検索・追加できます。たとえば「/見出し」と入力すると、見出しブロックが候補として表示されます。この方法を覚えると、記事作成のスピードが格段に上がるでしょう。

ブロック追加の主な方法を確認しましょう。

  • 画面左上の「+」ボタンからブロック一覧を表示する
  • 各ブロック間に表示される「+」アイコンをクリックする
  • 空のブロック内で半角スラッシュ「/」を入力して検索する
  • Enterキーで新しい段落ブロックを自動追加する

ブロックを編集する方法

追加したブロックをクリックすると、ブロックの上部にツールバーが表示されます。このツールバーでは、テキストの太字・イタリック設定やリンクの挿入、テキストの配置変更などが行えます。

さらに細かい設定を行いたい場合は、画面右側のサイドバーにある「ブロック」タブを使うことで、フォントサイズや色、余白などを自由にカスタマイズできます。ブロックの種類によって設定できる項目は異なりますが、基本的な操作の流れは共通しています。

ブロックを移動・削除する方法

ブロックの順番を入れ替えたいときは、ブロックツールバーの上下矢印ボタンを使います。1クリックでブロックが1つ分移動するため、細かな並べ替えに便利です。大幅な移動が必要な場合は、ブロックをドラッグ&ドロップすることも可能です。

ブロックを削除するには、ブロックツールバーの「⋮」(3点メニュー)をクリックし、「ブロックを削除」を選択します。誤って削除してしまっても、「Ctrl + Z」(Macでは「Command + Z」)で元に戻せるので安心です。

追加・編集・移動・削除の4つの基本操作を押さえれば、ブロックエディタでの記事作成はもう怖くないはずです!

バクヤスAI 記事代行では、
高品質な記事を圧倒的なコストパフォーマンスでご提供!

あわせて読みたい
WordPress AIプラグインおすすめ10選|ChatGPT連携からサイト自動生成まで徹底解説 WordPress AIプラグインを活用することで、記事作成やサイト運営の効率が大幅に向上します。ChatGPTをはじめとする生成AIの普及により、WordPressでもAI機能を簡単に導...

よく使うブロックの種類と活用法

よく使うブロックの種類と活用法

段落ブロックの使い方

段落ブロックは、ブロックエディタで最も基本的なブロックです。エディタの空欄にそのまま文字を入力すると、自動的に段落ブロックとして認識されます。Enterキーを押すと新しい段落ブロックが作成され、Shift + Enterで同一ブロック内での改行が可能です。

段落ブロックのサイドバー設定では、文字サイズ・文字色・背景色を変更でき、視覚的にメリハリのある記事を作成できます。読みやすい記事に仕上げるために、1つの段落を長くしすぎないように意識すると効果的です。

見出しブロックの使い方

見出しブロックは、記事の構造を整理するために欠かせないブロックです。「+」ボタンから「見出し」を選択するか、半角スラッシュで「/見出し」と入力して追加できます。

見出しにはH2からH6までのレベルがあり、ブロックツールバーで切り替えが可能です。SEOの観点からも、見出しを適切な階層構造で設定することは重要だと言われています。以下の表で、各見出しレベルの使い分けを確認しておきましょう。

見出しレベル 主な用途 使用頻度
H2 記事の大見出し(章立て) 高い
H3 H2の補足や詳細説明 高い
H4 H3の補足や細分化 中程度
H5・H6 さらに細かい分類 低い

見出しの階層を飛ばさず、H2の下にはH3、H3の下にはH4という順番を守ることが、検索エンジンにも読者にもわかりやすい構造につながります

画像ブロックの使い方

画像ブロックでは、メディアライブラリからの選択、新規アップロード、URLからの挿入の3つの方法で画像を挿入できます。追加後はサイドバーから代替テキスト(alt属性)を設定でき、アクセシビリティとSEOの両面で役立ちます。

画像のサイズ変更はブロック内のハンドルをドラッグするか、サイドバーで数値を指定して行います。記事にイメージ画像を適切に配置することで、読者の理解を助け、滞在時間の向上にもつながると考えられます。

リスト・テーブルブロックの使い方

リストブロックは箇条書きのコンテンツを作成する際に使用します。番号なしリストと番号付きリストの切り替えはツールバーから簡単に行えます。手順やポイントを整理して伝えたいときに効果的です。

テーブルブロックでは、行数と列数を指定するだけで表を簡単に作成でき、データの比較や整理に適しています。ヘッダーセクションやフッターセクションの表示・非表示もサイドバーから設定できます。

まずは段落・見出し・画像・リストの4つのブロックを使いこなせれば、ほとんどの記事は書けるようになりますよ。

バクヤスAI 記事代行では、SEOの専門知識と豊富な実績を持つ専任担当者が、キーワード選定からAIを活用した記事作成、人の目による品質チェック、効果測定までワンストップでご支援いたします。
ご興味のある方は、ぜひ資料をダウンロードして詳細をご確認ください。

サービス導入事例

株式会社ヤマダデンキ 様
生成AIの活用により、以前よりも幅広いキーワードで、迅速にコンテンツ作成をすることが可能になりました。
親身になって相談に乗ってくれるTechSuiteさんにより、とても助かっております。
▶バクヤスAI 記事代行導入事例を見る

あわせて読みたい
CMSとSEOの関係性とは?SEOに強いおすすめCMS5選と選び方を徹底解説 Webサイトを運営するうえで、CMSの選択はSEO対策の成否を左右する重要な要素です。CMSとは「コンテンツ管理システム」の略称で、プログラミングの知識がなくてもWebサイ...

ブロックエディタの応用テクニック

ブロックエディタの応用テクニック

再利用ブロックで効率化する

毎回同じ内容を入力する手間を省きたい場合、「再利用ブロック(パターン)」が便利です。たとえば、記事の末尾に毎回挿入するCTAや定型文を再利用ブロックとして保存しておけば、ワンクリックで呼び出せます。

再利用ブロックの作成は、対象ブロックの3点メニューから「パターンを作成」を選ぶだけで完了します。注意点として、再利用ブロックを編集すると、そのブロックを使用しているすべての記事に変更が反映されます。個別に内容を変えたい場合は、挿入後に「通常のブロックへ変換」してから編集するとよいでしょう。

グループ化でレイアウトを整える

複数のブロックをまとめて管理したいときは、「グループ」ブロックを活用します。グループ化したいブロックを複数選択し、ツールバーから「グループ化」を選ぶだけで1つのまとまりにできます。

グループブロックには背景色や枠線を設定できるため、注目してほしいセクションを視覚的に目立たせる使い方が効果的です。カラムブロックと組み合わせれば、横並びのレイアウトも実現できます。

ショートカットキーを活用する

作業スピードを上げるために、ブロックエディタのショートカットキーを覚えておくと便利です。頻繁に使うショートカットを以下の表にまとめました。

操作内容 Windows Mac
元に戻す Ctrl + Z Command + Z
やり直し Ctrl + Shift + Z Command + Shift + Z
ブロックの複製 Ctrl + Shift + D Command + Shift + D
ブロックの削除 Shift + Alt + Z Control + Option + Z
太字にする Ctrl + B Command + B

ショートカットキーはすべてを一度に覚える必要はありません。よく使う操作から少しずつ取り入れていけば、自然と効率が上がっていくでしょう。

ブロックエディタの応用テクニックをチェックしましょう。

  • 定型文は再利用ブロックに登録して使い回す
  • 複数ブロックはグループ化してまとめて管理する
  • ショートカットキーで操作スピードを向上させる
  • カラムブロックで横並びレイアウトを実現する

再利用ブロックとショートカットキーを覚えるだけで、記事作成の効率は大きく変わるでしょう。

ブロックエディタで困ったときの対処法

ブロックエディタで困ったときの対処法

ブロックの選択がうまくいかない場合

ブロックが入れ子構造になっていると、目的のブロックをクリックしても親ブロックが選択されてしまうことがあります。この場合は、画面下部のブロックパンくずリスト(ブレッドクラム)を使って目的のブロックを正確に選択できます。

また、画面上部のツールバーにある「リスト表示」ボタンを押すと、すべてのブロックがツリー構造で一覧表示され、複雑な構成の記事でも狙ったブロックに素早くアクセスできます

意図しないブロック変換への対処

文章入力中に「#」や「-」を入力すると、自動的に見出しやリストに変換されることがあります。これはMarkdown記法による自動変換機能によるものです。意図しない変換が起きた場合は、すぐに「Ctrl + Z」で元に戻せます。

この自動変換機能を無効にしたい場合は、設定から調整することも可能です。ただし、使い慣れると便利な機能でもあるため、まずはそのまま試してみることをおすすめします。

エディタの動作が重い場合

記事のブロック数が非常に多くなると、エディタの動作が遅くなることがあります。この場合は、不要なブロックを削除したり、長い記事を複数ページに分割したりする方法が考えられます。

ブラウザのキャッシュをクリアする、使用していないプラグインを無効にするといった基本的な対処で改善するケースも多いです。それでも改善しない場合は、PHP のメモリ上限の見直しなどサーバー側の設定確認が必要になることもあります。

トラブル発生時に確認すべきポイントです。

  • ブロック選択に困ったらリスト表示を活用する
  • 意図しない変換はCtrl + Zで即座に元に戻す
  • 動作が重い場合はキャッシュクリアやプラグインを見直す
  • WordPress本体とプラグインを最新版に保つ

困ったときは焦らず「元に戻す」操作を覚えておけば、安心して色々な機能を試せるでしょう。

よくある質問

WordPressのブロックエディタの使い方に関して、よく寄せられる質問とその回答をまとめました。

ブロックエディタからクラシックエディタに戻すことはできますか?

「Classic Editor」プラグインをインストールして有効化することで、クラシックエディタに切り替えることが可能です。ただし、ブロックエディタは今後のWordPressの標準機能として進化し続けるため、早めに慣れておくことが望ましいと言われています。

ブロックエディタで使えるブロックの数はどのくらいありますか?

WordPress標準で90種類以上のブロックが用意されています。さらに、テーマやプラグインによって独自のブロックが追加される場合もあります。すべてを覚える必要はなく、記事作成でよく使うブロックから順に操作に慣れていくのが効果的です。

ブロックエディタで作成した記事はSEOに有利ですか?

ブロックエディタ自体がSEOの順位を直接的に左右するわけではありません。しかし、見出しの階層構造や画像のalt属性などを正しく設定しやすい点で、結果的にSEOに配慮した記事を作成しやすいと考えられています。

まとめ

WordPressのブロックエディタの使い方について、基本操作から応用テクニック、トラブルシューティングまで幅広く解説しました。ブロックの追加・編集・移動・削除という4つの基本操作を押さえるだけで、記事作成をスムーズに進められます。

さらに、再利用ブロックやグループ化、ショートカットキーなどの応用機能を活用すれば、作業効率が大幅に向上します。最初は覚えることが多いと感じるかもしれませんが、実際に手を動かしながら少しずつ機能を試していくのが上達への近道です。

ブロックエディタは今後もアップデートで機能が追加されていくことが見込まれます。この記事を参考に基本を固め、自分のペースで使いこなせる範囲を広げていきましょう。

バクヤスAI 記事代行 サービス概要資料

画像を読み込み中...

バクヤスAI 記事代行のサービス概要資料です。
コンテンツ制作や集客に関する課題へのソリューションを提供しております。
ご興味のある方は、以下のフォームに必要な項目を入力のうえ、送信してください。
フォーム入力後に表示される完了画面にて資料をダウンロードできます。

フォームを読み込み中...
監修者情報

TechSuite株式会社
COO バクヤスAI事業統括

倉田 真太郎

大学在学中よりWEBディレクターとして実務経験を開始。生成AI活用型SEO記事代行事業を立ち上げ、同カテゴリ内で市場シェアNo.1を獲得。同サービスで20,000記事超のAIライティング実績。0から1年間で月間300万PVのメディアを立ち上げ、月間1億円超の売上創出に寄与した経験を有する。

...続きを読む

よかったらシェアしてね!
  • URLをコピーしました!
目次