初心者向け

ワードプレス投稿(ブロックエディター)の使い方!7つの手順を解説

2022年4月2日

こんな方に読んで欲しい!

  • ワードプレスの「投稿」画面の使い方がわからない!
  • クラッシクエディタ―からブロックエディターに切り替えたい!
  • これからブログを書き始めようと思ってる!

はじめてWordPress(ワードプレス)で記事を書くとき、「投稿」画面が複雑で操作に悩んでしまいます。

そこで今回は、WordPressの投稿画面の使い方について、次の3点を解説していきます。

  • WordPress投稿画面の操作手順
  • WordPress投稿画面で記事を公開するまでの流れ
  • ブロックエディターの使い方、全ブロックの役割
筆者は、WordPress歴7年で、過去30近いサイトを作っています。その経験も踏まえておすすめの設定手順も紹介するので必見ですよ!

それでは、本編をどうぞ!

WordPressの「投稿」とは

WordPressでブログ記事を作成するときに使うのが、「投稿」機能です。

ブログ運営をされる方は、これから一番使うことになります。
「投稿」で作成したページは、WordPressの初期設定ではトップページの投稿一覧で表示されます。

新着一覧

さらに詳しく!

WordPressには、「投稿」と同様にページを作成する「固定ページ」という機能があります。

「固定ページ」は、「お問い合わせ」や「プライバシーポリシー」といった、ブログの発信内容に関わらずブログ運営に欠かせないページを作成する際に使います。

詳しくは「ワードプレスの固定ページとは?投稿ページとの違いや注意点について解説!」をご参照ください。

WordPressの投稿画面を開く

投稿画面は、WordPress管理画面の左側のメニューから「投稿一覧」を選択し、出てきた画面で「新規追加」のボタンを押します。

もしくは、左側のメニューで「新規追加」を選択します。

新規追加

 

投稿画面を開いたら「ブロックエディターにようこそ」の画面が開きます。

ブロックエディター

「投稿」画面から記事を公開する流れ

それでは、投稿画面の使い方を説明していきます。

投稿画面はWordPressテーマによって若干異なりますが、大きくは変わりません。

インターネットビジネスラボが使っているWordPressテーマ「AFFINGER」の画面をもとに解説します。

ブロックエディター エリア

まずは簡単に記事を作成して、公開するまでの流れをつかんでみましょう!

投稿を公開までのステップ

  1. 「タイトルエリア」で記事タイトルを入力する
  2. 「本文エリア」で記事を作成する
  3. 「公開ボタンエリア」で適宜「下書き保存」する
  4. 「設定エリア」で投稿設定を行う
  5. 「公開ボタンエリア」でプレビューする
  6. 「本文エリア」で記事の修正を行う
  7. 「公開ボタンエリア」で記事を公開する

手順1. 記事タイトルを入力する

まずは、記事タイトルを入力していきます。

ブロックエディター タイトル

タイトル欄には「タイトルを追加」と薄く文字が入っています。

そのあたりをクリックしてタイトルを入力していきましょう。タイトルはサイトの新着画面だけでなく、Google検索した時の検索結果にも表示されます。

記事の検索順位やクリック率にも関わる非常に重要な項目のため、慎重に決めましょう。

ブログ記事のタイトルの決め方は、こちらの記事が参考になります。

参考:SEOを意識したページタイトルの決め方とは?【Webライティングの基本】

手順2. 本文エリアの使い方

つづいて、本文エリアにコンテンツを作っていきます。

ブロックエディター 本文

WordPressの本文エリアは、ブロックといわれる単位でコンテンツを作っていくブロックエディターが採用されています。

本文エリアは、右側の「+」欄をクリックすることでポップアップされるメニューから、使うブロックを選んでいきます。

「+」を押すとよく使うメインのブロックが6つ表示されます。この6つは普段使用しているブロックが表示され、それ以外のブロックを使用する場合は「全て表示」をクリックします。

ブロックエディター +

「段落」ブロックの編集

たとえば、記事の文章をつくる「段落」のブロックを使ってみると、以下のようなブロック設定画面がでてきます。

ブロックエディター ポップアップ

「段落」ブロックの上に表示されるメニュー

「段落」ブロックの上に表示されるメニューバーでは、ブロックを変更したり、テキストの太字・色の変更・センタリング、ブロックのコピーや複製などができます。

こちらの動画で、やり方を解説します。

「段落」ブロックの右側に表示されるメニュー

また、右側の「設定エリア」のブロックタブで、テキストのフォントサイズやフォントやブロック背景の色が設定できます。

こちらの動画で、やり方を解説します。

 

メモ

ちなみに、通常の改行は「Enter」で行えますが、同じ文章の中で折り返したい時は「Shift + Enter」で行えます。段落だけでなく見出しなども同じ操作でできます。

手順3. 適宜「下書き保存」をする

ある程度の記事をつくったら「下書き保存」をしていきましょう。

「下書き保存」を忘れてしまうと、せっかく作った記事も途中で消えてしまう可能性があります。

