WordPressブロックエディターの使い方と基本操作【初心者向け】

WordPressブロックエディターの使い方と基本操作を解説するイメージ
WordPressブロックエディターの基本操作と使い方を解説

WordPressのブロックエディター(Gutenberg)は、直感的な操作で記事を作成できる標準エディターです。
従来のクラシックエディターとは異なり、「ブロック」という単位で文章や画像を配置する仕組みが特徴です。

本記事では、WordPressブロックエディターの基本的な使い方から、よく使う操作までを丁寧に解説します。
初めて触れる場合でも、記事作成の基礎がしっかり理解できる内容です。

WordPressブロックエディターとは

ブロックエディターとは、見出し・文章・画像・リストなどを「ブロック」として追加・編集するWordPressの標準エディターです。

文章と装飾を分けて考える必要がなく、画面上で完成形に近い状態を確認しながら編集できます。
そのため、HTMLやCSSの知識がなくても、整った記事を作成しやすい点が特徴です。

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

編集画面の主な要素

ブロックエディターの画面は、大きく次の要素で構成されています。

  • タイトル入力欄
  • コンテンツ編集エリア
  • 上部ツールバー
  • 右サイドバー(設定パネル)

右サイドバーでは、投稿全体の設定や、選択中のブロックの詳細設定を行います。
ブロックごとに表示内容が変わるため、編集内容に応じた操作が可能です。

ブロックの追加方法

「+」ボタンから追加する

ブロックを追加する方法として、最も基本的なのが「+」ボタンの使用です。

  • 上部ツールバーの「+」
  • 各ブロック下に表示される「+」

これらをクリックすると、ブロック一覧が表示されます。
使用頻度の高いブロックは、検索せずにすぐ選択できます。

スラッシュコマンドで追加する

本文中で「/」を入力すると、ブロック検索が表示されます。
キーボード操作中心で編集したい場合に便利な方法です。

よく使う基本ブロック

段落ブロック

通常の文章入力に使うブロックです。
Enterキーを押すと、新しい段落ブロックが自動で追加されます。

見出しブロック

記事構成を整理するために使用します。
H2・H3などの階層を意識して設定すると、読みやすさとSEOの両面で効果的です。

見出しの役割や正しい使い方については、
見出しタグ(h2・h3)の正しい使い方」の記事も参考になります。

画像ブロック

画像をアップロード、またはメディアライブラリから挿入できます。
画像サイズや配置は、右サイドバーから調整可能です。

画像を扱う際は、
画像のalt属性の正しい書き方とSEO効果」の記事もあわせて確認すると理解が深まります。

リストブロック

箇条書きや番号付きリストを作成できます。
情報を整理したい場面で頻繁に使われるブロックです。

ブロックの移動・複製・削除

ブロックツールバーの操作

ブロックを選択すると、ツールバーが表示されます。
ここから次の操作が可能です。

  • 上下に移動
  • 複製
  • 削除

記事全体の構成を調整する際に、非常に重要な操作です。

ブロックエディターの便利な基本機能

元に戻す・やり直す

編集内容は、上部ツールバーの矢印から簡単に戻せます。
誤操作があっても安心して編集を進められます。

プレビュー機能

投稿前に、PC・タブレット・スマートフォン表示を確認できます。
レスポンシブ対応の確認については、
レスポンシブWebデザインの基本と確認方法」の記事も参考になります。

投稿前に確認しておきたいポイント

記事を公開する前に、次の点を確認すると安心です。

  • 見出し構成が整理されているか
  • 画像にalt属性が設定されているか
  • 不要な空行や装飾がないか

これらを意識することで、読みやすく品質の高い記事になります。

まとめ

WordPressブロックエディターは、ブロック単位で編集することで、初心者でも扱いやすい設計になっています。
基本操作を理解すれば、記事作成の効率と表現の幅が大きく広がります。

まずは、段落・見出し・画像といった基本ブロックを使いこなすことが重要です。
慣れてきたら、装飾やレイアウト調整にも挑戦してみるとよいでしょう。