WordPress(Gutenberg)の超基本的な使い方

ブログ運営

WordPressをインストールしていざブログの記事を書き始めよう!としても、仕様が意味不明でどうしたらいいかわからない…となる方もおられるでしょう。

WordPressで記事を書くには、管理画面の「投稿」から「新規追加」を選択し、開かれた画面に書き込んでいくだけです。

ところが、現在のWordPressは「Gutenberg」と呼ばれるエディタ(ソフト?)を使用しており、これが初心者には使いにくいったらありゃしない。以前はクラシックエディタと呼ばれるものでしたが、数年前のアップデートからGutenbergへと変更されました。

一応、今でもクラシックエディタは使用できますが、2022年以降どうなるかわからないと言われており、それならGutenbergに慣れておかないとということで、僕も渋々これを使っています。

クラシックエディタに慣れていたので最初は本当に意味不明でしたが、初めからGutenbergを使う場合はもしかすると使いやすいと感じるかもしれません。

ここではGutenbergで記事を作成するための、超基本的な使い方を解説していきます。

スポンサーリンク

Gutenbergの仕様と記事の作り方

Gutenbergでは、「ブロック」と呼ばれるものを複数合わせてひとつの記事を作成します。

ブロックには「見出し」や本文を書く「段落」、他にも「画像」や「引用」など様々ありますが、ぶっちゃけ僕が使用するブロックはたくさんある中の一部だけ。それでもブログは作れるのでご安心を。

WordPressをインストールしただけの状態で新規投稿ページを開くと、以下のような画像が出るかと思います。

僕はこのままだと違和感があるので右上のオプション(縦の点3つ)を開き、フルスクリーンモードのチェックを外します。

すると以下のように管理画面のメニューが左側に表示されます。

どちらがいいかは人によるので、どちらでも好きなほうで作業していきましょう。

また、記事作成の画面や操作は使っているテーマによって若干異なります。上記画像は初期設定の「Twenty-Twenty」のまま開いたもの。僕が使用しているのは「Cocoon」というテーマで、こちらのほうが断然使いやすいですね。

この画面から記事を作成していきますが、「タイトルを追加」はそのまま記事のタイトル名を記入します。

その下の「文章を入力~」と書かれている箇所をクリックすると、右側に「+」と表示されるので、それをクリックすることでブロックの種類を選ぶことができます。

最初に「よく使うもの」としていくつかのブロックが表示されますが、下にスクロールすれば他のブロックも見ることができます。

ブロックの種類はたくさんありますが、ぶっちゃけ普通に記事を書くだけなら使用するブロックは限られますね。僕が基本的に使うのは見出し・段落・画像・リスト・スペーサーくらい。

例えば、見出しというブロックを選択すると以下のように表示されます。あ、タイトルにGutenbergの使い方と入れてみました。

見出しとは記事中の重要なタイトルのようなもので、見出しがあることで何について書かれている箇所なのかをわかりやすくするイメージですね。

この文章は「WordPress(Gutenberg)の超基本的な使い方」という記事タイトルの中の、「Gutenbergの仕様と記事の作り方」という見出しの中に書いているものです。

見出しは「H2」のように数字が入りますが、H1は記事タイトルに使用されています。記事中の大見出しはH2、H2の中の小見出しはH3、H3のさらに小さな見出しはH4…という形で使いましょう。

なので、「WordPress(Gutenberg)の超基本的な使い方」が見出し1(H1)で、「Gutenbergの仕様と記事の作り方」は見出し2(H2)となっています。

見出しの次に「段落」のブロックで本文を書いていきます。段落はわざわざ選択しなくても、エンターキーで改行してそのまま文字を記入すればオッケーです。

簡単にブロックを使って記事を作った例です。

  1. 記事タイトル(見出し1)
  2. 見出し2
  3. 段落
  4. スペーサーでスペースを追加
  5. 段落

記事タイトルはブロックに含まれませんが、記事の構成としてはこのような5つに分けられているということですね。

スペーサーを選ぶと、スペースの幅をドラッグして決めることができるので、適当な幅に合わせておきましょう。

ちなみに、上に書いた

この部分は「リスト」というブロックを使用し、リストは箇条書きか数字入りで表示することができます。

ざっくりですが、こういったブロックの積み重ねでひとつの記事が出来上がるというイメージですね。

初期テーマでは装飾がしにくい

ひとつの見出し内で文章量が増えると読みにくさに繋がりますが、少しテーマが変わるところで小見出しを使用するとスマートになります。(なってる?)

今回は「初期テーマでは装飾がしにくい」を見出し3(H3)で使ってみました。

初期設定のテーマだと、文字や背景色の装飾が少し不便です。装飾は右側のメニューにある「色設定」からできますが、試しに装飾してみると以下のようになるんですね。

