WordPress

ブロックエディタ( WordPress Gutenberg)を使った記事作成

Gutenberg(グーテンベルク)は、2018年12月からWordPressに導入されたエディタです。
文章や画像、リストなどを「ブロック」という単位で管理するため、レイアウト変更なども直感的に操作できます。どんどん触って慣れてみるとよいでしょう。

記事作成画面へのアクセス方法

ダッシュボード左側のメニューから、記事を作成・投稿したい項目を選択します。

サイトのつくりによって並ぶ項目名は違いますが、画鋲のようなアイコンがついているメニューが記事を投稿できる機能を持っています。

項目名にマウスを載せると「投稿一覧」「新規追加「カテゴリー」「タグ」という項目が並ぶサブメニューが表示されますので「新規追加」を選択し、記事作成画面へ入りましょう。

基本的な使い方

ブロックエディタではメインエリア内に「見出し」「段落」「画像」などのブロックを作成・配置し、記事を仕立てていきます。
メインエリアで「」ボタンをクリックし、「見出し」「段落」「画像」など表示されたメニューから作成したい種類のボタンを選択し、新しいブロックを追加していくというのが基本的な使い方です。

段落ブロックを作成しテキストを入力する

記事の作成をしてみましょう。
通常の文章を記述したい時に「段落ブロック」を利用します。

メインエリア内の文字カーソル部分からそのままテキスト入力すると、段落ブロックが作成されます。

また「+」ボタンをクリックし、表示されたメニューから段落アイコンを選択することでも段落ブロックを作成できます。

段落ブロック内でテキストを入力しているときに、Enterキーを押すと、新しい段落が作成されます。段落を変えずに改行のみをしたいときは、Shift+Enterを押しましょう。

ブロックの削除

作成したブロックを削除したいときには、まず削除したいブロックを選択します。次にブロックツールバーの一番右にある、点がタテに3つ並んだアイコンからメニューを出して、一番下の「〇〇を削除」を選択するとブロックの削除ができます。

ブロックの位置入れ替え

段落や見出しブロックの位置を入れ替えたい場合には段落を選択して、ブロックツールバーの「⌃」「⌄」をクリックします。

ブロックを現在の位置より一段上、または一段下に移動できます。

見出しを作成する

見出しを作成したい場合も、段落のときと同じように+ボタンをクリックします。

見出し」ボタンを選択しクリックすると見出しブロックが作成されます。

「見出し」が見つからないときには+ボタンをクリックした後に検索窓に「見出し」と入力してみてください。

または「すべて表示」をクリックすると、使用できる全てのブロックが表示されるのでその中から探してみましょう。

メインエリアで半角「/」を入力し、出てきたメニューから「見出し」を選ぶことでも見出しブロックを作成できます。

ブロックツールバーから見出しレベル(H2~H6)を選択し、ボックスに見出しにしたいテキストを入力します。

上記では最初から「見出し」としてブロックを作りましたが、既にテキストを入力した「段落」ブロックを「見出し」に変えることも可能です。

テキストを入力した段落ブロックのブロックツールバーの「段落アイコン」をクリックして「見出し」に変更します。見出しに変更した後は見出しレベルも設定しましょう。

見出しはH1~H6まで用意されていますが、基本的にはH2~H4を使います。H2大見出し→H3中見出し→H4小見出しとして使用するようにしてください。(H1は記事のタイトルになりますので見出しとしては使用しません)。

記事にパソコン内の画像を追加する

パソコン内の画像を記事に追加する

記事の中に画像を追加する方法です。段落や見出しを追加するときと同じように、+ボタンをクリックし「画像」を選択します。

見つからないときには「すべて表示」を選んで「画像」を探しましょう。

またはメインエリアで半角「/」を入力してメニューから「画像」を選ぶことでも画像ブロックを作成できます。

アップロード」を選ぶとWindowsならエクスプローラー、MacならFinderが開き、パソコン内のファイルを選ぶことができます。

記事に追加したい画像を選び「開く」ボタンをクリックすると画像が追加されます。

WordPressでは記事に画像や動画を追加すると、その画像がWordPress内の「メディアライブラリ」に保存されます。

保存された画像や動画は「メディアライブラリ」から呼び出して他の記事でも使うことができます。

メディアライブラリから記事に画像を追加する

メディアライブラリから画像や動画を呼び出したい場合には+ボタンをクリックし「画像」を選択した後、「アップロード」ではなく「メディアライブラリ」を選びましょう。

メディアライブラリ内の画像が表示されますので、記事に追加したい画像を選びます。

メディアライブラリの編集

なお、記事に画像を追加する方法とは別に、直接メディアライブラリに画像を追加することも可能です。WordPressのダッシュボードから「メディア」「新規追加」をクリックすることで、新規画像をメディアライブラリに入れることができます。

画像サイズや表示位置を設定する

サイドバーのブロック設定から、記事に追加した画像のサイズや角の形状を変更できます。

またブロックツールバーの「配置を変更」アイコンをクリックすると画像の配置を「中央揃え」から「左寄せ」「右寄せ」「幅広」「全幅」に変更できます。

右寄せ・左寄せをした場合、次のブロックのテキストや画像がまわりこんで配置されますので、画像の配置を変更した後はイメージどおりに表示がされるかしっかり確認しましょう。

箇条書きリスト(番号あり・番号なし)を作成する

記事内に箇条書きリストを作成したいときには「リスト」ブロックを使います。

「+」ボタンをクリック、または半角で「/」を入力してメニューから「リスト」を選びましょう。

すでに入力してある段落ブロックをリストに変更することでのリスト作成も可能です。

リストにしたい段落ブロックを選択し、ブロックツールバーの段落アイコンをクリックし、リストアイコンに変換します。

