Gutenberg が WordPress に間もなく登場します。 君の サイトのWeb 彼は準備ができていますか？ どのような形になるかはまだ正確にはわかりませんが、この新しいコンテンツ システムは将来的に WordPress に追加される予定です。 これがサイトに与える可能性のある潜在的な影響と、問題のある領域を事前に特定して修正する方法を見てみましょう.
グーテンベルクとは何ですか？
Gutenberg は、ユーザーがコンテンツをより柔軟にデザインできるようにすることを目的とした WordPress プロジェクトです。 基本的に、このプロジェクトは、主にワード プロセッサとして機能する現在のエディターを、より視覚的で構造化されたインターフェイスに置き換えることを目的としています。 現在、Gutenberg はプラグインであり、ユーザーはコンテンツを同じ方法で編集できます。 視覚的な作曲家 または他のドラッグ アンド ドロップ エディター (ドラッグ アンド ドロップ) ですが、単純化された非常に直感的な方法です。
グーテンベルグの詳細については、 こちらをクリック.
サイトの一部
Gutenberg は巨大な企業であり、多くのエンドポイントに到達する可能性があります。 サイトのWeb. これらは、潜在的な問題について調査する XNUMX つの領域です。
- あなたのテーマ： Gutenbergには、コンテンツ用の独自のスタイルセットが付属しています。 あなたのテーマは互換性がありますか？ グーテンベルクはアクティブなときにどのように見えますか？
- あなたのプラグイン： Gutenbergが予期しない方法で他のプラグインと相互作用する可能性があります。 それが何であるか、そして発生した問題を修正するために何をする必要があるかを見ていきます。
- あなたのコンテンツ： Gutenbergは、コンテンツの表示方法に影響を与えます。 これによりページの外観がどのように変化するかを確認し、問題が発生した場合に考えられる解決策をいくつか検討します。
テストエリアの設定
始める前に、メインサイトを危険にさらすことなくGutenbergを試すことができるテストエリアを設定することをお勧めします。 理想的には、独自のテストエリアを作成するか、サイトのローカルコピーを作成する必要があります。 これらのタスクの実行方法の詳細については、次のチュートリアルを参照してください。 WordPressをローカルにインストールする方法.
これが不可能な場合は、サイトで直接テストを実行できます。 サイトの多くの部分をアクティブ化および非アクティブ化するため、これはリスクを伴う可能性があることに注意してください。 ライブテストを行う場合は、開始する前に必ずサイトのバックアップを作成してください。
テストする場所がわかったら、pluginsディレクトリに移動してGutenbergを見つけます。 インストールしてアクティブ化したら、読み進めてください。
テーマをテストする
Gutenbergがインストールされたので、影響を受ける可能性のあるサイトの最初のセクションであるテーマを見てみましょう。 データベースエラーやWordPressダッシュボードの問題など、この時点ですでに大きな問題がある場合は、セクションに進んでください。 問題が多すぎる場合の対処方法.
Gutenbergは主にサイトのコンテンツとやり取りするため、いくつかのことをテストするだけで十分です。幸運なことに。
XNUMXつ目は、Gutenbergには独自のスタイルシートと一連のスタイルが付属していることです。 サイトで使用されているさまざまな種類のページとテンプレートをそれぞれチェックして、正しく表示されていることを確認します。 ここでの主な目標は、ページのメインコンテンツ領域の要素、特にコンテンツと画像ブロックに焦点を当てることです。 問題が発生した場合は、Gutenbergのスタイルがサイトのスタイルよりも優先されている可能性があります。
これを修正するには、問題の原因を特定する必要があります。 通常、これはHTML要素または独自のクラスよりもGutenbergスタイルの優先順位に焦点を合わせたCSSセレクターになります。 いずれにせよ、エラーが発生している場所を特定してみてください。 次に、Gutenbergのスタイルがあなたのスタイルを上書きしている理由を理解し、それが優先されるようにコードを修正します。
自分のテーマを修正してみてください（さらに良いことに、テーマのCSSに指定された子テーマまたは領域内）、Gutenbergを変更するのではなく。 Gutenbergのファイルを直接編集すると、プラグインの更新時に上書きされる可能性があります。
同様に、ダッシュボードで同じテストを一度だけ実行する必要があります。 テーマオプションおよびテーマによって生成されたその他のカスタムセクションは、これまでのところ最大の原因のようです。 これらの領域でスタイルの問題を特定したら、通常、子テーマを変更または作成し、そこでCSSを微調整することで問題を修正できます。
あなたのプラグインは機能しますか？
テーマをテストした後、サイトのプラグインは次のようになります。 具体的には、コンテンツで使用するショートコードを提供するプラグイン（Gravity Formsなど）、コンテンツの外観に影響を与えるプラグイン（テキストサイズに影響を与えるアクセシビリティプラグインなど）、およびページに要素を直接挿入するプラグイン（高度なカスタムフィールドなど）。
ショートコードを探る
この領域を監査するには、使用するすべてのショートコードのリストと、それらが存在するページを収集することから始めます。 リストを手元に置いて、これらの各ページにアクセスし、期待どおりに機能するかどうかを確認してください。 スタイリングの問題が発生している場合は、以前と同じ問題が発生していて、スタイルを再調整する必要がある可能性があります。
ただし、ショートコードが表示され、期待されるコンテンツが表示されない場合（つまり、ページに [shortcode]正しいことをする代わりに）別の解決策があります。 この場合、ショートコードが配置されているブロックを見て、それがテキストと見なされていないことを確認できます（ショートコードの周りの不要なラベルを見つけて削除します）。 問題が解決しない場合は、ショートコードをより適切なブロックタイプに移動すると、すべてが再起動します。
コンテンツの外観
この問題は、すでに説明したのと同じ問題、つまりスタイルの置換に起因します。 影響を受ける要素を特定し、CSSを修正します。
要素の作成
競合する問題について検討する最後の領域は、アイテムの作成についてです。 たとえば、PHPがAdvanced Custom Fieldsプラグインからカスタムフィールドを抽出する場合、ショートコードを使用せずにHTML要素をページに挿入するプラグインは疑わしいです。
要素を作成する際の最も一般的なずれは、互換性のないブロックを中心に展開します。 グーテンベルクは独自のスタイルを提供しているため、意図しないブロック内でアイテムを作成すると、正しく表示されない可能性があります。 これに対する修正は、コードがアイテムをブロックに追加することを確認することです。
コンテンツは必要に応じて表示されますか？
これまでに説明した他の問題ほど緊急ではありませんが、コンテンツの表示方法が複雑になる可能性があります。 これらの問題のほとんどは、マイナーなスタイルの変更または組織 ブロック。 これを修正するには、ページが思いどおりになるまでブロック システムをいじる必要があります。
問題が多すぎる場合の対処方法
このチュートリアルの提案では解決できない問題が発生しましたか？ パニックにならない ！ GutenbergがWordPressのコアに統合されるまでにはまだしばらく時間がかかります。
まず、エラーとは何か、エラーの原因となった手順を書き留めます。 収集できる情報が多ければ多いほどよいでしょう。 このすべての情報をGutenbergチームに渡します。 運が良ければ、彼らは問題を特定し、将来のリリースで修正できるようになります。
ステージングサイトで作業していた場合、現時点でできることはこれだけです。 リリースノートをチェックして、問題が解決したかどうかを確認するか、自分で修正してください。
ライブサイトで作業している場合、Gutenbergを無効にすると、すべてが正常に戻るはずです。 そうでない場合は、チュートリアルの開始時に作成したバックアップに戻るときが来ました。
あなたのインストールで幸運！
Gutenbergは、コンテンツをより良いものに変更しようとするWordPress環境の大規模な変更を目指しています。 メインブランチに到達する前に、サイトが新しい変更で機能することを確認してください。 ここに記載されている以外の問題、より良い解決策、またはこのチュートリアルの修正がある場合は、以下にコメントを残してください。
