【2020年入門】WordPress Gutenbergエディタの使い方を初心者向けに解説しました。

  • URLをコピーしました!
はじめ

WordPress Gutenbergの使い方がわからない。
最新のWordPressの使い方を教えて欲しい。

本記事は上記のようにWordPress Gutenbergの使い方がわからないという方のために書いています。

こんにちは!ツヨシ(@24shi_web)です。

私はWordPress歴は3年で、ブログを続けていたらアフィリ収益で生活できるようになった元会社員です。

さて、あなたも収入を得るためにWordPressブログを始めようと思っていましたか?

この記事を読めば、WordPressの使い方を学ぶことができますので是非参考にしてみてください。

この記事を書いてる人

溝口 剛
Tsuyoshi Mizoguchi

   

1986年生まれ 33歳 札幌在住
8年間会社員として働くも会社員としての生き方が嫌になり、フリーランスへ。現在はブログより年間1,000万円の収益を得ています。

この記事の内容

1.WordPress Gutenbergの使い方を解説。

さて、早速WordPress Gutenbergの使い方について解説していきます。

まずは、WordPressを始めて使う方のために基本的な操作方法についてです。

基本的な操作方法
  1. WordPressへのログイン方法
  2. WordPressの画面の見方
  3. WordPressの初期設定

具体的に一つずつ解説していきます。

1-1.WordPress管理画面へのログイン方法

WordPressにログインするためには以下のURLを入力します。

http(s)://あなたのドメイン/wp-login.php

基本的にはブログURLの後に「wp-login.php」を付ければOK。

それが、WordPressのログイン画面へアクセスするURLです。

すると、以下のような画面が表示されるので「ユーザー名とパスワード」を入力すれば、WordPressの管理画面にログインできます。

ちなみに、WordPressのログインページはブログのURLが知っている人であれば誰でもアクセスすることが可能なので、悪意のある不正ログインを行う人もいます。

なので、個人的にはWordPressのログインURLを変更しておくことをおすすめしています。

1-2.WordPressの管理画面の使い方と見方

次にWordPressの画面の見方についてです。

ちなみに、WordPressの使い方(管理画面の見方~各種メニューの使い方)について動画↑で解説しています。

こちらを見ていただければ、WordPressの使い方のイメージを掴んでいただけると思います。

話しはそれましたが、以下の画面がWordPressの管理画面となり、記事の作成から投稿までを行います。

左側のウィンドウに表示されているのがWordPressのメニューです。

そして、記事を書く時は「投稿→新規追加」を選択します。

すると以下のように「記事作成画面」が表示されます。

記事作成画面の使い方・見方は以下の通りです。

記事作成画面の見方
  1. 中央が「記事執筆エリア」
  2. 右側が「記事・ブロックの詳細設定」
  3. 下側も「記事の詳細設定」

さらに詳しくWordPressの管理画面の使い方が知りたい方は以下の記事をご覧ください。

1-3.WordPressの初期設定

次にWordPressの初期設定についてです。

WordPressをインストールしたら、まず初めに初期設定を行いましょう。

最初に最低限設定すべきポイントは2つです。

WordPressの最低限の初期設定
  1. WordPressのアドレス・サイトアドレスのSSL化
  2. パーマリンク設定

最低限、この2つだけ行っておけばOKです。

それ以外は、ブログ運営後にいつ変更しても問題ありませんので。

ただし、この2つに関しては後から変更する場合、ブログ運営上の不利益を被る可能性もあるので、必ず最初に行うようにしましょう。

詳しいWordPressの初期設定については以下の記事で解説していますので合わせてどうぞ。

2.WordPress Gutenbergで実際に記事を書く流れを解説

さて、それではWordPress Gutenbergを使って実際に記事を書く流れについて解説していきます。

具体的な流れは以下の通りです。

WordPressで記事を書く流れ
  1. タイトルを入力する
  2. コンテンツ(記事)の作成
  3. 記事の各種設定
  4. 記事を公開する

具体的に1つずつ解説していきますね。