Shift+Enterで改行を入れておいたテキストが箇条書きリストになります。

番号無しリスト・番号付きリスト

デフォルトでは順序をあらわす番号の無いリストが作成されます。順序をあらわす番号が付いたリストを作成したい場合は、ブロックツールバーから番号付きリストのアイコンをクリックしましょう。

階層をもつリスト

リスト内で階層構造をあらわすため、項目の先頭を右側にずらしたい(インデント)場合には、ずらしたい項目にカーソルを合わせて「リスト項目をインデント」ボタンをクリックします。(一番上の項目はインデントできません)。

「リスト項目のインデントを戻す」ボタンで戻したり、任意の階層だけを番号付きリストにしたりなど柔軟に箇条書きリストを作成することが可能です。

リストのデザイン

サイドバーのブロック設定から、リストの背景色や文字の色、テキストサイズを変えることができます。

サイト内別ページや外部サイトへのURLリンクの設定

リンクの設定をする

段落やリストなどのテキストに、サイト内または外部Webサイトへのリンクを設定する方法です。

リンクを設定したいブロックをクリックし、ブロックツールバーから「リンク」をクリックします。表示されたボックスにURLを入力することでリンク先が設定されます。

リンク先のWebページはデフォルトでは同じタブで開くようになっています。

新しいタブでページを開くようにしたい場合には、リンク先URLを設定してから「リンク設定」を開くと「新しいタブを開く」トグルボタンをONにしましょう。

通常、外部サイトへリンクさせる場合は、チェックを入れます。

画像リンクの設定をする

バナーなどの画像をクリックすることで任意のWebページを開く「画像リンク」の設定方法です。

まずは「記事に画像を追加する」やり方で、リンクを貼りたい画像を記事内に挿入します。

追加した画像を選択し、ブロックツールバーの「リンクを挿入」ボタンをクリックし、表示されたボックスにリンクさせたいURLを入力します。

リンクさせるURLを入力してから「リンク設定」を開くと「新しいタブを開く」トグルボタンが表示されるので、外部サイトへリンクさせる場合などは、ONにしましょう。

パーマリンク設定

パーマリンク・スラッグとは

たとえば「https://AAA.com/blockeditor」というURLがあった場合、「https://AAA.com」の部分はサイト内共通になりますが、末尾の「blockeditor」部分はWebサイトのページ(記事)ごとに設定される文字列になります。

URL全体のことを「パーマリンク」と呼び、URLの末尾部分を「スラッグ」といいます。

スラッグ部分は記事を投稿するときに、記事のタイトルまたは投稿した日時などから自動的に決められます(あらかじめWordPressの設定でパーマリンクの名づけルールを選択できます)。

SEOで高評価を得るためには、自動で付けられた名前から、より適した名前に変更をすることをおすすめします。

スラッグの変更

サイドバーの投稿設定から、パーマリンクの項目をクリックして開きます。

URLスラッグのところに現在のスラッグ名が入っていますので、任意のスラッグ名に変更しましょう。

効果的なパーマリンク設定とは

パーマリンク名(スラッグ名)を決めるときには以下のポイントに気をつけて名づけましょう。よりSEOで高評価を得やすくなり、検索における上位表示がされやすくなります。

  • そのページに関係する英単語を使用
  • シンプルに短くわかりやすく
  • ハイフンを活用し単語を区切る

記事を公開してからは変更しない

パーマリンク名を決めるのは記事を作成、または公開する際におこないましょう。

公開した後に変更してしまうと、他のサイトでWebページを紹介されている場合、そのURLと変更後のURLが違ってしまいます。そのために訪問者がサイトに来られなくなってしまったり、SEOの評価がリセットされるなどしてしまい、検索表示順位に悪影響をおよぼすおそれがあります。

カテゴリーとタグの設定

カテゴリー

カテゴリーは記事をおおまかに分類するために使います。カテゴリーを上手に使うことで管理者および訪問者の利便性が上がり、SEO効果も期待できます。設定は必須です。

カテゴリーの設定

サイドバーの投稿設定から、カテゴリーの項目をクリックして開きます。既にあるカテゴリーから選んでチェックを入れるか、「新規カテゴリーを追加」から新しいカテゴリーを作成します。

記事を公開してからはカテゴリー変更しない

カテゴリはスラッグと同様にURLの一部に使われることが多いので、公開した後に変更してしまうと、検索表示順位に悪影響をおよぼすおそれがあります。カテゴリーは記事を公開してからは変更しないようにしましょう。

タグ

タグはその名のとおり投稿記事を分類するために付ける「札」のイメージで使用するもので設定は任意です。

記事にタグを設定することで、サイトの訪問者が同じキーワードに関連する記事を見つけやすくなります。カテゴリーよりも小さい分類で、記事に出てくる主要な言葉3~5個ほどをタグにするとよいでしょう。

タグの設定

サイドバーの投稿設定から、タグの項目をクリックして開きます。「新規タグを追加」から新しいタグを作成します。

記事を公開する

記事の公開

記事が完成したらWordPress画面右上の「公開」をクリックします。

本当に公開するか確認されたのち、再度公開ボタンをクリックすることで、記事が即時公開されます(設定で公開前確認を無しにすることも可能です)。

公開予約設定

WordPressには公開したい日時を指定できる「予約投稿」の機能もあります。

「公開」をクリックした後、「公開:今すぐ」の横、下向きの印をクリックし、メニューを開きます。

公開したい日時を入れてメニュー上部の「予約投稿」ボタン(それまで「公開」だったボタンが「予約投稿」に表示が変化します)をクリックすると、予約が完了します。

TOP