WordPressブロックエディタ（グーテンベルク）で記事作成の基本と便利な使い方

WordPressブロックエディタ（グーテンベルク）で記事作成の基本を知りたい！
WordPressの記事作成の流れを具体的に教えてほしい！
ブロックエディタで記事を作る時に、もっと便利に時短できる使い方はない？

このようなお悩みの方を解決したいと思います！

WordPressブロックエディタ（グーテンベルク）で記事作成の基本と便利な使い方

WordPressのエディタは2018年12月にWordPress 5.0のリリースし、エディタが一新され『ブロックエディタ（グーテンベルク）』ができました。

ブロックエディタ以前は、『クラシックエディタ』と呼ばれるエディタでしたが、今から始められる方はブロックエディタの使い方をマスターすればOKです。

この記事では、ブロックエディタで記事作成する『編集画面の構成』や『記事作成の流れ』、『もっと便利に時短できる使い方』を紹介します！

ブロックエディタならではの機能がたくさんありますが、よく使う機能をポイントで把握していきましょう！

では、始めて行きましょう！

ブロックエディタ（グーテンベルク）とは？

『ブロックエディタ（グーテンベルク）』は、WordPress 5.0が2018年12月にリリースに標準搭載されたエディタで、テキストや画像などをブロック単位で作成します。

ブロックエディタの特徴は、WEB制作に必要なHTMLやCSSの知識がなくても、簡単にレイアウトや装飾を作れて、直感的に扱える点です。

また、再利用するような定型文などを登録できる機能があり、より効率的に記事作成ができるようになりました。

では、実践あるのみなので使い方を確認して行きましょう！

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

まずは、ブロックエディタの編集画面の構成を解説します！

編集画面の全体図

管理画面の左メニューから「投稿」の「新規追加」を選択すると編集画面が表示されます。

記事を作成するエディタは、大きく分けて４つのエリアがあり、これらを使いブロックの操作や記事の作成をします。

ツールと設定メニューバー

主に、ブロックの追加や下書き保存など、記事に共通した操作するボタン類が並んでいます。

「7～9」以外は、あまり使用することはないです。

「3：操作を1つ戻す（元に戻す）」は、パソコン操作の「元に戻す」と同じでキーボード入力の ctlr + Z で実行できるので基本的には使うことは少ないでしょう。

「7：下書き保存」は、記事作成の途中に適度に行うようにしょう。

編集エリア

記事を編集するエリアにあり、ここに記事の本文（コンテンツ）を書いていきます。

新規作成時では「2：記事の本文（コンテンツ）」の部分に「文章を入力、または/でブロックを選択」の何も入力されていない『段落ブロック』が1つある状態から始まります。

ここに、文章や画像の挿入などを行って記事を作成していきます。

設定パネルメニュー

右側にある設定パネルメニューは、投稿する記事に関する設定やブロックに関する設定を行います。

ブロックを選択していない場合、は『投稿タブ』のメニューが表示され、ブロックを選択している場合は、『ブロックタブ』のメニューが表示されます。

投稿タブ

投稿に関する設定は、基本的にそれぞれ設定を行います。

「2：リビジョン」は必要に応じで、過去記事に戻したい時などに使います。

「8：ディスカッション」は、ブログ運営方針により利用頻度は変わりますが、使わないケースが多いですね。

ブロックタブ（段落）

上記では、『段落ブロック』の例で説明してます。

ブロックに関する設定は、選択しているブロックによって設定できる項目は変わります。

また、有効化しているテーマによって設定項目が追加される場合もあります。

追加パネルメニュー

追加パネルに関する設定は『カスタムフィールド』以外の項目も、有効化しているテーマによっては設定項目が追加される場合があります。

なお、追加パネルメニューは初期状態では表示されませんので表示の方法を説明します。

追加パネルの表示は「設定メニューバー」の「エディタ設定（…）」をクリックして「設定」を選択します。

「追加パネル」の「カスタムフィールド」に☑を入れると「有効化してリロード」ボタンが表示されるので選択すると表示できます。

WordPressの記事作成から投稿するまでの流れ

記事作成から投稿するまでの流れは以下になります。

まずは、順に沿って記事作成と各種設定を行い、公開までを行って流れを把握しましょう！

記事の新規作成

左メニューの「投稿」⇒「新規作成」を選択します。

記事のタイトル・本文・見出しなどを作成

