WordPressで美しいコンテンツを作成することは、圧倒される必要はありません。
ブロックエディター（Gutenbergとしても知られています）は、ブロックを配置するだけで、技術的なスキルを必要とせずに、ページや投稿の作成を簡単にするために特別に設計されました。
デジタルレゴブロックで組み立てるようなものだと考えてください。テキスト、画像、ボタンなど、コンテンツの各ピースはブロックになり、簡単に移動したりカスタマイズしたりできます。
私たちは早い段階でGutenbergに切り替え、長年使用してきました。これにより、何千ものWPBeginnerユーザーがこのシステムをマスターできるよう支援してきました。
このチュートリアルでは、WordPressのブロックエディターがどのように機能するかを正確にご紹介します。
コーディングの知識なしに、コンテンツ作成をより速く、より楽しくするための簡単なテクニックを学び、ウェブサイトに洗練された外観を与える機能を発見できます。
注意：この記事では、投稿やページの編集用に設計されたブロックエディターの使用について説明しています。ブロックを使用してウェブサイト全体を編集する方法を知りたい場合は、WordPressフルサイト編集の完全ガイドを参照してください。
ブロックエディター（Gutenberg）とクラシックエディターの違いは何ですか？
ブロックエディタに入る前に、Gutenbergブロックエディタと古いクラシックエディタの違いを比較して理解しましょう。
WordPressのクラシックエディターは次のようでした：
いくつかの基本的な書式設定オプションを備えたテキストエディターボックスがありました。機能と視覚的な外観はかなり限定されていました。
WordPressにおけるブロックエディターの外観は以下の通りです:
ご覧のとおり、これらはWordPressでコンテンツを作成するための全く異なる2つのエディターです。
古いクラシックエディターは、Microsoft Wordに似たフォーマットボタンを備えたテキストエディターでした。
新しいエディターは「ブロック」（したがって、ブロックエディターという名前）と呼ばれる異なるアプローチを使用しています。
ブロックは、レイアウトを作成するために編集画面に追加できるコンテンツ要素です。投稿やページに追加する各項目はブロックです。
例えば、段落、画像、動画、ギャラリー、音声、リストなどのブロックを追加できます。一般的なコンテンツ要素のブロックはすべて用意されており、WordPressプラグインでさらに追加することも可能です。
WordPressブロックエディターはクラシックエディターより優れているのはなぜですか？
WordPressのブロックエディターは、投稿やページにさまざまな種類のコンテンツを追加するための簡単な方法を提供します。
例えば、以前はクラシックエディターを使用してコンテンツにテーブルを追加したい場合、個別のテーブルプラグインが必要でした。
ブロックエディタを使用すると、テーブルブロックを簡単に追加し、列と行を選択してコンテンツの追加を開始できます。
コンテンツ要素を上下に移動したり、個別のブロックとして編集したり、メディアリッチなコンテンツを簡単に作成したりできます。
最も重要なのは、WordPressブロックエディターは使いやすく学習しやすいということです。
これは、最初のブログを始めたばかりのWordPress初心者や、DIYのビジネスウェブサイトを構築しているすべての人に計り知れない利点をもたらします。
それでは、WordPressのブロックエディターを使用して、プロのように素晴らしいコンテンツを作成する方法を見ていきましょう。
このGutenbergチュートリアルでは、以下の内容を扱います:
- Gutenberg – WordPressブロックエディターの使用
- ブロックエディターを使用した新しいブログ投稿またはページの作成
- ブロックエディターにブロックを追加する方法
- 新しいエディターでブロックを操作する
- ブロックのグループ化と列
- 同期パターン（再利用可能なブロック）を使用してコンテンツを保存および再利用する
- Gutenbergブロックエディターでの公開と管理オプション
- Gutenbergのプラグイン設定
- ブロックエディターで一般的なブロックを追加する
- ブロックエディターで他のコンテンツブロックを探る
- Gutenbergをプロのように使用するためのボーナスのヒント
- WordPressのGutenbergブロックエディタにブロックを追加する方法
- Gutenbergに関するFAQ – WordPressのブロックエディター
- 動画チュートリアル
- ボーナスリソース
準備はいいですか？始めましょう。
Gutenberg – WordPressブロックエディターの使用
ブロックエディターは直感的で柔軟になるように設計されています。古いWordPressエディターとは見た目が異なりますが、クラシックエディターでできたことはすべて実行できます。
まず、クラシックエディターで行っていた基本的なことと、ブロックエディターでそれらがどのように行われるかをカバーすることから始めましょう。
ブロックエディターを使用した新しいブログ投稿またはページの作成
新しいブログ投稿またはページは、通常どおり作成を開始します。WordPress管理画面で、投稿 » 新規追加メニューをクリックするだけです。
ページを作成する場合は、代わりにページ » 新規追加メニューに移動してください。
これにより、ブロックエディターが起動します。
ブロックエディターにブロックを追加する方法
すべての投稿またはページの最初のブロックはタイトルです。
タイトルの下にマウスを移動するか、キーボードのTabキーを押してカーソルを下に進め、書き込みを開始できます。
デフォルトでは、次のブロックは段落ブロックです。これにより、ユーザーはすぐに書き始めることができます。
ただし、何か別のものを追加したい場合は、エディターの左上隅にある追加ブロックボタン[+]をクリックするか、既存のブロックの下、またはブロックの右側にクリックします。
ボタンをクリックすると、上部に検索バー、下部によく使われるブロックが表示される「ブロック追加」メニューが表示されます。
タブをクリックしてブロックカテゴリを閲覧したり、キーワードを入力して特定のブロックをすばやく検索したりできます。
ボタンをクリックするためにマウスを使いたくない場合は、キーボードショートカットを使用することもできます。
まず、/を入力してブロックを検索し、キーボードのEnterキーを押して挿入します。
新しいエディターでブロックを操作する
各ブロックの上部にはツールバーが表示されます。ツールバーのボタンは、編集中のブロックによって異なります。
たとえば、以下のスクリーンショットでは、テキストの配置、太字、斜体、リンクの挿入などの基本的な書式設定ボタンが表示され、3点メニューからさらにオプションが利用できる段落ブロックを扱っています。
ツールバーに加えて、各ブロックには独自のブロック設定があり、編集画面の右側の列に表示されます。
これらの設定は、編集しているブロックによって異なります。たとえば、段落ブロックでは、テキスト、背景、リンクの色、およびタイポグラフィを編集できます。
ブロックを上下に移動して並べ替えることができます。
これを行いたい場合は、ドラッグアンドドロップをクリックするか、ブロックツールバーの上下ボタンをクリックしてください。
関連: WordPressでブロックを削除する方法に関するガイドをご覧ください。
ブロックのグループ化と列
ブロックエディターには、コンテンツレイアウトを管理および整理するための便利なツールも付属しています。
キーボードのShiftキーを押しながらクリックすると、複数のブロックを選択できます。
その後、ツールバーのブロックタイプボタンをクリックして、選択したブロックをグループまたはカラムに変換します。
その後、配置や間隔の変更など、スタイルをグループブロック全体に適用できます。
ブロックエディターでは、空のグループブロックまたはカラムブロックを追加することもできます。
その後、他のブロックで埋めることができます。
必要に応じて、各列に任意の種類のブロックを追加できます。
これにより、さまざまなユースケースに対応する美しいレイアウトを作成できます。
同期パターン（再利用可能なブロック）を使用してコンテンツを保存および再利用する
ブロックエディターの最も強力な機能の1つは、サイト全体でコンテンツを保存して再利用できることです。これは、以前はリユーザブルブロックとして知られていた同期パターンを使用して行われます。
同期パターンとは、複数の投稿やページで使用できるブロック、またはブロックのグループです。
最も良い点は、パターンを編集すると、使用したすべての場所で自動的に更新されることです。これは、行動喚起ボックス、著者プロフィール、連絡先情報など、一貫性を保つ必要があるコンテンツに最適です。
保存したいブロックを選択するだけです。次に、ブロックツールバーの3点ドットメニューアイコンをクリックし、「パターンを作成」オプションを選択します。
ポップアップウィンドウが表示されます。ここで、パターンに名前を付け、整理のためにカテゴリに割り当てることができます。
最も重要なのは、「同期済み」オプションがオンになっていることを確認することです。 これにより、パターンが一度にすべて更新されます。
注意💡: グループ全体やカラム全体を再利用可能なブロックとして使用することもできます。これにより、セクション全体を保存して、必要に応じていつでも使用できます。
「作成」をクリックすると、新しい同期パターンが保存されます。
他の投稿やページで使用するには、ブロックインサーター（+）ボタンをクリックして「パターン」タブの下で検索するか、名前で検索するだけです。
パターンを使用すると、サイトオーナーは、行動喚起、ソーシャルメディアボタン、バナーなどの一般的に使用される要素をレイアウトに簡単に追加できます。
WordPressテーマやプラグインには独自のパターンが含まれている場合もありますし、WordPressのブロックパターンライブラリで他の人が作成したパターンを見つけることもできます。
さらにヘルプが必要な場合は、WordPressブロックパターンの見つけ方と使い方に関する初心者向けガイドで、別のガイドを用意しています。WordPressブロックパターンの見つけ方と使い方。
Gutenbergブロックエディターでの公開と管理オプション
WordPressの各投稿には、多くのメタデータが含まれています。これには、公開日、カテゴリとタグ、アイキャッチ画像などの情報が含まれます。
これらのオプションはすべて、エディター画面の右側の列にきれいに配置されています。
Gutenbergのプラグインオプション
WordPressプラグインは、ブロックエディターのAPIを利用して、編集画面内に設定を統合できます。
一部の人気のプラグインには、独自のブロックが付属しています。
例えば、最高のWordPress問い合わせフォームプラグインであるWPFormsでは、ブロックを使用してコンテンツにフォームを追加できます。
他のWordPressプラグインも、ブロックエディター画面に設定を追加する場合があります。
例えば、WordPress用オールインワンSEOでブロックエディタの下部にあるSEO設定を編集する方法は次のとおりです。
同様に、WooCommerceを使用してオンラインストアを運営している場合、それ自体にも独自のブロックがあることに気づくでしょう。
これらのブロックを使用すると、WordPressの投稿やページに商品を簡単に追加できます。
ブロックエディターで一般的なブロックを追加する
ブロックエディターは、古いクラシックエディターができたことはすべてできます。
ただし、以前よりも迅速かつエレガントに作業できるようになります。さらに、多くのノーコードオプションでコンテンツをスタイル設定できるなど、さらに多くのことができます。
ここで利用できる一般的なブロックをいくつかご紹介します。
1. WordPressブロックエディターに画像を追加する
WordPressブロックエディターには、すぐに使用できる画像ブロックがあります。ブロックを追加してから、画像ファイルをアップロードするか、メディアライブラリから選択するだけです。
コンピューターから画像をドラッグアンドドロップすることもできます。エディターが自動的に画像ブロックを作成します。
画像を追加すると、ブロック設定が表示され、画像のaltテキスト、画像解像度サイズ、画像へのリンク追加などのメタデータを追加できるようになります。
詳細については、WordPressで画像を正しく追加する方法に関するチュートリアルをご覧ください。WordPressで画像を正しく追加する方法。
2. ブロックエディターでリンクを追加する
ブロックエディターには、テキストを追加できるいくつかのブロックが用意されています。最も一般的に使用されるのは段落ブロックで、ツールバーにリンク挿入ボタンがあります。
その他、一般的に使用されるテキストブロックにも、ツールバーにリンクボタンがあります。
キーボードショートカットを使用してリンクを挿入することもできます。Macの場合はCommand + K、Windowsコンピューターの場合はCTRL + Kです。
3. Gutenbergで画像ギャラリーを追加する
ギャラリーブロックは画像ブロックのように機能します。追加してから画像ファイルをアップロードまたは選択します。
詳細については、WordPressで画像ギャラリーを作成する方法に関するガイドをご覧ください。
4. Gutenbergを使用してWordPress投稿にショートコードを追加する
すべてのショートコードは、クラシックエディターで機能したのと同じように機能します。段落ブロックに追加するか、ショートコードブロックを使用できます。
ブロックエディターで他のコンテンツブロックを探る
Gutenbergエディターは、新しいブロックを導入することで、WordPressにおける長年のユーザビリティの問題を解決することを約束しました。
以下は、ユーザーが非常に役立つと感じるであろうお気に入りのいくつかです。
1. WordPressでテキストの横に画像を追加する方法
以前のエディターでは、テキストの横に画像を配置できなかったユーザーが多くいました。メディア＆テキストブロックを使用すると、それが可能になります。
このシンプルなブロックは、2つのブロックが横並びに配置されており、テキストの横に簡単に画像を追加できます。
2. WordPressの投稿とページにボタンを追加する
旧エディターのもう一つの煩わしさとして、ブログ投稿やページにボタンを追加することがありました。ボタンのショートコードを作成するプラグインを使用するか、HTMLモードに切り替えてコードを記述する必要がありました。
幸いなことに、Gutenbergにはボタンブロックがあり、任意の投稿やページにボタンをすばやく追加できます。
ボタンにリンクを追加したり、色を変更したりできます。詳細については、WordPressにコールトゥアクションボタンを簡単に追加する方法に関する記事をご覧ください。
3.ブログ投稿やランディングページに美しいカバー画像を追加する
試してみたいもう1つのクールな機能は、カバーブロックです。これにより、投稿やページにカバー画像やカラー背景カバーを追加できます。
カバー画像は、ページ上の新しいセクションやストーリーの始まりによく使用される、より幅の広い画像です。美しく、魅力的なコンテンツレイアウトを作成できます。
カバーブロックを追加して、使用したい画像をアップロードするだけです。カバーのオーバーレイカラーを選択したり、固定の背景画像にしたりして、ユーザーがページをスクロールしたときにパララックス効果を作成できます。
詳細については、WordPressのカバー画像とアイキャッチ画像の違いに関する記事をご覧ください。
4. 記事内にテーブルを作成する
クラシックエディターには、WordPressの投稿にテーブルを追加するボタンがありませんでした。プラグインを使用するか、カスタムCSSとHTMLを記述してテーブルを作成する必要がありました。
現在、ブロックエディターにはデフォルトのテーブルブロックが搭載されており、投稿やページにテーブルを追加するのが非常に簡単になりました。ブロックを追加して、挿入したい列数と行数を選択するだけです。
これで、テーブル行にデータを追加できるようになりました。必要に応じていつでも行や列を追加でき、2つの基本的なスタイルオプションが利用可能です。
5. 複数列のコンテンツを作成する
複数列のコンテンツ作成は、クラシックエディターでは全く対応できなかった別の問題でした。
幸いなことに、ブロックエディターでは、2つの段落ブロックの列を追加する列ブロックを追加できます。
このカラムブロックは非常に柔軟です。1行に最大6つのカラムを追加でき、各カラム内に他のブロックを使用することもできます。
Gutenbergをプロのように使用するためのボーナスのヒント
ブロックエディターを見ると、実際のコンテンツを作成するよりもブロックの追加や調整に時間を費やすのではないかと疑問に思うかもしれません。
ブロックエディターは非常に高速で、数分間の基本的な使用でも、考えずにすぐにブロックを追加できるようになります。
このアプローチでワークフローがどれほど速くなるか、すぐに実感できるでしょう。
WordPressブロックエディターをさらに速く使うための、パワーユーザー向けの追加ヒントをいくつかご紹介します。
1. ブロックツールバーを上部に移動
上記のスクリーンショットで、すべてのブロックの上部にツールバーが表示されていることに気づいたかもしれません。このツールバーをエディターの上部に移動できます。
「トップツールバー」オプションにアクセスするには、画面右上にある3つの点のボタンをクリックしてください。
2. キーボードショートカットを使用する
Gutenbergには、ワークフローをさらに迅速かつ簡単にできる便利なショートカットがいくつか付属しています。すぐに使い始めるべき最初のものは / です。
/を入力し、入力を開始すると、エディターが一致するブロックを表示し、すぐに挿入できます。
その他のショートカットについては、画面右上にある3点メニューをクリックし、「キーボードショートカット」を選択してください。
これにより、使用できるすべてのキーボードショートカットのリストが表示されるポップアップが表示されます。リストには、WindowsユーザーとMacユーザーで異なるショートカットが表示されます。
3. メディアをドラッグアンドドロップしてメディアブロックを自動作成
Gutenbergを使用すると、ファイルを画面上のどこにでもドラッグアンドドロップでき、自動的にブロックが作成されます。
例えば、単一の画像またはビデオファイルをドロップすると、ブロックが自動的に作成されます。または、複数の画像ファイルをドロップしてギャラリーブロックを作成することもできます。
4. YouTube、Twitter、Vimeo、その他の埋め込みコンテンツの追加
ブロックエディターを使用すると、サードパーティのコンテンツをWordPressコンテンツに簡単に埋め込むことができます。すべての一般的なサードパーティサービス用のブロックがあります。
ただし、埋め込みURLをいつでもコピー＆ペーストすれば、自動的にブロックが作成されます。
例えば、YouTube動画のURLを追加すると、自動的にYouTube埋め込みブロックが作成され、動画が表示されます。
URLを直接貼り付けても、FacebookやInstagramの投稿では機能しませんが、回避策は簡単です。
Smash Balloon Social Photo Feed を使用して「oEmbeds」機能を有効にし、URL を「埋め込み」ブロックに貼り付けるだけです。
詳細については、WordPressでFacebookおよびInstagramの投稿を埋め込む方法に関する記事をご覧ください。WordPressでFacebookおよびInstagramの投稿を埋め込む方法。
WordPressのGutenbergブロックエディタにブロックを追加する方法
WordPressのブロックエディターにより、開発者は独自のブロックを作成できます。優れたWordPressプラグインの中には、新しいエディター用のブロックバンドルを提供しているものもあります。
いくつかご紹介します。
1. Spectra WordPress Gutenberg Blocks
Spectra WordPress Gutenberg Blocksは、コンテンツにさらに多くのデザイン要素を追加するのに役立つ多くの高度なブロックを備えたブロックライブラリです。
人気のAstra WordPressテーマの開発者が作成したSpectraは、コードを書かずに美しいデザインを作成するのに役立ちます。
詳細については、当社の完全なSpectraレビューをご覧ください。
PublishPress Blocksは、Gutenbergブロックエディターを拡張するための追加ブロックを備えた、もう1つの強力なブロックライブラリです。
美しいレイアウトオプション、スライダー、ボタン、アイコン、画像ギャラリー、マップ、タブ、お客様の声、アコーディオンなどが含まれています。
Stackable – Gutenberg Blocks は、ウェブサイトで使用できる美しくデザインされたGutenbergブロックのコレクションです。コンテナ、投稿、フィーチャーグリッド、アコーディオン、画像ボックス、アイコンリスト、コールトゥアクションなどのブロックが含まれています。
その他のオプションについては、WordPress Gutenbergブロックプラグインのベストの完全なリストをご覧ください。
Gutenbergに関するFAQ – WordPressのブロックエディター
GutenbergがデフォルトのWordPressエディターになって以来、その使い方について多くの質問を受けています。ここでは、ブロックエディターに関する最もよくある質問とその回答をご紹介します。
1. ブロックエディターでの古い投稿やページはどうなりますか？まだ編集できますか？
ブロックエディターは、古い投稿やページには影響しません。それらを編集することは引き続き可能で、ブロックエディターはそれらをクラシックエディターを含むブロックとして自動的に開きます。
古いエディター内で編集することも、古い記事をブロックに変換してブロックエディターを使用することもできます。
2.古いエディターを使い続けることはできますか？
はい、古いエディターを引き続き使用できます。Classic Editor プラグインをインストールして有効化するだけです。
有効化すると、ブロックエディターが無効になり、クラシックエディターを引き続き使用できるようになります。
Classic Editorプラグインは、当面の間公式にサポートされます。しかし、WordPressでコンテンツを作成する最新の方法に慣れるために、今すぐブロックエディターの使用を開始することを強くお勧めします。
7. 使用中のプラグインやテーマでブロックエディターが機能しない場合はどうすればよいですか？
Project Gutenbergは開発に長い時間がかかったため、プラグインやテーマの作成者はコードの互換性テストに十分な時間をかけることができました。
ただし、一部のプラグインやテーマがブロックエディターとうまく連携しない可能性は依然としてあります。その場合は、Classic Editorプラグインをインストールするか、開発者にGutenbergサポートの追加を依頼するか、代替のプラグインまたはテーマを見つけることができます。
4. Gutenbergのヒントやコツについてもっと学ぶにはどうすればよいですか？
WPBeginnerは、WordPressのブロックエディタについて学ぶのに最適な場所です。私たちはインターネット上で最大のWordPressリソースサイトです。
ブロックエディターを使いこなすための新しい記事を公開し、古いリソースを更新していきます。
その間、ご不明な点がございましたら、コメントを残していただくか、ウェブサイトのお問い合わせフォームをご利用ください。
5. Gutenbergの問題に遭遇しましたか？
WordPressブロックエディターで問題が発生している場合は、ユーザーが遭遇する一般的なブロックエディターの問題とその解決方法をすべてリストアップした、簡単なトラブルシューティングガイドを作成しました。
動画チュートリアル
文章での説明よりも動画での説明がお好みであれば、こちらのビデオチュートリアルをご覧ください。
ボーナスリソース
ブロックエディターをより効率的に使用するのに役立つ追加リソースを以下に示します。
- WordPressブロックエディターとページビルダー：違いは何ですか？
- カスタム WordPress ブロックを簡単に作成する方法
- WordPress Gutenbergブロックのインポート/エクスポート方法（2つのステップ）
- WordPressウィジェットとブロックの違いとは？（解説）
- WordPressのフルサイト編集の完全初心者ガイド
- WordPressでのフルサイト編集に最適なブロックテーマ
- WordPress コンテンツエディターを使いこなすためのヒント
この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。
jeff
フレーズにハイパーリンクを挿入しましたが、そのフレーズのフォントの色を変更したいです。どうすればできますか？助けてください。
WPBeginnerサポート
その特定のフレーズだけの場合、現時点ではそのフレーズにスタイルを追加するために、テキストをHTMLとして編集する必要があります。
管理者
アン
こんにちは！
3列の列ブロックを作成しました。コンテンツを追加したところ、すべてがページ幅に均等に配置されました。その後、4列目を追加したところ、列ブロックはもはやページ全体の幅に配置されなくなりました。4列すべてが「押しつぶされ」（すみません、今はもっと良い言葉が思いつきません）、情報も縮小されたようです。個々の列のさまざまな配置を試しましたが、ブロック全体を広げることはできませんでした。これが意味をなすことを願っており、助けていただければ幸いです。よろしくお願いします！！
WPBeginnerサポート
最大の列に追加したものが、コンテンツの調整を許可しない最小幅を持っているように聞こえます。これが問題の根本原因でしょう。
管理者
Mark Watts
Gutenbergブロックエディタに苦労しています。いくつか質問がありますが、きっと他にもたくさん出てくるでしょう。
リンクをクリックすると開くPDFドキュメントを追加するにはどうすればよいですか？以前は、リンクテキストを作成してハイライトし、「メディアを追加」を選択するとすべて正常に機能していました。
段落ブロック内からリンクを追加しようとすると、選択できるページや投稿のリストが表示されなくなりました。このリストを表示するにはどうすればよいですか？
WPBeginnerサポート
メディアライブラリ内のドキュメントからリンクを直接取得する必要があるでしょう。埋め込みたいのでなければ。段落ブロックには、右から3番目のリンクボタンがあり、入力するとドロップダウンが表示されます。
管理者
Tuan
This upgrade so stupid. I spent more time to write. Haiz
WPBeginnerサポート
Learning a new interface can certainly be troublesome but as the interface improves it should slowly become better to use
管理者
Jennifer
問題に対する適切な回答が見つからなかったので、ご協力いただけると幸いです。
先週、ウェブサイトを新しいブロックシステムにアップグレードしました。PayPalへのリダイレクトであるボタンのURLを見つけてコピーする必要がありますが、どこにもURLが見つかりません。
ブロック上でボタンにカーソルを合わせても、「編集ボタン」が表示されません。HTMLを確認しましたが、そこにも見つかりませんでした。見えたのはボタン自体の画像ファイルだけでした。
ボタンをクリックしてライブにしても正しくリダイレクトされるので、リンクは機能していることはわかっています。ただ、見つけられないのです。
何かアドバイスはありますか？
ありがとうございます！
Jennifer
WPBeginnerサポート
ブロックを選択すると、右側にブロック設定が表示され、画像として転送された場合のボタンのリンク先設定が見つかります。ボタンブロックの場合は、ボタンの下にURLが表示され、編集できます。
管理者
Franklyn Fosu
Gutenberg を使用して記事を公開しようとした際に発生する「更新に失敗しました」という問題を解決するのを手伝っていただけますか？
WPBeginnerサポート
まず、トラブルシューティングガイドの手順を確認してください：https://www.wpbeginner.com/beginners-guide/beginners-guide-to-troubleshooting-wordpress-errors-step-by-step/
一時的な回避策として、クラシックエディタープラグインを有効にして、Gutenbergのサポートに連絡することもできます。
管理者
カルロス・ゴンサルヴェス
新しい高度なCSSオプションの使用方法。コードを入れようとしましたが、実行されません。
WPBeginnerサポート
That is for adding a class to the object, you would want to take a look at our explanation of CSS to understand classes better: https://www.wpbeginner.com/glossary/css/
管理者
Candi Clark
ブロック編集ページの右上には、「公開」と表示されません。ボタンは「更新」と表示されます。そのボタンをクリックすると、「ページが更新されました」と表示されますが、ウェブサイトで確認すると変更されていません。そのボタンに「公開」と表示されないように、何かが正しくアップグレードされなかったのでしょうか？
WPBeginnerサポート
問題の原因となっているサイトのキャッシュを確認することをお勧めします。
管理者
ジム・キエルバソ
古いバージョンに戻すにはどうすればよいですか？ 何も問題はありませんでしたし、このバージョンは何も追加していません。 実際、はるかに混乱させています。 ユーザーフレンドリーではなく、非常にフラストレーションが溜まります。 アップグレードは、変更のためだけでなく、改善のためにのみ行うべきです。
WPBeginnerサポート
新しいエディターは、WordPressに慣れていない方が参入障壁を低くできるように作成されました。古いエディターを好む方のために、Classic Editorプラグインがあり、そのプラグインについてはこちらの記事で説明しています： https://www.wpbeginner.com/plugins/how-to-disable-gutenberg-and-keep-the-classic-editor-in-wordpress/
管理者
Sufyan Shaikh
良い記事です。
WPBeginnerサポート
Thank you
管理者
AlannaMH
ブロック内のテキストのフォントを変更するにはどうすればよいですか？
WPBeginnerサポート
サイトのフォントを設定するには、こちらの記事をご覧ください。https://www.wpbeginner.com/wp-themes/how-to-add-custom-fonts-in-wordpress/
管理者
ヴィクトル
時間がかかります。WPに行くと、非常に否定的なコメントが見られます。
私の場合、解決策は「Disable Gutenberg」というプラグインを有効にすることでした。
学習曲線があることは理解していますが…私はパスします…すみません
WPBeginnerサポート
まだGutenbergエディターを使用する準備ができていない場合は、そのようなプラグインを使用することは確かに理解できます。
管理者
フランク・キングホーン
私はウェブサイト作成の完全な初心者で、サポートが充実しているように見えたためWPを使用することにしました。その時はWPbeginnerの存在を知りませんでしたが、なんと！WPbeginnerの様々なガイドを見つけた今、正しい選択をしたと確信しています。特に、新しいエディターに関するこのガイドは素晴らしいです。その存在だけでも、私は深い穴から救い出されました。最初の実際のウェブサイトを始める前に、PCにWPをインストールして試すことができましたが、iThemesによる「WordPress入門」ガイドに示されているエディターの兆候がどこにも見当たらず、ページの編集段階に進んだときに立ち往生しました。ダウンロードが破損しているのか、それとも何か簡単なものを見落としているのか、何時間もかけて確認しました。今なら、クラシックエディターが置き換えられたことがわかります！長文失礼しましたが、このガイドとWPbeginnerで見つけた他のいくつかのドキュメントに心から感謝します。
WPBeginnerサポート
Thank you, glad our site and articles could help you get up and running with WordPress
管理者
vivek
投稿しようとするたびに、すべて「自動下書き」になってしまいます。
何が起こっているのか理解できません
WPBeginnerサポート
まずは、こちらのトラブルシューティング記事をご覧ください。https://www.wpbeginner.com/beginners-guide/beginners-guide-to-troubleshooting-wordpress-errors-step-by-step/
管理者
アーロン・P
素晴らしい記事をありがとうございます！この移行に本当に役立ちました。切り替えるのをためらっていましたが、しばらくいじってみて、新しいブロックエディターが好きになりました。
WPBeginnerサポート
You’re welcome, glad our article could ease the transition
管理者
マシュー・パン
こんにちは、これについてありがとうございます。本当に役立ちました。
ボタンブロックを追加する件ですが、新しいタブで開くように追加することが現在できません。以前は簡単なチェックボックスがあったのですが、ご存知でしょうか？
2. WordPressの投稿やページにボタンを追加する
ありがとうございます！
WPBeginnerサポート
When adding a link you should have an option with three dots that you can click to have the open in new tab option again.
There is a button block you can use to add a button to your posts and pages
管理者
サリー
この新しいエディターで Grammarly アプリをどのように使用すればよいですか？ Grammarly が下に表示されず、間違いを修正したり、間違いを示したりしてくれないのですが。よろしくお願いします。
WPBeginnerサポート
段落ブロックで2行目に到達すると、Grammarlyのチェックが画面の隅に表示されるはずです。表示されない場合は、Grammarlyのサポートに連絡すれば、エディタに正しく表示されるように手助けしてくれるはずです。
管理者
Linn
こんにちは、全くの初心者です。LyndのMorten氏によるWordPress 5のコースを2つ受講しました。Gutenbergは使いやすいです。しかし、Gutenbergでヘッダーとフッターを構築する方法がまだわかりません。フル幅のカラー背景に、「会社概要」「サービス」「製品」などのボタンをいくつか追加したいです。手伝ってもらえますか？
WPBeginnerサポート
ヘッダーとフッターのスタイリングは通常、テーマから処理されます。HTML、CSS、PHPの知識が必要になるか、こちらの記事をご覧ください: https://www.wpbeginner.com/wp-themes/how-to-easily-create-a-custom-wordpress-theme/
管理者
今
ブロックエディターのスクロール問題を修正できたかどうか知っていますか？設定セクションに移動してそこでスクロールしないと、ブロックセクションの下部にスクロールできないのは本当に迷惑です。何度も検索しましたが、解決策が見つかりません。本当にありがとうございます！
WPBeginnerサポート
特に他に指示がない限り、そのエラーは問題にならないはずですが、もし特定のエラーが解決されたかどうかを知りたい場合は、WordPress.orgのサポートに問い合わせることができます。
管理者
スティーブ・ブリース
おいおい、みんな。これはWordPressを作成した人々ではありません。これは、ブロックに慣れるのを手伝ってくれる親切な人々です。ブロックが気に入らない場合は、Classic Editorプラグインをインストールするように何度言えばいいのでしょうか？ブロックが好きかどうかわかりませんが、この紹介を読んでからテストする自信が持てました。ありがとうございます！
WPBeginnerサポート
Glad our article could help
管理者
サンディープ
こんにちは、WordPress 5.1をインストールした後、Gutenbergを使用してテキストを入力すると、最初の単語の上に1行が表示されます。何が問題なのかわかりません。解決方法を教えていただけますか？
WPBeginnerサポート
プラグイン固有の問題かどうかを確認するために、すべてのプラグインを無効にしてみましたか？
管理者
デニー・ギブソン
画像の周りにテキストを折り返す方法が見つかりませんでした。何か見落としているか、これは思ったほど人気がないのでしょうか？
WPBeginnerサポート
テキストをブロックエディターで折り返すには、メディア＆テキストブロックを使用したいでしょう
管理者
Tom Schulte
ブロックエディターでHTMLをコーディングする方法はまだありますか？
ブロックエディターが、不要な2行の間に余分な広いスペースを挿入したため、このように質問しています。クラシックエディターのテキストオプションを使用して、余分なスペースを削除することができました（そして削除しました）。
WPBeginnerサポート
はい、右上にある楕円を使用してHTMLに切り替えるか、特定のセクションのみをHTMLで編集したい場合はクラシックブロックを使用できます。
管理者
リックスウィフト
新しいブロックの考え方を不本意ながら使い始めましたが、気に入っていませんでした。しかし、この記事を見つけられてよかったです。この新しい概念のナビゲーションがずっと楽になりました。
誰かこの経験をした人はいますか？ドキュメントにタグを追加すると、Enterキーを押しても小さなボックスがまったく拡大しません。入力したタグを確認する方法が全くわかりません。
WooThemes – Canvasを使用しています
現在、非常にフラストレーションのたまる経験です。
WPBeginnerサポート
まだ試していない場合は、プラグインを無効にしたり、テーマを切り替えたりして、自動展開タグセクションが正しく表示されない原因がそれらとの競合にあるかどうかを確認することをお勧めします。
管理者
Charles
いつかこれを使いこなせるようになるかもしれませんが、今のところ不可能に思えます。私は十数個のワードプロセッサや様々なウェブエディタを使ってきましたが、その経験は今役立っていません。
いくつかの段落をインデントしたいのです。簡単なことのように思えますが、方法が見つかりません。インデントできない段落ブロックに何の意味があるのでしょうか？
前回はテーブルの挿入を諦め、古いシステムでHTMLを編集することに戻りました。
WPBeginnerサポート
段落ブロックには現時点ではインデントオプションがありませんが、ブロックエディターを再度使用する場合は、クラシックブロックを使用してインデントを追加できます。
管理者
クレイグ・ウォレス
ということは、新しいページにテンプレートを割り当てるという概念はなくなったのですか？
私が見る限り、ブロックから新しいページを作成する際に、以前の方法で作成したテンプレートを選択する方法はありませんか？（つまり、テンプレートのドロップダウンが見当たりません）。
WPBeginnerサポート
現在お使いのテーマにテンプレートがある場合、ページテンプレートを設定するには、ページの属性の下を確認してください。
管理者
ニナ・ヘーリンガー
リストブロックのフォントサイズを大きくするにはどうすればよいですか？どこを探しても見つかりません。WordPressは初めてで、あまりユーザーフレンドリーではないと感じていますが、慣れようとしています。リストブロックのフォントサイズを大きくする必要があります。助けてください。
WPBeginnerサポート
そのフォントサイズを変更するには、手動でCSSを追加する必要があります。または、CSS Heroのようなプラグインを使用することもできます。
https://www.wpbeginner.com/plugins/css-hero-review-wordpress-design-customization-made-easy/
変更する必要のある CSS を見つける方法については、インスペクト要素を使用できます。これは、こちらの記事で使い方を説明しています: https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
管理者
マリオ・ガルシア
新しいWordPress（ブロック）をインストールしたばかりなのですが、タイトルブロックはうまくいきますが、2番目のブロックに入力したものがプレビューすると重複して表示されるため、困っています。投稿でそのブロックがタイトルの下に2回表示されます。何が間違っていますか？
WPBeginnerサポート
これは特定のテーマのスタイルではないことを確認するために、テーマのサポートに確認することをお勧めします。
管理者
Ericka
新しいブロックエディターを操作しようとしています。クラシックエディターでボタンをクリックするだけで、ホームページのテキストを分割するために使用していた「続きを読む」ボタンを探しています。
WPBeginnerサポート
It was renamed into the More block
管理者
TEGA PERKINS ODJEGBA
ブロックのサイズを大きくするにはどうすればよいですか？ガイドを何度も読みましたが、その点については触れられていませんでした。
ブロック内の文字を大きくしたいのですが、どうすればよいですか？また、ブロックを2つ結合することは可能ですか？
WPBeginnerサポート
変更したい内容によります。コンテンツをコピー＆ペーストしてから、コンテンツを移動したブロックを削除することはできますが、現時点では簡単なマージボタンはありません。フォントサイズをお探しの場合は、通常、テーマのCSSで管理されています。
管理者
ケルシー
「続きを読む」オプションを、ブログの最初の数文がメインのブログページにプレビューとして表示されるようにする方法がわかりません。何かヒントはありますか？また、ハイパーリンクのフォントの色を変更する方法はありますか？よろしくお願いします！！
WPBeginnerサポート
「続きを読む」機能を使用するには、「続きを読む」ブロックを追加する必要があります。ハイパーリンクの色については、CSSを修正する必要があります。要素の検査を使用して目的の色変更をテストし、カスタムCSSを「外観 > カスタマイズ > 追加CSS」セクションにコピーできます: https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
管理者
Vicky
素晴らしい紹介、ありがとうございます！
WPBeginnerサポート
You’re welcome
管理者
カレー
クラシックエディターでは、段落内に画像を配置し、すべてをマージン内に収めることができました。しかし、Gutenbergではそれができません。メディア・段落ブロックに関する指示に従い、正常に動作するように見えます。しかし、プレビューに切り替えると、画像が段落の前に配置されます。単純に新しいブロックを追加すると、画像は左または右にしか配置できず、スクリプトのマージンの外に出てしまい、見た目が悪くなります。非常にフラストレーションが溜まります。助けを求めています。
WPBeginnerサポート
ブラウザウィンドウが十分に広くないため、テキストが自動的に下に配置されない可能性があります。ブロックエディターで動作するようにスタイリングを更新する必要があるかどうか、お使いの特定のテーマのサポートに問い合わせることをお勧めします。
管理者
カレー
新しいGutenbergエディターで、テキストの横に画像を配置する手順に従いましたが、プレビューをクリックするまでは問題ありません。プレビューでは、テキストの前に大きな画像として表示されます。プレビューに正しく転送させることができませんでした。
WPBeginnerサポート
モバイルの場合、ブロック内の画像の高度な設定により、テキストと画像が積み重ねられている可能性があります。
管理者
デブラ・オークランド
この新しいフォーマットでは、以前のエディターのようにFotoliaのカバー写真をサイズ調整できなくなったため（幅広で細長い写真が必要）、カバーブロックを選択したところ、写真が幅広で細長くなりました。カバーブロックの中央にタイトルを配置しました。記事にはタイトルがない（当然ですが）ので、パーマリンクを変更する必要があります。適切なパーマリンクを入力するために、「uncategorized」とその後の数字を削除できません。古いエディターに戻らずに、この問題を解決しようとしています。このパーマリンクの変更方法に関する情報が見つかりません。これで意味が通じることを願っています。このチュートリアルは非常に役立ちます。ありがとうございます。
WPBeginnerサポート
画像のサイズを編集するには、この記事にあるような画像エディターを使用すると良いでしょう：https://www.wpbeginner.com/showcase/tools-to-create-better-images-for-your-blog-posts/
パーマリンクにカテゴリが含まれている場合は、カテゴリを変更し、下書きを手動で保存して、パーマリンクが新しいカテゴリに更新されるようにする必要があります。
管理者
Silke
こんにちは、フッターバーにメニューを割り当てるにはどうすればよいですか？フッターバーにも表示されるようにしたいのですが。現在、カスタムフッターメニューを作成しています。「ダッシュボード/外観/メニュー」で「フッターメニュー」に割り当てると、ページに自動的に表示されます。もしこれをフッターバーに割り当てると、メニューが2つ表示されてしまいます。
問題はこうです。カスタムフッターメニューに「フッターメニュー」を割り当てないと、フッターバーエディターで利用できなくなります。
WPBeginnerサポート
テーマに特定の設定があり、それが問題を引き起こしている可能性があります。お使いのテーマのサポートに連絡し、表示されない/二重に表示される問題について伝えてみてください。
管理者
Mark Braunstein
新しいエディターを学ぶ時間がありません。学びたくもありません。変化は必ずしも良いものではありません。何日も作業を失いました。ありがとうございます！
もしそれがもっと良ければ、Microsoft WordはGutenbergのように動作するでしょう。実際には問題ではありません。誰もが知っている方法で動作する必要があります。派手な理論的な方法ではありません。生産性が鍵であり、それが機能しない場合、生産性を失ったことになります。私たちはより良いネズミ捕り器を必要としているのではなく、単に機能するものを必要としているのです。別のサイトプラットフォームを見つけなければならないと思います。
私や他の多くの人も、直感的ではないと感じています。以前はクラシックエディターを使用するためのボタンがありましたが、今は見つかりません。自分のサイトにプラグインを追加し続けたくありません。それらはバグだらけです。
WPBeginnerサポート
私たちはWordPressの開発を管理しているわけではありません。WordPressの使用方法を理解するお手伝いをしています。すべてのプラグインがバグだらけというわけではありません。こちらのプラグインをご覧ください：https://www.wpbeginner.com/plugins/how-to-disable-gutenberg-and-keep-the-classic-editor-in-wordpress/
管理者
Cheryll
とても混乱していて、新しいやり方を学ぶのにすでに時間がかかっているように感じています。DIYは好きですが、テクノロジーに詳しくない私にとって、これは後退しました。しかし、あなたの記事は確かに役立ちましたので、本当に感謝しています！
WPBeginnerサポート
当社のガイドがお役に立てて嬉しいです。一時的に古いエディターに戻したい場合は、こちらもご覧ください： https://www.wpbeginner.com/plugins/how-to-disable-gutenberg-and-keep-the-classic-editor-in-wordpress/
管理者
バージニア
このGutenbergは時間がかかり、労力に見合わないと感じていますが、なんとか機能させなければならないと思っています。
しかし、ブロックの左側にあるあのマークが見えず、それらをどのように移動させるのか分かりません。
また、プルクォートを挿入すると他のブロックのスペーシングが崩れてしまい、それもどう修正すれば良いのか分かりません。
WPBeginnerサポート
引用については、テーマのサポートにスタイリングについて確認することをお勧めします。左側のアイコンについては、ブロックの左側にマウスカーソルを合わせると表示されるはずです。ただし、ブロックが複数ある場合に限ります。ブラウザウィンドウを拡大して表示できるか確認してみてください。
管理者
バージニア
ありがとうございます。問題が何であるか分かりました。アイコンを表示するにはJet Packを有効にする必要があります。奇妙なのは、投稿ごとに個別に有効にする必要があることです。この「改善」はまだ嫌いです。
Kevin
有益な投稿をありがとうございます。まだWPブロックは試していませんが、役立ちそうです。過去8ヶ月間Elementorを使用してきましたが、ブロックは似ているようです。
多くのページ/投稿で同じレイアウトを使用できるように、ブロックでテンプレートを作成できますか？
再度、ありがとうございます。
WPBeginnerサポート
ブロックエディターは現時点ではそのレベルのカスタマイズに対応していません。ご要望に近いものとしては、再利用可能なブロックがあります: https://www.wpbeginner.com/beginners-guide/how-to-create-a-reusable-block-in-wordpress/
管理者
マイク・ハウ
こんにちは、
WordPress 5にアップグレードしましたが、アップデートページには最新バージョンであると表示されます。しかし、Gutenbergブロックエディターがありません。プラグインのリストでクラシックエディターが有効になっていることがわかります。ブロックエディターを試したいのですが、アップデート後にクラシックエディターを再アクティブ化しなかったため、インストールされているかわかりません。どうすればよいですか？クラシックエディターを無効にするだけでよいですか？それともWordPress 5を再インストールするプロンプトを使用しますか？それとも何か別のことですか？言うまでもなく、最初にバックアップを取ります。アドバイスをお願いします。
WPBeginnerサポート
マイクさん、こんにちは。
Gutenberg を使い始めるには、クラシックエディタープラグインを無効にすることができます。また、Gutenberg へのアップデートのためにサイトをテストする方法に関するガイドも参照してください。
管理者
シェリエナ
練習で投稿を書いて新しいGutenbergを学ぼうとしています。問題は、多くの段落の後でYoastプラグインのブロックが段落の前に来てしまい、入力しているものが見えないことです。
WPBeginnerサポート
Yoastプラグインのサポートに連絡して、確認してもらうことをお勧めします。
管理者
ハンク・バウスト
ブロックで編集を開始しましたが、ある数を超えると、それ以上追加できなくなります。 ブロックを使用するための最大ページ長はありますか？ Yoastプラグインはページの下部にありますが、それが追加ブロックを停止しているかどうかはわかりません。
WPBeginnerサポート
デフォルトでは、最大高さはありません。プラグインによってブロックの追加が妨げられている場合は、そのプラグインのサポートに連絡すれば、その問題を回避する方法について支援を受けられるはずです。
管理者
ジャネット・ドナルドソン
ブロック編集が私のサイトではまったく機能しません。 更新を拒否し、変更を保存しません。 少し混乱していますが、これがどのようにそんなに優れているのですか？ そして、それを使用する方法についての巨大なチュートリアルがあるのですか？ それは私の人生を楽にしてくれません。
WPBeginnerサポート
残念ながら、これは新しいWordPressの機能であるため、さまざまな種類のサイトで修正中のバグがあります。当面の間、古いエディターを次のように使用できます：https://www.wpbeginner.com/plugins/how-to-disable-gutenberg-and-keep-the-classic-editor-in-wordpress/
管理者
ティム・ボーレン
このGutenbergは本当にがっかりです。Wordpress以前は、31人のライターが、ページ上で簡単に、素晴らしい医療記事を作成でき、コンテンツの創造性を発揮できました。今では、ライターたちは怒り、愚かなボックスの中でつまずき、集中力を失い、私にメールの添付ファイルで記事全体を送ってきて、私が理解しなければなりません。
最初の24時間で冒涜的な言葉を使い果たしました。
これらの人々は、コカ・コーラの「ニューコーク」の失敗を思い出させます。
手伝いたいですか？まず、Gutenbergがページや投稿に何を追加できるかを示し、次にブロックを使用してそれを行う方法を示してください。新しいことには前向きですが、まずそれをやりたい理由を教えてください。
Adnan
あなたのサイトが好きです
WPBeginnerサポート
Glad you like our site
管理者
Chris
こんにちは
Gutenberg は様々なデバイスでの応答性についてどの程度テストされていますか？
Chris
Ryan
とても良い記事です。私は今のところこれに賛成ではありません。
いくつかの理由があります：
1. フォントフェイスの変更方法がわかりません。
2. ドラッグしてテーブルセルの幅を変更できません。
3. ブロックはあまり必要ありません。
WPBeginnerサポート
WordPress開発者は、ブロックエディターを拡張し、それらのコントロールを提供するツールを作成する可能性が高いですが、古いエディターに戻すには、次のURLを使用できます。https://www.wpbeginner.com/plugins/how-to-disable-gutenberg-and-keep-the-classic-editor-in-wordpress/
管理者
Mathukutty P. V.
GiphyのGIFを追加しようとしましたが、埋め込めないというエラーが表示されました。いくつかのブロックを試して、3/4の投稿を作成しました。マルチカラムブロックは新しい情報です。ありがとうございます。
ラマ・ラオ
良い記事です。
編集スタッフ
Thanks Rama, glad you found it helpful
管理者
アーチャー
WordPressにはアップグレードすべきことがたくさんある（例：検索機能）のに、いやいや、ちゃんと動くものを変えて、もっと難しく、時間がかかり、混乱するものにしよう。投資家の皆さん、新しいヒップスターエディターを見てください、どれだけ素晴らしいか。
Gutenbergはオプションであるべきで、必須ではない。
編集スタッフ
Archerさん、こんにちは。
You can always install the Classic Editor plugin to keep the old editor
管理者