2-1.タイトルを入力する

まずは、以下の箇所に「記事のタイトル」を入力していきます。

ちなみに、記事タイトルの文字数は「32文字」以内が好ましいと言われていますが個人的には気にする必要ないと言うの私の考えです。

なぜなら、私が参考にしているサイト「クレジットカードの読みもの」の記事タイトルはいつも50文字以上です。

間違いなく、記事タイトルの文字数よりもコンテンツが大事ということですね。

2-2.コンテンツの作成

次にコンテンツ(記事)を作成していきます。

WordPress Gutenbergは「ブロック」の組み合わせによって記事を執筆していきます。

最初は使いにくいと感じるかもしれませんが、慣れれば非常に使いやすいエディターですので、使い方をマスターしていきましょう。

具体的にブロックの使い方について解説していきます。

ブロックの使い方
  1. ブロックの追加方法
  2. ブロックの詳細設定

ブロックの追加方法

例えば、記事の本文を入力するブロックは「段落ブロック」を使います。

「段落」ブロックの追加方法

追加方法は、まず「+」部分を選択します。

そして、「一般ブロック」の中にある「段落」を選択すればOK。

また段落ブロックは「Enter」で追加していくことが可能なのでどちらでもOKです。

他のブロックを呼び出す方法

他のブロックを呼び出すときも同様です。

例えば、次に「見出し」を追加していきます。

先ほどと同じく「+」部分を選択します。

そして、「一般ブロック」の中にある「見出し」を選択すればOKです。

以上がブロックの追加方法で、他のブロックを使う時も同様です。

ブロックの詳細設定

次にブロックの詳細設定です。

具体例として「段落ブロック」の詳細設定で解説します。

ブロックの装飾・デザイン変更

段落ブロックを追加し、テキストを入力すると、

  • ブロックのすぐ上にメニュー
  • 右側にタブ「ブロック」というメニュー

が表示され、詳細設定を行うことが可能です。

「段落ブロック」では以下の詳細設定(文字装飾・デザイン変更)を行うことができます。

  • 太字
  • 斜体
  • 文字サイズ変更
  • 銭湯の文字を大きくする(ドロップキャップ)
  • 色の変更

※ちなみに、この詳細設定の変更できる項目はブロック毎に異なります。

別ブロックへ変換

また、一番左側のメニューボタンで「別のブロック」へ変換が可能です。

ブロックのHTML編集・複製・削除

さらに、一番右側のメニューボタンで「HTML編集・複製・削除など」が可能です。

ブロックを追加・組み合わせていくことでコンテンツ(記事)を作成していきます。

ちなみに、アフィリエイトの記事の書き方については以下の記事で解説していますので、そちらも合わせてどうぞ。

2-3.記事の各種設定

コンテンツの作成が終わったら、記事の各種設定を行います。

記事の各種設定は以下の通りです。

記事の各種設定
  1. パーマリンク設定(URLスラッグ)
  2. カテゴリー
  3. タグの設定
  4. アイキャッチ画像
  5. メタディスクリプション(プラグイン又はWPテーマが必要)

パーマリンク設定(URLスラッグ)

右側ウィンドウのパーマリンク(URLスラッグ)を設定していきます。

パーマリンクとは記事のURLのことです。

基本、パーマリンクは英語表記で記事の内容がわかるように設定します。

例えば、この記事(WordPress Gutenbergの使い方を解説している)は以下のように設定しています。

https://affiliate.24shi-web.com/wordpress-gutenberg-how-to

パーマリンクの付け方に正解はありませんが、英語表記でURLでなんとなく内容がわかるものをつけるように心がけましょう。

ちなみに、パーマリンクが投稿名になっていない方はWordPressの初期設定を行いましょう。

カテゴリー

次はカテゴリーを設定していきます。

右側のウィンドウに追加してあるカテゴリーが表示されますので、作成した記事が該当するカテゴリーを設定します。

ちなみに、1記事に対して1つのカテゴリーを設定するように徹底します。