記事のタイトル・本文・見出しを作成を行います。

記事のタイトルを入力

「タイトルを追加」を選択して、記事のタイトルを入力します。

記事の本文（コンテンツ）を書く

ここからブロックを使いながら記事の本文を作成していきます。

上記のブロックメニューは「段落ブロック」に表示される項目になります。

ブロックメニューに表示される項目はブロックのタイプで異なり、段落ブロックの場合は「5：テキストを太字」「7：リンク追加」はよく利用します。

『段落ブロック』は「Enter」を押すだけで、段落ブロックを追加できます。

段落ブロック内で「改行」したい場合は「Shift + Enter」を押します。

記事に見出しを挿入

「ブロック追加」から「見出しブロック」を挿入する手順です。

見出しは、長文の文章を読みやすくするために使います。

『見出し』は「見出し2」「見出し3」など複数あり、入れ子構造の順番で見出しを正しく使いましょう。

記事にリストを挿入

「段落ブロック」を「リストブロック」に変換で挿入する手順です。

1. 変換する段落ブロックの「ブロックタイプまたはスタイルを変更」を選択
2. 「リスト」を選択

『リスト』は、要点を箇条書きでまとめ書きする時に使い、番号付きのリストも使えます。またインデント構造（字下げ）のリストも作成できます。

その他に「引用ブロック」「コードブロック」「テーブルブロック」など、用途に応じたブロックを駆使して記事の本文（コンテンツ）を作成します。

記事のテキスト装飾・画像を追加

記事の本文（コンテンツ）がテキストだけで書かれていては、訪れたユーザーにうまく伝わりません。

記事で伝えたい重要な文を明確にしたり、文章だけでは伝わりにくい場面などは画像など使い補いましょう。

記事のテキストを装飾

テキストを太字にできます。

テキストの色を変えれます。

記事に画像を追加

『画像の追加』は、以下の3つのいずれかで追加できます。

画像をアップロードして追加すると、編集画面に画像が表示されます。

画像のスタイルや位置、大きさの調整、Altテキストなどの設定ができます。

記事のパーマリンク・カテゴリー、タグ・アイキャッチ画像を設定

記事の本文ができたら、記事を公開するための設定を行いましょう。

記事のパーマリンクを設定

『パーマリンク』は、記事毎に設定できるURLのことです。

WordPressの初期状態では、数字や日本語などが設定されているので、英語表示に変更しましょう。

設定パネルメニューの「パーマリンク」⇒「URLスラッグ」を選択して、パーマリンクを英語表示に書き換えます。

WordPressの設定によっては、パーマリンクの編集できない場合があります。

編集ができない場合は、WordPressでブログを書き始める前に行う初期設定！【パーマリンク設定】を参考にして、WordPressの設定を先に行いましょう。

記事のカテゴリー、タグを設定

『カテゴリーやタグ』は、記事を関連記事としてまとめるもので、「カテゴリー＝フォルダ」「タグ＝付箋」とイメージしてもらえば良いです。

記事に対して「カテゴリーは１つ」「タグは複数」で設定されることが一般的と言われてます。

新規でカテゴリー・タグを作成したときの注意点！

「新規カテゴリーを追加」や「新規タグを追加」を日本語で追加した場合、URLの一部となるスラッグが日本語で登録されるため、新規作成したあとは英語表示に修正しましょう！

カテゴリーもタグも修正する手順は同じなので、WordPressでブログを書き始める前に行う初期設定！【カテゴリーの設定】を参考にして、スラッグの修正を行いましょう。

【初心者向け】WordPressでブログを書き始める前に行う初期設定12選！

smartlife-weblog.com

2021.6.2

記事にアイキャッチ画像を設定

『アイキャッチ画像』は、記事のトップや記事の一覧画面などで表示されるメイン画像です。

訪れたユーザーに画像で興味を引くだけでなく、ブログのデザインの一部にもなりますので設定しましょう。

設定パネルメニューの「アイキャッチ画像」の「アイキャッチ画像を設定」を選択します。

代替テキストは「Altテキスト」として使用できますので、記事のタイトルなどにしておくと良いでしょう。

記事のプレビュー・公開【完成！】

記事の作成と設定が完了したら、『プレビュー』で出来上がりを確認しましょう！

編集画面上と実際のブログ記事では、レイアウトなど見え方が違うので問題ないか確認を必ず行いましょう。

