【マニュアル】WordPressのエディタ(編集画面)の説明

さぽ子

今回は、投稿や固定ページを編集する時の画面となるエディタの操作方法について解説いたします。

てるみ

WordPress5.0から新しい「ブロックエディタ」になったため、戸惑う方も多いですよね。おまかせプランの新テンプレートもこのブロックエディタになっています。

さぽ子

そうなんです。これまでのマニュアルは、今までの「クラシックエディタ」向けなので、こちらの記事で新しい「ブロックエディタ」について詳しく解説します。

ブロックエディタの画面について

今までと大きく違うのは、見出しや段落を一つの「ブロック」として扱い、そのブロックを積み上げて作成するという形になっているところです。

今までは、大きな編集画面にテキストやらHTMLコードを打ち込んでいたんですが、ブロックエディタは、より直感的に操作できるようになったので、HTMLなどの専門的な知識がなくても編集しやすくなりました。

ブロックエディタの実際の画面

上記の画像が実際の画面です。赤枠で囲った①ツールバー、②コンテンツ編集エリア、③文書・ブロック設定エリアの3つのエリアで構成されています。各エリアごとに詳しくみていきましょう。

①ツールバー

こちらは、ブロックの追加や元に戻す、プレビューや公開などができます。また、エディタの表示方法もお好みによって変更することができます。実際に触ってみて、色々試して下さい。

よく使うのは、1のブロック追加と7のプレビューボタン、8の公開ボタンです。

  1. ブロックの追加
  2. 元に戻す
  3. やり直す
  4. コンテンツの構造
  5. ブロックナビゲーション
  6. ブロックのモード(編集・選択)
  7. プレビュー確認ボタン(公開前に表示確認ができる)
  8. 公開ボタン(公開されて誰でも見れるようになる)
  9. 右側の設定の表示・非表示
  10. エディタの表示設定
1のブロックの追加をクリックすると表示される

②コンテンツ編集エリア

タイトルや文章などコンテンツを入力するエリアです。

ブロックの指定などせず、そのまま打ち込んでいくと、デフォルトは段落ブロックとなります。

こちらも色々触って試してみるのが早いですが、よく使うのは、「段落」「見出し」「画像」といったところでしょうか。

色々ありますので、ブロックの種類については、別の記事で詳しく解説したいと思います。

③文書・ブロック設定エリア

右側に表示されているエリアでは、ブロックの色などの細かい設定や、ページ自体の設定ができます。

「文書」「ブロック」はタブになっているので、それぞれ文字をクリックすると切り替わります。

ブロック設定について

以下のように、左側のコンテンツ編集エリアでブロックを選択している時は、自動的にブロックの設定が表示されます。

ブロックによって設定できる項目が違いますが、色やフォントの大きさなどが設定できます。

文書設定について

「文書」をクリックすると、公開の設定やパーマリンク(ページのURL)の設定、カテゴリーやタグの設定、アイキャッチ画像の設定、抜粋の設定など様々な設定ができます。

クリックすると、詳細がぱかっと開いて色々設定できます。

どんな設定ができて、どんな意味があるのかを説明していきます。

ステータスと公開状態

クリックすると、左の画像のような項目がでてきます。

公開状態は、「公開」をクリックすると、さらに設定項目がでてきます。その他に「非公開」「パスワード保護」が選べます。

ちなみに、WordPressには「下書き保存」も存在するのですが、下書きだとまだ公開したくない記事やページを操作ミスで公開してしまう可能性があります。(公開ボタンを誤って押してしまうと公開されるため)

そういったミスを防げるのが「非公開」です。非公開を選択した状態でしたら、公開ボタンを押して更新しても、ログインしている人にしか見ることができないからです。

企業などで、まだ発表前の情報などの記事を予め作成する場合などは、下書き保存より「非公開」を選択しておくほうが、そういったミスを防ぐことができ安心です。

日時をクリックすると、公開日時が設定できます。

デフォルトは、そのときの日時ですが、予約投稿もできるので、公開したい日時を選んで設定しておくと、その指定した日時に記事が自動的に公開されます。

まだ発表前のプレスリリースや、お休み前などに書き溜めておいて、少しずつ公開する、などといった使い方ができます。

パーマリンク

パーマリンクとは、そのページのURLのことです。デフォルトですと、タイトルがそのまま入力されていますが、書き換えることもできます。ここは、日本語でも英字でもどちらでもOKです。SEO的にもどちらでも大差はないそうです。

日本語のほうがどんなページなのか分かりやすく伝わりやすいですが、例えばリンクをメールなどに貼り付ける時に、エンコードといって日本語部分が 「%E3%81%82」のような文字列に置き換わってしまいます。URLが長くなってしまうのと、ぱっと見て怪しいリンクのようにも見えるので、その点は注意が必要です。

デコードといって、逆に日本語に直してくれるサイトなどもありますので、日本語URLを共有する場合は、そうったものを利用するのもいいかもしれません。

ただ、Twitterですと、日本語部分がURLと認識されず、リンクが切れてしまいます。そういった場合は、短縮URLなどに変換するもの一つの方法です。

カテゴリーとタグ

カテゴリーとタグは、投稿のみに表示されます。予め作成しておいたカテゴリーが表示されるので、チェックをつけてカテゴライズすることができます。

WebPorte+では制作時に、デフォルトで「お知らせ」というカテゴリーを1つ作成させていただいております。特に指定しなければ、「お知らせ」のカテゴリーに自動的になります。あとは、お客様のほうで自由に追加していただくことができます。

タグも同様ですが、カテゴリーが大分類だとすると、タグは小分類にあたる使い方をすることが多いです。あまりカテゴリーを細かくしすぎても分かりづらいので、さらに細かく分類したいときにタグが役に立ちます。記事数が多いときは、タグで検索することもできますし、整理や分類に活用できます。

アイキャッチ画像

アイキャッチ画像とは、Webサイトを見ている方の目を引く画像になります。設定することで、一覧などに表示されたときに、ぱっと目を引くので、ビジュアル的にも、ページや記事を実際にクリックして読んでもらうためにも重要な画像です。

できれば、記事やページの内容に関連している画像が望ましいです。

例えば、デモサイトのポルテクリニックですと、トップページのお知らせに表示されるような画像になります。

ただ、ページのタイトルだけ表示されているより、目も引きますし、ビジュアル的にも華があるサイトになります。

毎回設定するのも大変ですので、設定していない時用の画像の作成などもできますので、アイキャッチ画像のことでサポートご希望の方は、サポートセンターまでお気軽にお問い合わせください。

抜粋について

WebPorte+が使用しているテンプレートにある「抜粋」という機能は、metaタグのdescriptionにあたるため、SEOの重要な項目になります。ページや記事の内容の抜粋を書いていただくのですが、検索で引っかかりたい、キーワードなどを含ませて書くとより効果的です。

検索したときに、タイトルの下に表示される文章となりますので、ページや記事ごとに設定しておくと、SEOにも効果的です。

WebPorte+では制作時にページごとに設定するようにしております。

SEOに関しては、まず「SEOの基本」をお読みいただくといいと思います。

さぽ子

以上、WorPressの操作方法〜エディタ編〜でした!
思ったより長くなってしまいましたが、以前よりぐっと直感的に操作できるようになっております!参考にしていただいて、色々試してみて下さい。
ご契約者さまの不明点やご質問はいつでも受け付けておりますので、お気軽にお問い合わせください!

無料相談してみる