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

tenman

この機能は、emulsion 2.6.9で廃止になりました

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
[emulsion_relate_posts]