2022.04.14WordPressのエディターに搭載される再利用ブロックを使って配置したブロックは、それが再利用ブロックであることが分かりにくいのが難点です。そこでエディター上の再利用ブロックの外観を調整する方法でこの問題を解決します。いう機能がありますが、それを管理するページへのアクセスが少々分かりにくいです。これを改善するため、管理メニューに再利用ブロックを管理するページへのショートカットを追加します。再利用ブロックの作成エディターで作成した1つ以上のブロックを選択し、ツールバーの「再利用ブロックに追加」を選ぶと再利用ブロックとして登録されます。登録済の再利用ブロックは同一の投稿内に限らず別の場所に配置することができます。再利用ブロックに対して行われた変更は、他の場所に配置された同一の再利用ブロックにも反映されます。再利用ブロックの編集は配置されている投稿もしくは再利用ブロックの一覧から可能です。どちらの場合も他の記事に配置された同一の再利用ブロック全てに反映されます。通常のブロックへ変換できる再利用ブロックは「通常のブロックへ変換」することができます。変換後の編集は他のブロックへは反映されません。再度「再利用ブロックに追加」した場合は別の再利用ブロックとして新規登録されます。ような使い方はできませんが、通常のブロックへ変換することでそういった使い方も可能です。再利用ブロックが判別しにくい問題エディター上の再利用ブロックは見分けにくい参考画像の赤枠で囲まれた部分は1つの段落と1つのリストが含まれた再利用ブロックなのですが、ぱっと見ただけでは再利用ブロックであることが分かりません。カーソルを合わせて表示されるツールバーを確認して初めて再利用ブロックであることが判別できます。再利用ブロックであることが気づきにくいと、間違って編集してしまうミスも起こりやすくなってしまいます。エディター用のCSSを編集して再利用ブロックを判別しやすく改善する記事編集時のエディターにのみ反映されるCSSを使って再利用ブロックの見た目を変更します。エディター専用のCSSファイルが無い場合は新規ファイルを用意し、add_editor_style()で読み込みます。ブロックエディター(Gutenberg)にサイトと同じCSSを適用する【WordPress】サイトに適用されているCSSをブロックエディター(Gutenberg)にも反映したい場合の手順です。エディターの表示をサイトに合わせることで記事の完成形をイメージしやすくなるメリットがあります。0.8em;}CSSが適用されたことを確認スタイルが適用されると画像のようになります。枠線とコメントで再利用ブロックであることが認識しやすくなったと思います。add_editor_style()によるエディター用CSSを使うことでフロントエンドの公開記事に影響を与えることなくエディター上の表示のみを変更できます。none;を指定してマウス操作によるカーソル移動を制限していますがキーボード操作での編集は可能です。ウェブ倉庫.メニューホームウェブ制作ホビーお問い合わせホーム検索トップサイドバータイトルとURLをコピーしました。