複数のカテゴリーをチェックすることは可能なのですが、このポンインとは徹底しましょう。

カテゴリーを追加・編集方法についてはバズ部の記事が参考になりますので合わせてどうぞ。

タグの設定

カテゴリーとよく似ているのが「タグ」です。

個人的にはカテゴリーを設定すれば、タグはなくても良いというのが私の考えです。

タグを設定したい方は設定しましょう。

ちなみにタグはカテゴリとは異なり複数個設定してOKです。

アイキャッチ画像

次にアイキャッチ画像の設定です。

アイキャッチ画像の役割は以下の通りです。

アイキャッチ画像
  1. 記事の冒頭で表示される画像
  2. ブログのTOPページの一覧で表示される画像
  3. カードリンクの際に表示される画像

アイキャッチ画像は自作したり、フリー画像サイトからダウンロードして使うなどがおすすめです。

ちなみに、ブログに使えるおすすめのフリー画像サイトは以下の記事で紹介していますので合わせてどうぞ。

メタディスクリプション(プラグイン又はWPテーマが必要)

次にメタディスクリプションの設定です。

メタディスクリプションとは、検索結果に表示されている「記事内容の要約・概要文章」のことです。

メタディスクリプションは、プラグインの「All in One SEO Pack 」かメタディスクリプション編集・追記機能が備わったWordPressテーマを使わないと表示されません。

なので、WordPressテーマにメタディスクリプション追記機能が付いていない場合、プラグイン「All in One SEO Pack」をインストールしましょう。

2-4.記事を公開する

タイトル・コンテンツの作成・記事の各種設定が終わったら、記事を公開していきます。

公開には以下の2種類があります。

記事の公開方法
  1. 今すぐ公開
  2. 予約投稿

今すぐ公開の場合は右上の「公開」を選択すればOKです。

予約投稿をする場合、公開ステータスの「今すぐ」を選択します。

すると、カレンダーが表示されるので「日付」と「時間」を設定し、右上の「予約投稿」を選択すればOKです。

以上がWordPress Gutenbergでの記事作成の流れでした。

3.WordPress Gutenberg の「ブロック」を40個を解説。

次にWordPress Gutenbergで用意されている主要なブロックについて解説していきます。

WordPressの記事の書き方、各種ブロックについてこちらも動画↑で解説していますので、動画で学びたい方はこちらをご覧ください。

され、WordPress Gutenbergのブロックは大きく分けて5つのブロックから構成されています。

Gutenbergの5つのブロック
  1. 一般ブロック
  2. フォーマット
  3. レイアウト要素
  4. ウィジェット
  5. 埋め込み

具体的に一つずつ解説していきます。

3-1.一般ブロック

まずは一般ブロックです。一般ブロックは以下の10個から構成されています。

スクロールできます
①段落文章を入力する時に利用。
②画像画像を挿入する時に利用。
③見出し見出しを入力する時に利用。
④ギャラリー複数の画像を挿入したい時に利用。
⑤リスト箇条書きを入力する時に利用。
⑥引用他のサイトのテキストを引用する時に利用。
⑦音声音声を挿入する時に利用。
⑧カバーテキスト付き画像を挿入したい時に利用。
⑨ファイルファイルのダウンロードリンクを挿入したい時に利用。
⑩動画動画を挿入したい時に利用。

①段落

文章(記事の本文)を入力する際に使用します。ブログ執筆において、最も使用頻度の高いブロックです。

段落の詳細設定

段落ブロックでは以下の詳細設定が可能です。

  • 太字にする
  • 斜体にする
  • 打消し線を追加
  • テキストサイズの変更
  • ドロップキャップ(先頭の文字を大きくする)
  • テキストの色変更
  • インラインコード(codeタグで囲む)
  • インライン画像の追加(段落内に画像を追加)

また、「Shift+Enter」で段落内改行を行うことも可能です。

②画像

記事内に画像を挿入したい時に使用します。

URLから挿入したり、画像ファイルを上記の資格の枠内にドラッグですることでも画像をアップロードすることが可能です。

