サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL:
相談内容:
不具合の発生手順:
解決のために試したこと:
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え(FAQ)
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw)
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
このフォーラムには初心者の方も多く参加されています。質問に不慣れな方も安心して相談できるよう、できるだけ穏やかな言葉でご案内いただけますと幸いです。
通知
すべてクリア
トピックスターター 2026年5月31日 09:15
対象ページ http://ccep-official.jp
吹き出しのボーダーの色を変更すると、吹き出し自体が枠線で囲まれるようになりました。
これまでの吹き出しも同様の現象が起こっています。
発生日時:2026年5月25日頃
わいひら reacted
2026年5月31日 11:25
●原因
WordPressのコアアップデートにより、/wp-includes/css/dist/block-library/style.css に以下のCSSブロックルールが追加されたことが原因です。
html :where([style*=border-color]) {
border-style: solid;
}
https://github.com/WordPress/WordPress/commit/ec445010208a60af54853c3bfba3675ca43f1c78
これにより、「吹き出し」ブロックで色設定(ボーダー色)に影響してしまう。
本来、ボーダー色を指定すると、ブロックの style 属性にCSS変数(--cocoon-custom-border-color)が付与され、要素内の特定のボーダー(.speech-balloon など)にのみ色が反映される設計となっている。
しかし、上記のWordPress側の共通ルール(:where([style*=border-color]))が、属性値に「border-color」という文字列を含むすべての要素にマッチしてしまう。
結果、「吹き出し」ブロックの親コンテナ自体に意図しない border-style: solid; が強制的に適用されてしまう。
吹き出しブロックは以下のHTML構成
<div class="wp-block-cocoon-blocks-balloon-ex-box-1 speech-wrap sb-id-1 sbs-stn sbp-l sbis-cb cf block-box not-nested-style cocoon-block-balloon" style="--cocoon-custom-border-color:#b14814">
<div class="speech-person">
<figure class="speech-icon">
<img decoding="async" src="https://example.com/wp-content/themes/cocoon-master/images/man.png" alt="" class="speech-icon-image">
</figure>
<div class="speech-name">
</div>
</div>
<div class="speech-balloon has-border-color">
</div>
</div>
わいひら reacted
2026年5月31日 15:30
●対策案
それぞれにborder:0;を追加し、親の枠線を無効とする。
「吹き出し」ブロック
https://github.com/xserver-inc/cocoon/blob/9de3b38ce1b1f236ff12b449951028c651533a28/style.css#L6973
「ボタン」ブロック
https://github.com/xserver-inc/cocoon/blob/9de3b38ce1b1f236ff12b449951028c651533a28/style.css#L4926
わいひら reacted
2026年5月31日 23:42
----------------------------------------------
テーマ名:Cocoon
バージョン:2.9.2.16
カテゴリー数:16
タグ数:13
投稿数:723
固定ページ数:16
ユーザー数:1
----------------------------------------------
対策されていることを確認しました。
2026年5月31日 23:45
ご連絡いただきありがとうございます。該当箇所を修正させていただきました。
------------------------------------------------
https://github.com/xserver-inc/cocoon
開発中の最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。
WordPressでの手動アップデート方法はこちら
https://wp-cocoon.com/manual-update-of-cocoon-theme/
------------------------------------------------
修正版は近日中にバージョンアップしたいと思います。
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。
(CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。





