サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
このフォーラムには初心者の方も多く参加されています。質問に不慣れな方も安心して相談できるよう、できるだけ穏やかな言葉でご案内いただけますと幸いです。
通知
すべてクリア
トピックスターター 2026年3月13日 01:31
@yhira さん
恐れ入りますが、差し替え願います。
●現象
Cocoon 2.9.0.10でエラーとなり。
PHP Notice: 関数 WP_Styles::add が<strong>誤って</strong>呼び出されました。 ハンドル「hvn-h2-style」のスタイルは、未登録の依存関係とともにキューへ追加されました: cocoon-skin-style。 (このメッセージはバージョン 6.9.1 で追加されました)
●原因
2.9.0.9まで＜head>タグにスキンCSSを追加していた。
また、それ以外に.editor-styles-wrapper内にスキンCSSをインライン展開している。
2重定義となるため、Gutenbergエディターの場合、以下でcocoon-skin-styleの追加を止めた。
しかし、スキンはcocoon-skin-styleに依存し、独自CSSを追加している。
https://github.com/xserver-inc/cocoon/blob/master/skins/skin-made-in-heaven/lib/function.php#L89
結果、Gutenbergエディターのとき、cocoon-skin-styleがないため、エラーとなり。
●対策
過剰なため、依存を削除する。
わいひら reacted
2026年3月13日 22:08
重複解消のためお手数をおかけして大変申し訳ありません。
スキンをアップデートさせていただきました。
https://github.com/xserver-inc/cocoon/commit/00931d36be9c7b1e4505f1d8c4356da2cabd63de
トピックスターター 2026年4月9日 00:26
●次回アップデートによる仕様変更と新機能追加のお知らせ
次回のアップデートでスキンの更新は最後となります。
WordPress 7.0に対応した新機能の追加とともに、より直感的に操作できるよう、一部機能の仕様を大幅に改善いたします。
1. 「オートプレイ」設定を簡略化
これまで、ナビカードを横並びにしてコンテンツ上部に配置する必要があり「オートプレイ」設定は手順が複雑でした。
これを [Cocoon設定] → [おすすめカード] より簡単に設定可能とします。
2. 複数通知メッセージの設定を簡略化
これまでは通知エリアに複数のメッセージを表示させる際、[Cocoon設定] → [通知] のメッセージ欄へカンマ区切りで入力するか、ショートコード（pattern）を記述する必要がありました。
これを [外観] → [メニュー] で作成したメニューを「通知エリア」に割り当てるだけで、切り替え表示ができるようになります。
この投稿は2か月前 3回ずつ大門未知子に変更されました
わいひら reacted
トピックスターター 2026年5月24日 13:39
●次回アップデートによる改善点
１.ウィジェットのレスポンシブ対応
これまで「プロフィール」などのウィジェットは、設置されるウィジェットエリアの幅に応じて縦型・横型の表示を切り替える際、JavaScriptで幅を監視して専用クラス（nwa、wwa）を付与していた。
今回、このJavaScriptによる監視を廃止し、@containerを採用することで、CSSのみで完結するよう改善した。
2.入れ子のブロックのスタイル適用
独自にスタイルを設定できる「タイムライン」ブロックにおいて、これまではブロックを入れ子（ネスト）にすると親要素のスタイルが子要素にまで影響してしまう制約があった。
今回、@scopeがサポートされたことに伴い、スタイルの適用範囲を正確に指定できるようになり、入れ子状態でも意図した通りのスタイルを適用可能になった。
●今後
「トップへ戻るボタン」にページのスクロール量を表示しており、スクロール量の算出をJavaScriptで行っている。
ブラウザのanimation-timelineのサポート状況に合わせてJavaScriptを廃止し、CSSのみで完結する実装へと移行する予定。
この投稿は2週間前ずつ大門未知子に変更されました
わいひら reacted
トピックスターター 2026年5月25日 17:48
●目次ハイライト機能の改善について
現在の目次ハイライトは、スクロール位置（範囲）に該当の見出しがあるかどうかを判定して表示を切り替えている。
しかし、この方式ではスクロールイベントが発生するたびにチェック処理が走しる。
また、「アコーディオン」ブロックなどによって要素の高さが変わり、見出しの位置が変動した際には、その都度再計算を行って位置を求め直す必要がある。
これを IntersectionObserver を用いた実装に変更すれば、見出しが画面内に入ったかどうかを効率的に監視できるようになる。
ただし、この方法では「見出しの表示範囲（エリア）」自体を監視しているわけではないため、下から上へスクロールした際に、対応する目次が即座にハイライトされない可能性がある。
なお、将来的にはCSSの :target-currentがサポートされれば、JavaScriptを使わずにCSSだけでハイライトを実装できるようなる。
先述の「トップへ戻る」ボタンのスクロール量取得も含め、いずれはスクロールを伴うJavaScript処理を廃止し、CSSのみで完結する形へと移行する予定。
わいひら reacted
固定ページ 7 / 7
前へ
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。