画像の詳細設定

画像ブロックでは以下の詳細設定が可能です。

  • 画像の形状変更
  • リンクの追加
  • 配置の変更
  • キャプションの追加

また、画像ブロックでは青丸をドラッグすることにより、画像サイズを直感的に変更することができます。

③見出し

見出しを挿入したい時に使用します。

見出しの詳細設定

見出しは以下の詳細設定が可能です。

  • 見出しレベルの変更(h2~h6)
  • 見出しテキストの色変更
  • テキスト配置の変更

ちなみに、見出しは装飾をするのが目的ではなく、ユーザーに対して文章構成をわかりやすく伝えるものと言う認識で使うようにしましょう。

WordPressの見出し(hタグ)の使い方の注意点は以下の記事でお話していますので合わせてどうぞ。

④ギャラリー

複数の画像を一覧で挿入したい時に使用します。

ギャラリーの詳細設定

ギャラリーは以下の詳細設定が可能です。

  • カラム変更
  • 画像の切り抜き設定
  • リンクの追加
  • ギャラリーの配置設定
  • キャプションの追加

⑤リスト

箇条書き・番号付き箇条書きをしたい時に使用します。

リストの詳細設定

リストは以下の詳細設定が可能です。

  • 箇条書き・番号振りの変更
  • リスト項目のインデント

また、テキストについては「段落ブロック」同じ変更が可能です。

⑥引用

他のサイトからテキスト・文章を引用したい時に使用します。

引用の詳細設定

引用ブロックは以下の詳細設定が可能です。

  • 引用ボックスのスタイル変更
  • 引用ボックス内のテキスト配置変更
  • 引用先リンク挿入可能(citeタグで囲まれる)

テキストについては「段落ブロック」と同じ変更が可能です。

⑦音声

音声ファイルを挿入したい時に使用します。

音声の詳細設定

音声ブロックは以下の詳細設定が可能です。

  • 自動再生設定
  • 繰り替えし再生設定
  • 音声ファイルの配置変更

⑧カバー

カバーを使う事で、画像の上にテキストを追加することが可能です。

カバーの詳細設定

カバーは以下の詳細設定が可能です。

  • 画像の焦点位置の変更
  • カバー画像のサイズ変更
  • オーバーレイの色変更
  • オーバーレイの透過率変更
  • カバーテキストの文字サイズ変更
  • ドロップキャップ(先頭文字を大きく表示)
  • カバーテキストの色変更
  • カバーテキストの背景変更

⑨ファイル

ファイルのダウンロードリンクを挿入したい時に使用します。

ファイルの詳細設定

ファイルブロックは以下の詳細設定が可能です。

  • ファイル名の追記
  • ダウンロードボタンの表示設定

⑩動画

動画ファイルを挿入したい時に使用します。

動画ファイルの詳細設定

動画ファイルは以下の詳細設定が可能です。

  • 自動再生の設定
  • 繰り返し再生の設定
  • ミュートの設定
  • プレイバックコントロールの設定
  • インラインで再生
  • ポスター画像の設定(動画のアイキャッチ)

3-2.フォーマット

次にフォーマットブロックです。フォーマットブロックは7つです。

スクロールできます
⑪ソースコードHTMLコードを表示させたい時に利用。
⑫クラシック旧エディタでテキストを入力する時に利用
⑬カスタムHTMLHTMLコードで直接入力したい時に利用。
⑭整形済み改行・スペースなどを含めた表現をしたい時に利用。
⑮プルクオート引用をより強調させたい時に利用。
⑯表表を挿入したい時に利用。
⑰詩改行・スペースなどを含めた表現をしたい時に利用。

⑪ソースコード

ソースコードを入力したい時に使用します。

<pre>タグの中に<code>で囲まれるテキストとなり、HTMLコードを記事上にそのまま表示することが可能です。

ちなみに、ソースコードでの詳細設定はありません。

⑫クラシック

旧エディターを使ってテキストを執筆したい時に使用します。

