標準カラー選択時のstyle属性出力について - Cocoonテーマに関する質問 https://wp-cocoon.com/community/cocoon-theme/%e6%a8%99%e6%ba%96%e3%82%ab%e3%83%a9%e3%83%bc%e9%81%b8%e6%8a%9e%e6%99%82%e3%81%aestyle%e5%b1%9e%e6%80%a7%e5%87%ba%e5%8a%9b%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/ Cocoon ディスカッション掲示板 ja Fri, 17 Jul 2026 23:59:34 +0000 wpForo 60 RE: 標準カラー選択時のstyle属性出力について https://wp-cocoon.com/community/cocoon-theme/%e6%a8%99%e6%ba%96%e3%82%ab%e3%83%a9%e3%83%bc%e9%81%b8%e6%8a%9e%e6%99%82%e3%81%aestyle%e5%b1%9e%e6%80%a7%e5%87%ba%e5%8a%9b%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/#post-88842 Wed, 27 May 2026 12:36:37 +0000 @yhira さん

拝承。

実際のブロックを並べた確認すると以下のようになり。

標準パレットもstyle属性あり。

  • アコーディオン（トグル）
  • タイムライン
  • FAQ
  • 見出しボックス
  • タブ見出しボックス
  • ラベルボックス

包括可能なボックスで、以下はstyle属性が付かない。

  • 白抜きボックス
  • タブボックス

●経緯
スキンで、タイムラインで独自スタイルを設定可能としており。
独自にget_block_editor_color_palette_cssと同じことをし、該当のクラスに色を反映している。

このとき、タイムラインを見た際、style属性が付与されており、不要と判断した。
しかしタイムラインを用いた過去の投稿を見た際、パレットカラーが反映されておらず、その違いに気付いた。

本件をクローズとします。

 

]]> Cocoonテーマに関する質問 大門未知子 https://wp-cocoon.com/community/cocoon-theme/%e6%a8%99%e6%ba%96%e3%82%ab%e3%83%a9%e3%83%bc%e9%81%b8%e6%8a%9e%e6%99%82%e3%81%aestyle%e5%b1%9e%e6%80%a7%e5%87%ba%e5%8a%9b%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/#post-88842 RE: 標準カラー選択時のstyle属性出力について https://wp-cocoon.com/community/cocoon-theme/%e6%a8%99%e6%ba%96%e3%82%ab%e3%83%a9%e3%83%bc%e9%81%b8%e6%8a%9e%e6%99%82%e3%81%aestyle%e5%b1%9e%e6%80%a7%e5%87%ba%e5%8a%9b%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/#post-88841 Wed, 27 May 2026 12:00:23 +0000 ご認識の通り、not-nested-styleクラスは過去の（style属性を持たない）ブロックとの後方互換性を保つために残されています。
現在も出力が必要な理由は、新規ブロックにこのクラスがないと、テーマCSS側の古いブロック用ルール（:not(.not-nested-style)）が誤ってマッチし、デザインが競合するためだったかと思います。

また、標準パレットでstyle属性が付かないブロックがある件ですが、これはテーマCSS側に:not(.not-nested-style)を使った旧仕様の分岐が存在するかどうかの違いです。

]]> Cocoonテーマに関する質問 わいひら https://wp-cocoon.com/community/cocoon-theme/%e6%a8%99%e6%ba%96%e3%82%ab%e3%83%a9%e3%83%bc%e9%81%b8%e6%8a%9e%e6%99%82%e3%81%aestyle%e5%b1%9e%e6%80%a7%e5%87%ba%e5%8a%9b%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/#post-88841 RE: 標準カラー選択時のstyle属性出力について https://wp-cocoon.com/community/cocoon-theme/%e6%a8%99%e6%ba%96%e3%82%ab%e3%83%a9%e3%83%bc%e9%81%b8%e6%8a%9e%e6%99%82%e3%81%aestyle%e5%b1%9e%e6%80%a7%e5%87%ba%e5%8a%9b%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/#post-88840 Wed, 27 May 2026 05:08:55 +0000 ●追記

