簡単設定に、boilerplate を追加しました。

emulsion テーマ 1.6.1 で、カスタマイザーの簡単設定に boilerplate を追加しました。
boilerplateは、テーマのスタイルやJavascriptを外して、素のhtmlで表示する機能です。

新しい機能を有効にしました。

この機能は、boilerplate が有効でない場合でも動作します。

カスタムフィールド、css　を追加していただくと、そのフィールドに追加したCSSを個別ページや投稿に追加することができます。

カスタムフィールド css を追加すると、投稿とページのbody要素に、has-custom-styleが追加されますので、CSS 変数の変更を行う場合は、それを使ってスタイルを記述するといいかもしれません。

.has-custom-style{
--thm_background_color:#333333;
 --thm_general_link_color:    #cccccc;
 --thm_general_link_hover_color:#ffffff;
 --thm_general_text_color:#ffffff;
 }

アーカイブページなどのスタイルを変更する場合は、body class の各クラス名に、style-　prefixをつけたスタイルシートが、テーマのcssディレクトリに存在した場合、それらのスタイルを読み込みますので、特定のカテゴリーページや404ページなどのCSSを自在にカスタマイズできます。

今回の変更で、cssは、細かく分割しました。メタボックスで、スタイルとスクリプトを削除して、必要なスタイルを読み込むことが可能になりました。

カスタムフィールド css に、以下のようにテーマのスタイルをインポートすることも出来ます。

@import url(https://example.com/wordpress/wp-content/themes/emulsion/css/common.css);
@import url(https://example.com/wordpress/wp-content/themes/emulsion/css/accessibility.css);
@import url(https://example.com/wordpress/wp-content/themes/emulsion/css/block-presentation.css);
@import url(https://example.com/wordpress/wp-content/themes/emulsion/css/primary-menu.css);

ver1.6.1 CSSファイルのリスト

• accessibility.css
• amp.css
• archives.css
• backward-compatible.css
• block-presentation.css
• boxed.css
• columns.css
• comments.css
• custom-color.css
• effect.css
• gallery.css
• header.css
• loops.css
• primary-menu.css
• single.css
• style-editor.css
• tinymce-style.css