web-dev-qa-db-ja.com

Add_editor_styleでmain style.cssを使う

私がオンラインで読んだリソースはすべて、WYSIWYGエディタを実際のコンテンツの外観によく似たスタイルにするために、異なるCSSファイル(editor-style.css)を使用することを推奨しています。

テストの目的のために、私は他のサイトに使用しているメインのstyle.cssファイルを使用しようとしましたが、WYSIWYGエディタのスタイル設定は見栄えがよく、今のところこれを行っても問題に気付きません。

それでも新しいeditor-style.cssを作成してそれを使用するべきですか、それとも私のメインのstyle.cssを使用することは容認できるプラクティスですか?

参考までに、これは私が以下で使用したコードです:

function wysiwyg_styles() {
    add_editor_style( 'style.css' );
}
add_action( 'init', 'wysiwyg_styles' );
2
epsilon42

最も簡単な答えは次のとおりです。エディタにはどんなスタイルシートを使用することもできます。 add_editor_style()に何も渡されない場合、editor-style.cssはロードされたデフォルトのスタイルシートです。

これは指定されたスタイルシートをロードします:

add_editor_style( 'some-stylsheet.css' );

これでeditor-style.cssが読み込まれます。

add_editor_style();

ニーズに合ったものを使用してください。

ところで、テーマに固有のものであるため、initではなくafter_setup_themeアクションを使用してエディタスタイルシートを追加することをお勧めします。

add_action( 'after_setup_theme', 'cyb_theme_setup' );
fucntion cyb_theme_setup() {
    add_editor_style();
}
2
cybmeta

編集者はあなたのウェブサイトのフロントエンドで使用されているすべてのスタイルを使用するわけではありません。だから、あなたはstyle.cssファイル全体を必要としません。それでも、ファイルはブラウザによってキャッシュされるので、おそらくパフォーマンスの問題はありません。

しかし、style.cssがかなり巨大な場合、衝突の問題があるかもしれません。管理パネルで使用されている他のスタイルを上書きする可能性があります。ダッシュボードの全体的な外観が少し変更されていることに気付いたかもしれません(おそらく、そうではありません)。この場合は、小さなスタイルシートを作成して、単一の投稿とページで使用されているスタイルのみを含めることができます。

0
Jack Johansson