私もパソコンが落ちて、書いていた文章が水の泡になった経験が何度かありました・・・。本当に後悔するので、下書き保存はこまめに行うといいでしょう。

「下書き保存」は、画面右上のヘッダメニューにあるボタンをクリックするだけなので非常に簡単にできます。

ブロックエディター 下書き保存

手順4. 「設定エリア」で投稿設定を行う

投稿」タブを選択すると、公開状態の設定やパーマリンク、カテゴリー、タグ、アイキャッチ画像など、このコンテンツ全体に関わる設定が行えます。

ブロックエディター 投稿

代表的な設定について、それぞれ解説します。

ステータスと公開状態

「ステータスと公開状態」は、公開している記事を非公開にしたり、パスワード保護した記事に変えることができます。

また、日時を指定して公開予約することができます。

ブロックエディター 公開

パーマリンク

「パーマリンク」は、設定をしないとタイトルがそのまま入力されます。

パーマリンクは検索順位に影響するため、そのままではなく独自で設定するといいでしょう。

ブロックエディター パーマリンク

パーマリンクが検索順位に与える影響は、次の記事で解説しています。

カテゴリ―・タグ

「カテゴリ―」と「タグ」は、サイトの関連する記事をまとめるものです。

それぞれをサイドバーから設定することができます。

ブロックエディター カテゴリ―

カテゴリ―とタグの違いやSEO効果、注意点は、次の記事で解説しています。

アイキャッチ画像

「アイキャッチ画像」は、ブログのトップに表示される画像です。

アイキャッチ画像を設定すると、こちらに設定された画像が表示されます。

ブロックエディター アイキャッチ画像

抜粋

「抜粋」は、ブログの記事一覧に表示される記事の内容を抜粋する文章です。

ブロックエディター 抜粋

抜粋に文章を入力すると、次のように記事一覧のタイトルの下に指定の文章が表示されます。

ブロックエディター 抜粋

手順5. プレビューする

プレビュー」ボタンを選択すると、サブメニューが開きます。

最初は「デスクトップ」に設定されているので、「新しいタブでプレビュー」を押すと、デスクトップ(PC)で見るサイト画面で確認できます。

ブロックエディター プレビュー

デスクトップだけでなくモバイルでも確認しましょう!

スマホで見ると改行が少なくて見づらいなんてことが見つかりますよ!

手順6. 記事の修正を行う

ここまで公開前にタイトルや本文、カテゴリー、タグの設定などの確認と修正を行います。

手順5でプレビュー確認すると、ほぼほぼ修正すべき箇所が見つかります。

この作業を行うかどうかで、コンテンツのクオリティがかなり左右されるので、公開前必ず確認と修正を行いましょう。

手順7. 記事が完成したら「公開」する

コンテンツの作成が完了したら、右上のヘッダーメニューにある「公開」ボタンを押すと記事が公開されます。

また、予約投稿をするサイドメニューの「投稿」から公開日時が設定できます。

ブロックエディター 公開

投稿画面のブロック一覧

本文エリアは、右側の「+」欄をクリックすることでメニューがポップアップされますが、「全て表示」をクリックすると全メニューが表示されます。

やり方は次の動画の通りです。

 

ブロックは、WordPressテーマや使っているプラグインによって異なりますが、次のようなブロックカテゴリーに分かれます。

  • テキスト
  • メディア
  • デザイン
  • ウィジェット
  • テーマ
  • 埋め込み

それでは、それぞれについて細かく解説していきます。

これだけ覚えておけばOK!よく使うブロック

まずそれぞれについて解説する前に、よく使うブロックを5つ紹介します。

これだけ使えば、読みやすいブログ記事になりますよ!

よく使うブロック 使用用途
段落 ブロック 段落 文章を作成する
見出し ブロック 見出し 見出し(大見出し、中見出し、小見出し)を作成する
リスト ブロック リスト 箇条書きリスト、番号付きリストを作成する
テーブル ブロック テーブル テーブル(表)を作成する
画像 ブロック 画像 画像の挿入する

 

それでは、それ以外のものも含めて解説していきます。

テキストカテゴリ―

ブロック テキストカテゴリ―

テキストカテゴリ―のブロックは、文章を作成するのに使用するブロックです。

特に「段落」は、記事の文章を作成するブロックなので記事全体の9割以上が「段落」です。

テキストカテゴリ― 使用用途
段落 ブロック 段落 文章を作成する
見出し ブロック 見出し 見出し(大見出し、中見出し、小見出し)を作成する
リスト ブロック リスト 箇条書きリスト、番号付きリストを作成する
引用 ブロック 引用 他サイトのコンテンツ・URLを引用する
コード ブロック コード コードの直接入力する
クラシック ブロック クラシック クラシックエディタ(旧エディタ)へ切り替える
整形済みテキスト ブロック 整形済み プログラムのソース・コードのように、空白やタブ、改行も含め、ソース・テキストをそのまま表示する
プルクオート ブロック プルクオート 引用ブロックと同じ機能で、より目を惹くデザインを作成する
テーブル ブロック テーブル テーブル(表)を作成する
ブロック 詩 段落ブロックと余白や文字サイズが異なるデザインを作成する