標準パレットでもstyle属性が付かない、ブロックがあります。
違いは何？？以前議論した覚えがあり。

]]> Cocoonテーマに関する質問 大門未知子 https://wp-cocoon.com/community/cocoon-theme/%e6%a8%99%e6%ba%96%e3%82%ab%e3%83%a9%e3%83%bc%e9%81%b8%e6%8a%9e%e6%99%82%e3%81%aestyle%e5%b1%9e%e6%80%a7%e5%87%ba%e5%8a%9b%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/#post-88840 標準カラー選択時のstyle属性出力について https://wp-cocoon.com/community/cocoon-theme/%e6%a8%99%e6%ba%96%e3%82%ab%e3%83%a9%e3%83%bc%e9%81%b8%e6%8a%9e%e6%99%82%e3%81%aestyle%e5%b1%9e%e6%80%a7%e5%87%ba%e5%8a%9b%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/#post-88839 Wed, 27 May 2026 04:38:50 +0000 ----------------------------------------------
テーマ名：Cocoon
バージョン：2.9.2.15
カテゴリー数：16
タグ数：13
投稿数：722
固定ページ数：16
ユーザー数：1
----------------------------------------------

●設定
「タイムライン」ブロックを配置した。
このとき、ポイント色をパレットカラー赤色（標準カラー）とした。

<div class="wp-block-cocoon-blocks-timeline timeline-box cf block-box has-point-color has-red-point-color not-nested-style cocoon-block-timeline" style="--cocoon-custom-point-color:#e60033">
  <div class="timeline-title">タイムラインのタイトル</div>
  <ul class="timeline">
    <li class="wp-block-cocoon-blocks-timeline-item timeline-item cf">
      <div class="timeline-item-label">ラベル</div>
      <div class="timeline-item-content cf">
        <div class="timeline-item-title">パレットかラー赤色</div>
        <div class="timeline-item-snippet">
        </div>
      </div>
    </li>
  </ul>
</div>


また、一方はカスタムパレットで色を設定した。

<div class="wp-block-cocoon-blocks-timeline timeline-box cf block-box has-point-color not-nested-style cocoon-block-timeline" style="--cocoon-custom-point-color:#357768">
  <div class="timeline-title">タイムラインのタイトル</div>
  <ul class="timeline">
    <li class="wp-block-cocoon-blocks-timeline-item timeline-item cf">
      <div class="timeline-item-label">ラベル</div>
      <div class="timeline-item-content cf">
        <div class="timeline-item-title">カスタムカラー#357768</div>
        <div class="timeline-item-snippet">
        </div>
      </div>
    </li>
  </ul>
</div>

●過去の仕様との比較と確認したいこと

過去の投稿を確認して違いがあることに気付き。

過去のバージョンでは、標準パレットの選択時は style 属性（CSS変数）を出力せず、テーマ側のCSSを参照していたかと思います。

https://github.com/xserver-inc/cocoon/blob/9de3b38ce1b1f236ff12b449951028c651533a28/lib/gutenberg.php#L539-L541

現在の仕様では、標準・カスタム問わず style 属性が出力されるよう変更されていますが、「従来の（style属性を持たない）既存投稿ブロックとのデザイン互換性を保つために、not-nested-style クラスが残されている」 という認識であっていますか？

結果、同じブロックで包括された場合、直近にstyle属性が優先されるのでで、現在はnot-nested-styleクラスを参照（出力）する必要はないのではと思いました。

]]> Cocoonテーマに関する質問 大門未知子 https://wp-cocoon.com/community/cocoon-theme/%e6%a8%99%e6%ba%96%e3%82%ab%e3%83%a9%e3%83%bc%e9%81%b8%e6%8a%9e%e6%99%82%e3%81%aestyle%e5%b1%9e%e6%80%a7%e5%87%ba%e5%8a%9b%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/#post-88839