1WordPressブロックエディタ（Gutenberg）の使い方
こんにちは、T部長です！
WordPress（ワードプレス）のエディタは、そのバージョンアップと共に進化し、最近ではブロックエディタ（Gutenberg）という名前で生まれ変わりました。
今回の記事では、ブロックエディタを使用して記事を公開するプロセスと、ブロックの基本操作についてご紹介いたします。
T部長
この記事は以下のような方々におすすめです！
- ブロックエディタの使い方に戸惑っている方
- ブロックエディタをより効果的に活用したい方
ブロックエディタは、初心者でも美しい記事を作成できる優れたツールです。ただし、その高機能さから操作が難しいと感じることもあるでしょう。
そこで、この記事では記事の公開手順を紹介しながら、エディタの操作方法やブロックの基本について解説いたします。
この記事を通じて、ブロックエディタの使い方をマスターしましょう！
それでは、始めましょう！
ブロックエディタ（Gutenberg）とは？
ブロックエディタ（Gutenberg）は、WordPress 5.0から標準搭載されたエディタのことで、文章や画像などをブロックという単位で管理する新しいエディタです。
ブロックエディタの大きな特徴としては、文章や画像の位置調整やレイアウトの変更が、HTMLやCSSの知識がなくても簡単に行えるという点が挙げられます。
また、定型文などを再利用できるブロックも追加されたため、より効率的にライティングが行えるようになっています。
ブロックエディタとクラシックエディタどっちがおすすめ？
WordPressにはブロックエディタだけではなく、WordPress 5.0より前に採用されていた「クラシックエディタ」というものも存在します。
プラグインを使用すればクラシックエディタでの運用も可能ですが、ブログを始める新しい方やすでに始めている方にはブロックエディタがおすすめです。
なぜなら、2022年末をもってWordPress側でのクラシックエディタのサポートが終了予定であり、これからはブロックエディタの方がサポートされる見込みです。
T部長
ボクはしばらくクラシックエディタで運用していましたが、ブロックエディタに慣れてからは執筆速度が感覚1.5倍くらい早くなりました！
ブロックエディタで記事を公開するまでの6ステップ
まずは難しいことは考えずに、エディタを用いて記事作成と各種設定を行い、公開するまでやってみましょう！
記事が公開されるまでの手順は、以下のステップで完了します。
（超重要）下書き保存をお忘れなく！
記事タイトルを入力する
記事を作成する
投稿設定を行う
プレビュー
記事を公開する
- （超重要）下書き保存をお忘れなく！
非常に重要なことなので、最初にお伝えします。せっかく書いたブログも、保存しないとすべて消えてしまいます。
「PCがフリーズしてしまい、書いていた文章が水の泡……」とならないように、こまめに下書き保存しましょう！手順は簡単で、ヘッダーメニューの「下書きを保存」をクリックするだけです！
T部長
保存を忘れて、せっかく書いた記事を書き直ししたことが何十回もありました（泣）やる気が飛んでしまうので、本当に気をつけましょう！
- 記事タイトルを入力する
「タイトルを追加」をクリックし、記事タイトルを入力します。
- 記事を作成する
ここからはブロックを使いながら、記事を作成していきます。
（はじめに）ブロックのメニューバーについて
ブロックによって多少の違いはあるものの、メニューバーでさまざまな操作ができます。記事を書く際は「3」と「5」をよく使います。
3-1. 段落を追加
段落は「Enterで改行していくだけ」で追加できます。「フォントサイズ」や「文字色」の変更は、右側メニューバーで行います。
ポイント
同じ段落で文章を書きたい場合は「Shift+Enter」、新しい段落に移りたい場合は「Enter」で改行します。
3-2. 見出しを挿入
見出しにしたいテキストを入力して、ブロック変換で見出しにします。また、段落の文頭に、見出しの数値に応じた「#」を入力することで、すばやく見出しを呼び出すこともできます。
見出しを挿入
見出しを呼び出すショートカット
- #（#のうしろには半角スペースを入力） → 見出し1
- → 見出し2
- → 見出し3
- → 見出し4
- など
3-4. 画像を挿入
画像を挿入するには、左上の「＋」アイコンをクリックし、一般ブロックから「画像」を選択します。
画像ボックスを追加すると、3つのボタンが表示されます。
- 新たに画像をアップロードする場合は「アップロード」
- すでにアップロードしたファイルを利用する場合は「メディアライブラリ」
- 画像のURLを直接指定したい場合は「URLから挿入」
をクリックします。画像をアップロードすると、エディタ上に画像が表示されます。画像の位置や大きさの調整、Altテキスト（リンク切れなどで画像が表示できない時の代替テキスト）の設定も可能です。
4. 投稿設定を行う
記事ができたら、公開に向けた準備や設定を行います。
4-1. パーマリンク
パーマリンクとは、ブログ記事ごとに設定されるURLのことです。デフォルトでは記事タイトル（日本語）が設定されていますが、これを英語表記に修正しましょう。
右側のメニューバーから「パーマリンク」をクリックして、URLスラッグを英語表記に書き換えます。英語表記にしないと、日本語URLの場合文字化けしてしまい、信頼性のないページに見えてしまいます。
ポイント
パーマリンク設定は、下書き保存後に表示されます。表示がない場合は一度「下書き保存」を行いましょう。一部のテーマやプラグインによってはパーマリンクの編集ができないこともあるので、確認しましょう。
4-2. カテゴリー／タグ
カテゴリーやタグは、関連記事をひとまとまりにするためのもので、一般的に1記事につき「カテゴリーは1つ」、「タグは複数」設定します。
右側のメニューバーから「カテゴリ」または「タグ」をクリックして、カテゴリやタグを設定します。新規カテゴリーまたはタグを追加した場合、スラッグが日本語になることがあるので、英語に修正しましょう。
4-3. アイキャッチ画像
アイキャッチ画像は、記事の一覧画面などで表示される画像のことです。読者の興味を引き、ブログ全体を魅力的にしますので、必ず設定しましょう。
右側のメニューバーから「アイキャッチ画像」を選択し、「アイキャッチ画像を設定」をクリックします。メディアライブラリからアイキャッチ画像をアップロードし、設定したい画像にチェックを入れ、「アイキャッチ画像を設定」をクリックします。
5. プレビュー
記事が完成したら、プレビューで出来栄えを確認しましょう。エディタ上と実際のブログでは、レイアウトに違いがあるかもしれません。プレビューは、ヘッダーメニューの「プレビュー」ボタンをクリックして行います。
6. 記事を公開する
お疲れさまでした！これで投稿前の作業は完了です！最後に記事を公開しましょう。ヘッダーメニューの「公開する」をクリックすれば、記事が全世界に公開されます。初めは手順が多く感じるかもしれませんが、慣れてしまえばサクサクと操作できるようになりますよ！
エディターの画面構成
エディターは以下の3つのエリアに分かれています：
- 執筆エリア: ここで文章を書きます。ブログの本文やコンテンツをここに入力します。
- 右側メニューバー: 個々のブロック設定や記事の公開に関する設定を行います。記事全体に関する設定もここで行います。
- ヘッダーメニューバー: ブロックの追加や下書きの保存など、ブロックや記事の状態に依存しない共通のボタンが並んでいます。
ヘッダーメニューバー
ヘッダーメニューバーには、ブロックの追加や下書きの保存など、ブロックや記事に関係なく使用できる共通のボタンがあります。記事を執筆する際によく使用されるボタンは以下です：
- ブロックの追加
- 下書きの保存
- プレビュー
- 公開
右側メニューバー
右側のメニューバーは、個々のブロックに関する設定や、記事の公開に関する設定を行います。主なタブは次の通りです：
- 文書タブ: 投稿や公開に関する設定を行います。基本的に「7」以降の設定は通常不要です。
- ブロックタブ (段落ブロック): 個々のブロックに関する設定を行います。選択中のブロックや設定に応じて表示項目が変わるので注意が必要です。
ブロックの基本操作6つ
ブロックエディターには、以下の6つの基本操作があります：
- ブロックを追加: ブロックを追加するには、左上の「＋」アイコンをクリックして、ブロック一覧を表示し、必要なブロックを選択します。
- ブロックの変換: ブロックを変換するには、ブロックメニューの段落アイコンをクリックし、変換したいブロックを選択します。これにより、入力内容を保持したままブロックタイプを変更できます。
- ブロックの移動: ブロックを選択し、左側に表示される移動カーソルを操作して、ブロックの位置を変更できます。記事を推敲する際に役立ちます。
- ブロックの複製: ブロックを複製するには、ブロックメニューの詳細設定から「複製」をクリックします。入力内容や装飾を維持したまま複製できます。
- ブロックの再利用: ブロックを再利用するには、ブロックメニューの詳細設定から「再利用ブロックに追加」をクリックし、登録したブロックを利用します。再利用ブロックは他の記事でも簡単に呼び出せます。
- ブロックの削除: ブロックを削除するには、ブロックメニューの詳細設定から「ブロックを削除」をクリックします。不要なブロックは削除しましょう。
その他のブロックエディタの機能3つ
さらに、ブロックエディタの便利な機能を3つ紹介します：
- テーブルを挿入: ブロックエディタには「テーブル」という機能があり、エクセルで作成したような表を記事内に埋め込むことができます。カラム数と行数を指定し、テキストを入力して簡単にテーブルを作成できます。
- カラムを挿入: カラムは、テキストや要素を横方向に配置するのに便利なブロックです。文章を複数のカラムに分けたい場合や、画像とテキストを並べて表示したい場合に役立ちます。
- 動画（YouTube）を埋め込む: 動画を記事に埋め込むことは、読者の興味を引き、コンテンツを豊か
2. カラムを挿入
カラムは、1つの段落内で列の数を設定する機能です。カラムを使うことで、1つの行にテキストと画像など2つの要素を並べて配置することができます。カラムの挿入手順は以下の通りです：
- ブロックエディターで「+」アイコンをクリックし、検索バーに「カラム」と入力します。
- カラムアイコンを選択します。カラムの割合を選択できます。今回は50/50を選択しています。
- 2つのブロックが表示され、片側には「段落」ブロック、もう片側には「画像」ブロックを挿入します。
これでカラムブロックの挿入が完了しました。他にも2枚の画像を横に並べたり、テキストを横に配置するなど、アイデア次第でさまざまなカスタマイズが可能です。
3. 動画（YouTube）を埋め込む
ブロックエディターを使用して、動画（YouTube）を簡単に埋め込むことができます。シンプルな動画埋め込みの手順は以下の通りです：
- YouTubeから掲載したい動画を検索します。
- 動画を選択し、共有ボタンをクリックします。
- “コピー” をクリックして、動画のURLをクリップボードにコピーします。
- 動画のサムネイルが表示されれば、掲載完了です。
動画を埋め込むことで、動的な映像を使って読者に情報をわかりやすく伝えることができます。ブログに慣れてきたら、テキストや画像だけでなく、動画を活用してみましょう。
次の記事では動画の埋め込み方を詳細に解説しています。
1
まとめ
この記事では、初心者向けにブロックエディターの使い方を解説しました。ブロックエディターを使って記事を公開するまでの流れやエディターの画面構成、ブロックの基本操作について紹介しました。
ブロックエディターを使いこなすためには、実際に触ってみてブロックの使い方を覚えることが大切です。1記事を作成し、さまざまなブロックの追加や変更を試してみることをおすすめします。
この記事を参考にして、ブロックエディターの使い方をマスターし、ストレスなくブログを執筆しましょう！読者の皆様、ありがとうございました。
コメント