■「ブロックエディター」とは
ブロックエディターは、必要なコンテンツ（内容）をブロック単位に組み合わせていくことによって、直感的に記事を作ることができます。
ブロックエディターは「Gutenberg（グーテンベルク）」とも呼ばれています。活版印刷技術を発明したヨハネス・グーテンベルク（Johannes Gutenberg）にちなんで名付けられたようです。
活版印刷は、それまで一部の富裕層だけが所有していた書物を、一般の人々にまで広めるきっかけとなった技術だと言われています。ブロックエディターには、「誰でも簡単に記事を作成できるように」との願いが込められているのかもしれません。
■ブロックエディターの使い方
初めてブロックエディターを開いたときなどに、
「ブロックエディターにようこそ」
のような「ガイド」が表示されることがあります。
→ 「ガイド」右上「Ｘ」をクリック
初期状態で60種類以上のブロックが用意されていて、表示したい内容に応じて使い分けます。例えば以下のようなブロックを組み合わせて、コンテンツを作成していきます。
- 文章………「段落」ブロック
- 画像………「画像」ブロック
- 見出し……「見出し」ブロック
- 箇条書き…「リスト」ブロック
■各ブロックの操作
- ブロックのツールバー
各ブロックに対し、ツールバーが表示されます。このツールバーでは、例えば以下のような操作が可能です。
・ブロックの削除
・ブロックのコピー
・ブロックの移動（並べ替え）
・段落から見出しに変更
→ ブロックタイプの変更
・文字揃え（左寄せ・中央寄せ・右寄せ）を変更
・太字・イタリックに変更
・リンク設定
・文字色を変更
- ブロックの追加
いくつかの方法がありますが、新しい「段落」ブロックを追加する、代表的な方法をご紹介します。
・空のブロック→「Enter」キー
・ブロックの下の「＋」→「段落」
- ブロックの削除
ブロックを削除する方法もいくつかの方法がありますが、代表的な方法をご紹介します。
・空のブロック→「Back space」キー
・ブロックツールバーの「・・・」→「ブロックを削除」
- ブロックのコピー
ブロックツールバーの「・・・」→「コピー」
→ 任意のブロックで右クリック→「貼り付け」
- ブロックの移動（並べ替え）
ブロックツールバーの「ドラッグ」ボタン
→ クリックしたままマウスを上下に動かす
- 文字色を変更
文字色の変更は、右ツールバーにある「色設定」から変更したい色を選択します。
右ツールバーが表示されていない場合：
→ 右上「歯車」アイコン
→ 「ブロック」タブ
→ 色変更したい文字をドラッグして選択
→ 右ツールバーの「テキストの色」
→ テキストの色を選択
■ブロックエディターのプレビュー機能
編集ができたら、プレビューで確認できます。
- 画面右上の「プレビュー」をクリック
→ 以下を切り替え、各端末での見え方をチェック
・デスクトップ
・タブレット
・モバイル
- 「新しいタブでプレビュー」をクリック
→ 実際のブラウザでの表示確認
※「新しいタブでプレビュー」をクリックする
たびに、自動的に下書き保存が実行されます。
■「ブロックエディター」のポイント：
- 「ブロックエディターにようこそ」が表示されたら
→ その中の右上「Ｘ」をクリックして閉じる - 表示したい内容に応じてブロックを使い分ける
- 同じ段落で文章を改行したい場合は「Shift+Enter」
- 新しい段落に移りたい場合は「Enter」で改行