WordPress│Code SnippetsでエディタにもCSSを反映させる方法

個人的にコード類（PHP,JS）はCode Snippetsのプラグインで管理するのが好きでしたが、CSSだけはエディタに反映できないので、別のところに書いていました。

しかし書き方や読み込み順を制御することで、書いたCSSがフロントとエディタ両方に反映することができたので、紹介します。

サンプル

下記のコードをCode Snippetsに記載して、エディタとフロント両方に反映することができました。

h2.wp-block-heading {
    background-color: #b8bdf5;
}
h2.wp-block-heading:before {
    border-top: solid 2px #b8bdf5;
    border-bottom: solid 2px #b8bdf5;
}

著者

motoki

WEB制作をしているデジタルノマド
WordPressのカスタマイズが好きで、色々と自作しています。

WordPressのカスタマイズに困ったらご相談ください！

WordPressテーマ「SWELL」特化の...

カスタマイズの依頼・相談

Code SnippetsでエディタにもCSSを反映させる方法

やり方は簡単ですfunctions.phpだけで完結します。

本体のCSS入れ込むコードやエディタに上書きするタイミングがポイントです。