Gutenbergは現状「表ブロック」がまだ旧エディターよりも使い勝手が悪いです。

なので、複雑な「表」を挿入したい時やプラグイン「AddQuicktag」を使用したい時に使えるブロックです。

⑬カスタムHTML

HTMLコードを直接入力したい時に使用します。

また、「プレビュー表示」があるのでHTMLコードをWEB表示で確認することが可能です。

インプレッションタグ込みでアフィリリンクを挿入する際などに使います。

⑭整形済み

改行やスペースを含めたテキストを入力したい時に使用します。

ちなみに、<pre>タグで囲まれたテキストとなります。

⑮プルクオート

強調した引用を挿入したい時に使用します。

<blockquote> タグで囲まれたテキストのため、引用ブロックと意味合いは同じです。

プルクオートは引用と似ていますが、より目を引くデザインになっています。

ja.support.wordpress.com

WordPress公式サポートでは上記のように言われていますので、引用をより目立たせたい、強調させたい場合にプルクオートを使えばOKです。

プルクオートの詳細設定

プルクオートは以下の詳細設定が可能です。

  • プルクオートのスタイル変更
  • プルクオートの背景色の変更
  • プルクオートの文字色の変更

⑯表

表・テーブルを挿入したい時に使用します。

表ブロックの詳細設定

表ブロックは以下の詳細設定が可能です。

  • 「行・列」の追加・削除
  • セル内のテキスト配置変更
  • 表のスタイル変更
  • 列の幅を均一に揃える設定
  • ヘッダーセクション設定
  • フッターセクション設定
  • セルの背景色変更

⑰詩

詩を書きたい時に使用します。

詩ブロック」はサイトでの詩の作成に最適です。

ja.support.wordpress.com

WordPress公式サポートには上記のように書かれています。

<pre>タグで囲まれているブロックのため、「整形テキスト」とほぼ同じ役割です。

恐らく「詩ブロック」は使用する機会がほとんどないと思います。

3-3.レイアウト要素

次に「レイアウト要素」です。レイアウト要素ブロックは8つから構成されています。

スクロールできます
⑱ボタンボタンリンクを挿入したい時に利用。
⑲カラム段組レイアウト(2・3段)にしたい時に利用。
⑳グループ複数のブロックをグループ化したい時に利用。
㉑メディアと文章画像とテキストを2段組で表現したい時に利用。
㉒続きを読むアーカイブに表示するテキストを設定する時に利用。
㉓改ページ記事を複数ページに分ける時に利用。
㉔区切り区切り線を挿入する時に利用。
㉕スペーサー余白を挿入する時に利用。

⑱ボタン

ボタンリンクを挿入したい時に使用します。

ボタンリンクの詳細設定

ボタンリンクは以下の詳細設定が可能です。

  • ボタンのデザイン変更
  • ボタンの背景色変更
  • ボタン内のテキスト色変更
  • ボタン枠の丸み変更
  • 新しいタブで開く(target=”_blank”)
  • リンクrel属性の設定

⑲カラム

2段組み・3段組みと言ったカラムレイアウトを挿入したい時に使用します。

カラムの詳細設定

カラムブロックは以下の詳細設定が可能です。

  • 段組レイアウトデザインの選択
  • カラムの幅サイズの指定・変更
  • カラム挿入コンテンツの縦位置の変更

⑳グループ

複数のブロックを一つのグループ化するのに使用します。

グループの詳細設定

グループブロックは以下の詳細設定が可能です。

  • グループ内に背景色設定する

グループは挿入するというよりも、複数のブロックをドラックで選択し、「詳細設定→グループ化」の手順で使うのが効率的です。

㉑メディアと文章

メディアと文章を横並びで挿入したい時に使用します。

メディアと文章の詳細設定

メディアと文章ブロックは以下の詳細設定が可能です。

  • 文章とメディアの配置の左右入替
  • コンテンツの縦位置変更
  • モバイルでの横並びの設定変更

「カラムブロック」でもメディアと文章の2段組みが可能ですが、「カラム」を使用した場合、スマホで見た時は縦並びに最適化されてしまいます。