プレビューで確認して、問題なければ「公開」を選択して、世界に公開しましょう！

初めての場合は、記事を書くことや設定などたくさんあってとても大変に感じたと思いますが、誰でも最初は同じなので心配しないでください！

『記事を書く』ことで上達し慣れやコツが掴めてくれば、もっと簡単にできるようになります！

ブロックエディタの基本的な操作

ブロックエディタの基本的な操作方法を紹介します！

ブロックエディタならではの便利な機能がありますので、これらを知って使いこなしましょう！

ブロックの追加

ブロックの削除

ブロックの移動

「6点のアイコン」をドラックでブロックを任意の場所に移動でき、「∧∨」で1ブロックずつ上下に移動できます。

記事構成の修正や改善する時など、コピペが不要で順番を入れ替える時は便利なので重宝します。

ブロックの変換

入力した内容を保持したまま変換できるのは便利ですね。

ブロックの複製

ブロックをまとめて複製して文章だけ変更するなど、装飾を再利用などしたい時に便利に使えます。

ブロックの再利用

これだけで、他の記事でも再利用ブロックに登録したブロックを簡単に呼び出せるようになりました！

登録したブロックを簡単に呼び出せるので、よく使用する定型文などを登録すれば、記事の作成も時短になりますね。

再利用ブロックに登録したブロックを呼び出した後、通常ブロックに戻して編集することで、個別ブロック（通常ブロック）に戻すことができます。

定型文として使用するけどブログの記事毎で部分変更したい時などは、通常ブロックに戻して編集するという活用もできます。

もっと便利にする機能と時短のコツ

ひとつ前で紹介した「再利用ブロックの追加」も便利な機能のひとつですが、ブロックエディタならではのもっと便利な機能を紹介します！

覚えるまでに多少時間はかかりますが、よく利用するブロックは覚えるとスムーズに記事作成できるようになりますよ！

/（スラッシュ）ショートカットでブロックを呼び出し

まずは、ブロックの呼び出しを早くする機能で、『/（スラッシュ）』入力だけでブロックの候補を素早く呼び出せます。

すべてのブロックが表示されるわけではありませんが、よく利用するブロックが候補として表示されるので、とっても時短になります！

/（スラッシュ）ショートカット+ブロック名で呼び出し

「/list」など『スラッシュ＋ブロック名』でブロックを指定して呼び出して選択することができます。

記事作成時にはショートカットブロックの便利な機能をガンガン使って行きましょう！

またショートカットブロックは、WordPressテーマ固有のブロックも「/ブロック名」で呼び出しできます。

その他のキーボードショートカット

その他の『キーボードショートカット』として、ブロックの操作をキーボードショートカットで扱えるとマウス操作が減りさらに快適になります。

ブロックエディタの基本操作で紹介した移動や複製など、いくつかキーボードショートカットが割り当てられてます。

キーボードショートカットを忘れた時には『Shift+Alt+H』で、キーボードショートカットを表示して確認しましょう。

最初は慣れなくて時間がかかるように感じると思いますが、徐々に当たり前になれば確実に効率的に記事作成ができます！

Mackdown記法（マークダウン）を覚えよう！

｢/（スラッシュ）ショートカットキー」や｢キーボードショートカットキー」だけでも時短になりますが、もうひとつの時短のコツが『Markdown記法』になります。

Markdown記法を使えば、今よりも執筆速度がアップできます！

なぜなら、ボクもMarkdown記法を使うようになって約20％ぐらいの時間短縮になり手間も減ったからです。

執筆速度を早くしたい人は、Markdown記法でWordPressブログの執筆速度アップとおすすめ無料ツールを紹介で詳しく解説していますので、ご覧になってください！

【超速】Markdown記法でWordPressブログの執筆速度アップとおすすめ無料ツールを紹介

smartlife-weblog.com

2021.5.18

まとめ

この記事では、WordPressブロックエディタ（グーテンベルク）での「記事作成の流れ」と「基本な編集画面の構成」と「便利で時短できる使い方」などを紹介しました。

ブロックエディタを使いこなすには、とにかく触ってブロック操作や記事作成の経験値を積み上げることが一番早く上達します！

新規投稿で練習用に1つ記事を作るのも良いでしょう。

最後まで読んでいただきありがとうございました。この記事であなたの悩みが解決できれば幸いです！