文字も背景も、部分的ではなくブロック全体が対象になってしまうのです。ただ、僕の知らん間に文字色だけは部分的に装飾できるようになったようです。

部分的な装飾は文字を選択してブロック上部に出るツールバーから「▼」→「文字色」と進み、色を選択するだけです。ただ、色の選択肢が少ないし、カスタムカラーで色を指定できますが毎回だと面倒…

背景色は相変わらずブロック単位でしかできないので、ここまで説明しときながら初期設定のテーマをそのまま使うのはやめておいたほうがいいでしょう。

僕が使用しているcocoonでは、色の選択肢がこれだけ増えています。

とはいえ、このままでは背景色がブロック単位でしか変えられません。そこで、「Advanced Rich Text Tools for Gutenberg」というプラグインをインストールして有効化します。

その後、文字の範囲を指定して「色」ではなく「Inline Text Color」というメニューから文字色背景色を変更することができます。

他のテーマではどのような色が使えるのかはわかりませんが、これだけでも初期テーマを使うのはイマイチというのがおわかりいただけるでしょう。

僕は色んな装飾を試していくうちに、今では文字の色(赤字+太字)くらいしか使わなくなりましたけどね。装飾しすぎると読みにくくなりますが、装飾なしの文章も読みにくい。

バランスって難しいんだよ。

ブロックの削除

記事を書いているうちに、このブロックはいらんし削除したいけど…どうすんの?と思うことがあるでしょう。

ブロックの削除はブロックを選択したとき上部に出るツールバーの一番右「オプション」の中に「ブロックを削除」という項目があります。もしくは「Shist+alt+z」でも削除ができます。

投稿画面の右上にある縦3点のオプションを開くと、その中に「キーボードショートカット」とあるので、それを見ればキーボードによる操作がいくつか載っています。

これを覚えておけば作業が効率的になりますね。僕は削除の方法しか覚えてないけど。

パーマリンクなどの設定

満足する記事に仕上げるため様々なブロックを使いこなしたいところですが、まずは記事を多く書いて慣れることが先決でしょう。あれこれこだわったところで自己満足になるのがブログですから。

記事は見出し・段落・画像・スペースくらいで十分作れるし、他のブロックは慣れてきたら色々と試してみるといいです。

記事の内容も重要ですが、記事を投稿する際に同じくらい重要なポイントについて説明しておきましょう。それが「パーマリンク」「カテゴリー」「アイキャッチ」の設定です。

パーマリンク

パーマリンクとは、その記事を特定するためのもので、URLの最後に付く部分を指します。

例えば、この記事のパーマリンクは「wp-gutenberg」としましたが、これはWordPressのGutenbergの使い方についての記事ということを、自分ですぐわかるように付けました。

投稿画面の右側、「投稿」と「ブロック」と書かれている箇所の投稿を選択すると、パーマリンクを記入する箇所があります。ただ、一度下書きするなりしないと表示されないと思われるので、下書き保存を押したりして記入できる状態にして設定しましょう。

何も記入しなければ自動的に設定されますが、アクセス解析などで該当記事がすぐに判別できるよう、パーマリンクは記事の内容に合ったものを考えたほうがいいかもしれません。

また、Google様はパーマリンクによって記事を判別されるので、仮にまったく同じ内容の記事でもパーマリンクを変更すると別の記事として扱われます。

もし検索で上位表示されている記事のパーマリンクを変更した場合、違う記事とみなされるので一旦は上位表示されなくなる…といったことがあるので、パーマリンクはよく考えて付け、むやみに変更しないようにしましょう。※経験者は語る

カテゴリー

パーマリンクを入力する箇所より下のほうに、カテゴリーやタグ、アイキャッチ画像を選択する箇所もあります。

読者が検索してブログに辿り着いたとき、同じジャンルの記事なら興味がそそられて読んでもらえるかもしれません。そのために記事が増えたらカテゴリーを設定しておくといいですね。この記事は「ブログ運営」というカテゴリーにしています。

カテゴリーは管理画面の「投稿」にある「カテゴリー」から設定できます。

名前はカテゴリー名、スラッグはカテゴリーページのURLになるので、例えば僕のブログ運営カテゴリーでは「blog」と設定しています。

https://mtdl.work/category/blog/

このURLで僕のブログ運営について書いた記事の一覧ページに飛ぶことができます。

まぁこの辺りもテーマによって若干違いがあるかもしれませんが、設定する意味だけでも知っておくといいでしょう。

「親カテゴリー」はカテゴリーの大枠、同じカテゴリーでも小分けにしたい場合、カテゴリーを設定するときに親カテゴリーを選ぶとその下の階層にカテゴリーを設定できます

僕の場合、お金の話という親カテゴリーの下階層に投資や通信費などのカテゴリーを、さらに投資の下階層にも小分けしたカテゴリーを設定しています。