スマホ表示でメディアと文章を横並びに表示したい場合は「メディアと文章ブロック」を使いましょう。

㉒続きを読む

トップページのアーカイブ(記事一覧)の抜粋文章を設定したい時に使用します。

ちなみに、WordPressテーマでアーカイブ上で抜粋分を表示しないデザインの物には関係のないブロックです。

㉓改ページ

1つの記事を複数ページに分けたい時に使います。

改ページブロックを追加した後に追加したテキストが次のページとなります。

㉔区切り

区切り線を挿入したい時に使用します。

区切り線の詳細設定

区切り線は以下の詳細設定が可能です。

  • 区切り線のデザイン変更
  • 区切り線の色変更

㉕スペーサー

余白や改行を空けたい時に使用します。

スペーサーの詳細設定

スペーサーは以下の詳細設定が可能です。

  • 余白高さの変更

青色のドットをドラッグすることで余白高さを変更することが可能です。

1行程度の余白を空けたいのであれば「20px」でOKです。

3-4.ウィジェット

次にウィジェットブロックです。ウィジェットブロックは9つから構成されています。

ただ正直、ウィジェットブロックは「ショートコード」以外の使用頻度が低いため、設定で非表示にしても良いです。

スクロールできます
㉖ショートコードショートコードを入力したい時に利用。
㉗アーカイブ月別アーカイブを記事内に挿入したい時に利用。
㉘カレンダーカレンダーを記事内に挿入したい時に利用。
㉙カテゴリーカテゴリー一覧を記事内に挿入したい時に利用。
㉚最新のコメント最新のコメントを挿入したい時に利用。
㉛最新の記事最新の記事一覧を挿入したい時に利用。
㉜RSSRSSフィードを挿入したい時に利用。
㉝検索サイト内検索窓を挿入したい時に利用。
㉞タグクラウドタグ一覧を記事内に挿入したい時に利用。

㉖ショートコード

ショートコードを入力したい時に使用します。

ただし、使用しているWordPressテーマにショートコードが設定されていないと使えません。

例えば、私が使っているWPテーマ「SANGO」などはテーマ固有のショートコードが設定されているので、そういった場合にこちらのショートコードブロックを使います。

㉗アーカイブ

月別アーカイブを設定したい場合に使用します。

アーカイブの詳細設定

アーカイブは以下の詳細設定が可能です。

  • ドロップダウンに変更
  • 投稿数を表示

㉘カレンダー

カレンダーを挿入したい時に設定します。

日付をクリックすることで、その日にアップされた記事一覧が表示されます。

㉙カテゴリー

カテゴリーを記事内に挿入したい時に使用します。

カテゴリーの詳細設定

カテゴリーは以下の詳細設定が可能です。

  • ドロップダウンでの表示変更
  • 階層を表示変更
  • 投稿数の表示変更

㉚最新のコメント

最新コメントを記事内に挿入したい時に使用します。

コメントを許可していない方には関係のないブロックです。

最新コメントの詳細設定

最新コメントは以下の詳細設定が可能です。

  • アバターの表示変更
  • 日付の表示変更
  • 抜粋の表示変更
  • 表示するコメント数の変更

㉛最新の記事

最新の記事へのリンクを記事に内に挿入したい時に使用します。

最新の記事

最新の記事は以下の詳細設定が可能です。

  • リスト表示・グリッド表示変更
  • 投稿コンテンツ内容の表示変更
  • 投稿日の表示変更
  • 表示の並び順変更
  • カテゴリーで絞り表示
  • 最新記事の表示数の変更

㉜RSS

自サイト・他サイトのRSSフィードを表示させたい時に使用します。

RSSの詳細設定

RSSブロックは以下の詳細設定が可能です。

  • リスト表示・グリッド表示の変更
  • 投稿者の表示変更
  • 日付の表示変更
  • 抜粋の表示変更
  • RSSの表示数の変更

㉝検索

サイト内検索窓を記事内に挿入したい時に使用します。