メディアカテゴリ―

ブロック メディアカテゴリ―

メディアカテゴリ―のブロックは、画像や動画、ファイルなどのメディアファイルを挿入する際に使います。

画像や動画は、ページを読みやすくするのに重要な要素です。

メディアカテゴリー 使用用途
画像 ブロック 画像 画像を表示する
ギャラリー ブロック ギャラリー 複数の画像を表示する
音声 ブロック 音声 音楽、ポッドキャスト、その他の音声ファイルを表示する
カバー ブロック カバー 画像を背景にして、その上に段落や見出しブロックを挿入して表示する
ファイル ブロック ファイル PDFやWord、Excelのファイルなどのダウンロードファイルを挿入する
メディアとテキスト ブロック メディアとテキスト 画像や動画の横にテキストを並べて表示する
動画 ブロック 動画 動画を表示する

デザインカテゴリ―

ブロック デザインカテゴリ―

デザインカテゴリ―のボタン、カラム、サイトロゴなど、特にサイトのトップページを作成する際に使います。

デザインカテゴリ― 使用用途
ボタン ブロック ボタン 申し込みボタンなどのボタンを表示する
カラム ブロック カラム ブロックを横並びに表示する
グループ ブロック グループ 複数のブロックをグループ化する
続き ブロック 続き 「続きを読む」を表示する
ページ区切り ブロック ページ区切り ひとつの記事を分割して[1][2][3]とボタンをクリックして次のページを表示する
区切り ブロック 区切り 区切り線hrタグを表示する
スペーサー ブロック スペーサー 任意のスペースを表示する
サイトロゴ ブロック サイトロゴ サイトロゴを表示する
サイトのキャッチフレーズ ブロック キャッチフレーズ サイトのキャッチフレーズを表示する
サイトのタイトル ブロック サイトタイトル サイトのタイトルを表示する
アーカイブタイトル ブロック アーカイブタイトル アーカイブタイトルを表示する
投稿カテゴリ― ブロック 投稿カテゴリ― 投稿のカテゴリ―を表示する
投稿タグ ブロック 投稿タグ 投稿のタグを表示する
ボタンやカラムは、投稿の中で使う可能性もありますが、頻度はかなり低いです。ちなみにインターネットビジネスラボのトップページにも「カラム」ブロックを使っています。

カラム

ウィジェットカテゴリ―

ブロック ウィジェット

ウィジェットカテゴリ―のブロックも、投稿にはあまり使いません。

名前の通り、サイドバーなどのウィジェットによく使うブロックですが、意図的に投稿の中に使うのもありです。

ウィジェットカテゴリ― 使用用途
最新の投稿 ブロック 最新の投稿 最新の投稿を表示する。投稿数や稿者名の表示などの設定ができる
固定ページリスト ブロック 固定ページリスト すべての固定ページをリスト表示する
RSS ブロック RSS URLを入力してRSSを表示する
ソーシャルアイコン ブロック SNS ソーシャルアイコンリストを「デフォルト型」「ロゴ型」「カプセル型」から表示する
タグクラウド ブロック タグクラウド タグまたはカテゴリーのクラウドを表示する
検索 ブロック 検索 検索ボックスを表示する
ショートコード ブロック ショートコード ショートコードを直接挿入する
アーカイブ ブロック アーカイブ 年月ごとの投稿一覧を表示する
カレンダー ブロック カレンダー カレンダーを表示する
カテゴリ― ブロック カテゴリ― カテゴリ―を表示する。「投稿カテゴリ―」とデザインが異なる
カスタムHTML ブロック HTML カスタムHTMLコードを直接挿入する
最新のコメント ブロック 最新のコメント 投稿への最新のコメントを表示する

埋め込みカテゴリ―

ブロック 埋め込み

埋め込みカテゴリ―は、YoutubeやTwitter、Facebookなどの投稿・ツイートを埋め込み表示するブロックです。

ここでは、代表的なものだけ紹介します。

埋め込みカテゴリ― 使用用途
埋め込み ブロック 埋め込み Twitter、Instgram、Youtubeなどから引用表示する
Twitter ブロック Twitter ツイートを埋め込みます
Youtube ブロック Youtube Youtube動画を埋め込みます
WordPress ブロック WordPress WordPress投稿を埋め込みます

まとめ

今回は、投稿画面の使い方について解説してきました。

本記事の要約

  • WordPressの投稿画面は、ブロックといわれる単位でコンテンツを作っていく
  • 投稿画面は、7つの手順で設定できる
  • ブロックは「段落」「見出し」「リスト」「テーブル」「画像」をメインで使う

WordPressの投稿画面は、ブログ運営をする際に必ず使うので早目に覚えてしまいましょう!

-初心者向け