赤枠は黄枠の親、黄枠は緑枠の親カテゴリーとなります。緑枠にとって赤枠は…おじいちゃんかな。

アイキャッチ

アイキャッチは記事を開いたとき最初に出てくる画像です。

ブログ内で別の記事を紹介するときにも表示することができるので、興味を惹く画像を使えばPv数を増やすことができると言われますが、僕はアイキャッチで見るかどうか考えたことないですけどね。

WordPressでブログを始める手順
WordPressでブログを運営するには費用がかかりますが、無料ブログと比べて圧倒的に自由度が高く、収益化を目指すなら必須と言えます。費用といっても月1,000円前後と安く、仮に上手くいかなくてもリスクが低いのがブログの良いところ...

とはいえ、こんな感じでアイキャッチ画像が出るので設定はしておいたほうがいいとは思います。

目を惹くアイキャッチの作り方は調べれば出てきますが、いかにもそういったサイトを参考にして作ってるな…というアイキャッチが多いですね。とくにYouTubeのアイキャッチは見るに堪えない…

経験談ですが、アイキャッチは凝り出すとそれだけで時間をかなり取られるので、記事の内容と全然関係のない画像でなければシンプルなものにして記事の内容に注力したほうがいいと思います。

記事を投稿する

さて、記事を書いて各設定を済ませ、めでたく記事が完成すれば後は投稿するだけです。投稿ページの右上にある「公開」ボタンを押しましょう。

公開をクリックすると、以下のような画面が出てきます。

「公開状態」を開くとすべての人に公開するか、管理者と編集者のみ閲覧できるか、パスワードを設定してそれを知っている人のみに公開するかを選べます。

「今すぐ」を開くと記事を公開する日時を指定できます。決まった時間に投稿することで固定の読者がその時間に見に来てくれる…かもしれません。

「タグを追加」を開くとタグの設定ができますが、個人的にはどうでもいいかなと思っています。

記事を書いてすぐ投稿するもよし、時間を指定して予約投稿するもよし。最後に公開(予約投稿)をクリックすれば、無事に記事の投稿が完了です。

その他の機能

ここまで紹介した内容だけでも記事は作れますが、他の機能についても簡単に説明しておきます。

投稿画面の左に上にあるツールバーの「+」は、一番下にブロックを追加することができます。その横の鉛筆マークは正直よくわかりません。使うことはないでしょう。

その横の矢印は「元に戻す」と「やり直す」ボタンで、一つ前の作業を取り消したり、取り消した作業を戻す役目があります。

その横(赤枠)を選択すると画像のように記事の情報が表示されます。これを見ればブロックで記事を作っているというのがわかりやすいですかね。

一番右にある三本線は記事を構成する全ブロックが表示されるだけなので、使うことはほぼないでしょう。

投稿画面の右、公開ボタンの横にある歯車マークですが、これをクリックすると右側のメニューバーを表示させたりさせなかったりできます。

その横にある縦3点は気にしなくてもいいですが、投稿画面のカスタマイズ的なことができたり、執筆するモードみたいなものを選べたりするので、一度確認してみるといいでしょう。

再利用ブロックを使いこなせ

Gutenbergでは「再利用ブロック」と呼ばれる機能があります。

読んで字のごとく一度使用したブロックをもう一度使う機能ですが、例えば僕はスペーサーで幅を20pxという数値にしてスペースを使っていますが、スペーサーのブロックを選ぶと初期が20pxではないんですね。

なので、スペーサーで20pxに指定したブロックを再利用ブロックとして登録し、次からはその再利用ブロックを選択することで、1クリックで20pxのスペースが入るようにしています。

再利用ブロックを設定するには、ブロック上部に出るツールバーの一番右「設定」から「再利用ブロックに追加」を選択し、名前を付けて保存するだけです。

登録した再利用ブロックは、ブロックの追加で「再利用可能」という項目から使用できます。

何度も使っていると「+」をクリックして最初に出る箇所にも出てくるので、再利用ブロックをうまく使って作業を効率化していきましょう。

注意点として、再利用ブロックは編集することもできますが、編集するとそれまで使用していた再利用ブロックすべてに変更点が適用されるので、その記事だけ変えたい場合は再利用ブロックは使用しないほうがいいですね。

例えば、スペーサーで20pxと指定している再利用ブロックを30pxに編集すると、すべての記事のスペースが30pxに変更される…ということです。気を付けろ!

まとめ

Gutenbergではブロックを駆使して記事を作ります。

初期設定のテーマでは何かと不便なので、とりあえず「無料テーマ おすすめ」と調べておすすめされているテーマをアップロードしてから記事を作るようにしたほうがいいでしょう。

Gutenbergも慣れれば簡単に使えます。最初はややこしく感じるかと思いますが、めげずに収益化を目指して頑張りましょう。

ブログ運営
スポンサーリンク
hideをフォローする
金と共に生きぬ

コメント