㉞タグクラウド

タグ一覧を記事内に表示したい時に使用します。

タグクラウドの詳細設定

タグクラウドは以下の詳細設定が可能です。

  • カテゴリ一覧にも変更可能
  • タグ・カテゴリの投稿数の表示変更

3-5.埋め込み

最後に埋め込みブロックです。埋め込みブロックは様々なプラットホーム用が用意されていますが、特に使用頻度が高い以下の6つについて解説していきます。

スクロールできます
㉟埋め込み他媒体の投稿・画像・動画を埋め込みたい時に利用。
㊱TwitterTwitterを埋め込む時に利用。
㊲YouTubeYouTubeを埋め込む時に利用。
㊳FacebookFacebookを埋め込む時に利用。
㊴InstagramInstagramを埋め込む時に利用。
㊵WordPressカードリンクを埋め込む時に利用。

㉟埋め込み

他媒体・プラットホームの画像・動画・投稿を挿入したい時に使用します。

こちらの「埋め込みブロック」を使えば自動的にTwitter・YouTube・Instagram用に変換してくれます。

なので、基本的にはこれでOKです。

㊱Twitter

Twitterの投稿を記事内に挿入したい時に使用します。

Twitterの投稿のリンクは以下からコピー可能です。

㊲YouTube

YouTubeを投稿に挿入したい時に使用します。

YouTubeは動画のURLを入力すればOKです。

㊳Facebook

Facebookの投稿を記事内に挿入したい時に使用します。

ちなみに、Facebookの投稿リンクは以下からコピー可能です。

㊴Instagram

Instagramの投稿を記事内に挿入したい時に使用します。

ちなみ、Instagramの投稿リンクは以下からコピーが可能です。

㊵WordPress

カード型の内部リンクを挿入したい時に使用します。

カードリンクを設置したいページのURLを入力すればOKです。

【補足】初心者はWordPress Gutenbergの7つのブロックだけ覚えればOK!

はじめ

ブロックが多すぎて迷っちゃうよ…。

もしこのように思ったWordPress初心者の方は以下の7つだけ覚えれば、ブログ記事を書くには困りませんよ。

ブログ執筆に最低限必要なブロック
  1. 段落ブロック
  2. 見出しブロック
  3. 画像ブロック
  4. リストブロック
  5. スペーサー
  6. 引用ブロック
  7. 埋め込みブロック

上記の7つさえ覚えれば、初心者の方が記事を書く上では全く困りませんので、まずはこの7つのブロックの使い方を覚えて記事を書いてみてください。

詳しくは記事「WordPress Gutenbergの初心者のための使い方で覚えることは7つだけでOK!」で詳しくお話していますので合わせてどうぞ。

4.【応用】WordPress Gutenbergの作業効率化

はじめ

WordPress Gutenbergの使い方は理解したんだけど、どうも使いづらいと感じるんだよね。
マウスでいちいちブロックを選択するのが手間かかるな…。

恐らくWordPress Gutenbergを使っていると上記のように感じている方も多いはず。

そんな方は以下の2つの使い方を覚えることでよりWordPress Gutenbergを効率的に使う事ができますよ

WordPress Gutenbergの効率化
  1. 再利用ブロックを活用する
  2. Markdown記法をマスターする

4-1.再利用ブロック

まずはWordPress Gutenbergの再利用ブロックの活用です。

再利用ブロックとは何かというと、

「自分がよく使うブロック(テキストや画像、その他フォーマット)を登録することができ、一発で呼び出すことが可能なブロック」です。

例えば私の場合、以下のフォーマットを再利用ブロックに登録しています。

再利用ブロックの具体例
  1. タイトル付のBOX
  2. 吹き出しBOX
  3. 関連記事のショートコード

私の記事を読んでいただいている方は分かると思いますが、上記の3つの使用頻度が高いので再利用ブロックに登録し、一発呼び出しすることで記事執筆を効率化することが可能です。

WordPress Gutenbergでの再利用ブロックの使い方については以下の記事で詳しく解説していますので参考にしてみてください。

4-2.Markdown記法

次にMarkdown記法をマスターすることで、記事執筆スピードはWordPress Gutenbergでの記事執筆スピードは格段に向上します。

ちなみに、Markdown記法とは、

Markdown(マークダウン)は、文書を記述するための軽量マークアップ言語のひとつである。

本来はプレーンテキスト形式で手軽に書いた文書からHTMLを生成するために開発されたものである。

ja.wikipedia.org/wiki/Markdown

つまり、簡単にいうと簡単なコードを入力することでWordPress Gutenbergの各ブロックに変換したり、呼び出したりが可能になるという事です。

Markdown記法を使うと使わないでは格段に記事執筆スピードが変わると個人的には感じています。

なのぜ、是非Markdown記法を使って記事を執筆することをおすすめします。

ちなみに、WordPress GutenbergでのMarkdown記法の使い方については以下の記事で詳しくお話していますので、合わせてどうぞ。

5.WordPressのよくある疑問

最後にWordpresのよくある質問について解説していきます。

5-1.WordPressのプラグインって何?

はじめ

WordPressのプラグインって何?
ブログ運営におすすめなプラグインがあれば教えて欲しい。

プラグインとは、WordPressに機能を追加するソフトのようなものと理解しておけばOKです。

WordPressは便利なエディターですが、WordPressだけではできることも限られているのが事実です。

そんな時にプラグインをインストールし、WordPressに機能を追加していきます。

WordPress歴3年の私がおすすめするプラグインは以下の記事で解説していますので合わせてどうぞ。

5-2. おすすめのWordPressテーマはどれ?

はじめ

これからWordPressでブログを運営していくんだけど、おすすめのテンプレート(テーマ)はどれ?

私がおすすめするWordPressテーマは以下の6つです。

おすすめのWordPressテーマ6選
  1. SWELL(有料)
  2. SANGO(有料)
  3. OPENCAGE(有料)
  4. JIN(有料)
  5. 賢威(有料)
  6. Cocoon(無料)

ちなみに私が使用しているWordPressテンプレートは「SWELL」です。

そして、無料のテーマが良いのであれば間違いなく「Cocoon」が最強だと感じています。

おすすめのWordPressテーマについては以下の記事で詳しく解説していますので、参考にしてみてください。

5-3. Gutenbergのデフォルトブロックが「クラシック」になってる時の対処法

はじめ

WordPress Gutenbergで「Enter」を押して改行したら、「段落ブロック」ではなく「クラシック」がデフォルトになっているんだけど…

その原因はプラグイン「TinyMCE Advanced」の設定にあります。

具体的には以下の設定にチェックが入っているとこの現象が起きます。

設定確認箇所
  • 高度なオプション内にある
  • Make the Classic Paragraph or Classic block the default block (hybrid mode)

上記のチェックボックスにチェックが入っていると、「Classic Paragraph」がデフォルトブロックとなってしまいますので、チェックを外しましょう。

5-4.クラシックエディターに戻すには?

はじめ

WordPress Gutenbergがどうしても使いづらいから旧エディターに戻したいんだけど。

このように悩んでいる場合は、プラグイン「Classic Editor」をインストールしましょう。

ただし、Classic Editorは2022年までのサポートと言われているので今のうちにWordPress Gutenbergに慣れておくのがおすすめです。

まとめ

今回はWordPress Gutenbergの使い方を解説してきました。

WordPress Gutenbergは使い方を覚えれば、誰でも簡単にブログ運営が可能になります。

ちなみに、私がWordPressを使い始めた2017年頃は「マジで使いづらい。」と感じていましたが、今では最高に使いやすいエディターだと感じています。

是非、これからブログ運営・アフィリエイトに取り掛かる方はWordPress Gutenbergの使い方をマスターしましょう。

また、収益を目的としたブログ運営を行うのであれば「アフィリエイトのジャンル選び」も合わせて参考にしていただければと思います。

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
この記事の内容
閉じる