Cocoonフォーラム

サイト内検索
書き込みの前に以下の3点をご確認ください。
  1. 1つのトピックにつき1つの質問を書き込んでください
  2. 不具合・カスタマイズ対象ページのURLを提示高速化を無効にしてください
  3. 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。

不具合・カスタマイズ対象ページのURL:

相談内容:

不具合の発生手順:

解決のために試したこと:

※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:

※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。

環境情報の取得方法はこちら。
https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
https://wp-cocoon.com/theme-trouble/

フォーラム利用ガイドリンク

  1. フォーラムガイドライン
  2. よくある質問と答え(FAQ)
  3. サポート対象外のケース
  4. 原因不明の不具合用トラブルシューティング
  5. トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw
  6. 真っ白画面でのエラーメッセージの確認方法
  7. ブラウザ環境チェックツール
  8. Cocoonカスタマイズ依頼

フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。

固定ページをトップ表示時、子テーマの ...
 
共有:
通知
すべてクリア

[解決済] 固定ページをトップ表示時、子テーマの front-page.php でサイドバーが表示されない

5 投稿
2 ユーザー
3 Reactions
33 表示
(@higaking)
Active Member Registered
結合: 1日前
投稿: 3
トピックスターター  

いつもお世話になっております。現在、Cocoonテーマ(子テーマ利用)でサイトを構築しており、トップページのレイアウトで問題が発生しているため、ご助言いただけますと幸いです。

【実現したいこと】
サイトのトップページを、左側にメインコンテンツ、右側にサイドバーが表示される2カラムレイアウトにしたい。トップページにはWordPressの固定ページを指定しています。

【現在の状況】

  1. WordPress設定: 「設定」>「表示設定」で「ホームページの表示」を「固定ページ」に設定し、該当の固定ページを選択済み。

  2. Cocoon設定:

    • 「Cocoon設定」>「全体」タブにて、「サイドバーの位置」は「サイドバー右」、「サイドバーの表示状態」は「全てのページで表示する」に設定済み。

    • 「Cocoon設定」>「カラム」タブでは、特にレイアウトを変更する設定は見当たりませんでした(幅や余白の設定のみ)。

  3. 固定ページ設定: トップページに指定している固定ページの編集画面にて、「ページ設定」>「ページタイプ」は「デフォルト」を選択済み(他の選択肢に2カラム等がなかったため)。

  4. ウィジェット: 「外観」>「ウィジェット」の「サイドバー」ウィジェットエリアには、表示させたいウィジェット(カスタムHTML、最近のコメント等)を配置済みです。

  5. 子テーマの利用: 子テーマ cocoon-child を有効化して使用しています。

【問題点】
上記の設定を行っても、トップページにサイドバーが表示されません。 開発者ツールで確認したところ、HTMLソースコード上にサイドバー要素(<aside id="sidebar"> 等)自体が出力されていないように見えます。

【試したこと】
この問題を解決するために、以下の手順を試しました。

  1. 子テーマに front-page.php を作成: トップページ表示を制御するため、子テーマフォルダ (cocoon-child) に front-page.php を新規作成しました。

  2. front-page.php に基本コード記述:

    • get_header();, get_footer(); を記述。

    • メインコンテンツ部分とサイドバー部分を div などで区切り、サイドバー部分で dynamic_sidebar('sidebar'); を呼び出すように記述しました。

    • (当初 get_sidebar(); を試しましたが表示されず、sidebar.php を直接 require しても表示されませんでした。)

  3. シンプルなテスト: front-page.php の内容を、Cocoonのラッパー等をほぼ排除した非常にシンプルなHTML(floatで左右カラム分け)にし、dynamic_sidebar('sidebar'); を記述したところ、この場合はサイドバーエリアとウィジェット内容が表示されることを確認しました。

  4. get_header() / get_footer() を含めると表示不可: 上記3のシンプルなコードに get_header();  get_footer(); を追加すると、サイドバーが表示されなくなりました(メインコンテンツの下に回り込むのではなく、完全に表示されない)。

  5. sidebar.php の確認: 親テーマの sidebar.php には、トップページで出力を停止するような条件分岐はありませんでした。子テーマにコピーして is_active_sidebar() の条件分岐を削除しても、get_sidebar() で呼び出す形では表示されませんでした。

  6. functions.php の確認: 子テーマの functions.php には、サイドバー表示を制御するようなコードは見当たりませんでした。

  7. テンプレートファイルの上書き確認: 子テーマフォルダ内に page.php  tmp/page-contents.php など、レイアウトに関わりそうなファイルは存在しません。

  8. キャッシュクリア: ブラウザキャッシュ、WordPressキャッシュ(もしあれば)はクリア済みです。

【質問】

  • 固定ページをトップページに指定し、子テーマで front-page.php を使用する場合、サイドバーを正常に表示させるためには、他に確認すべき設定や注意点はありますでしょうか?

  • get_header()  get_footer() を読み込むとサイドバーが表示されなくなることから、Cocoonの基本CSSやJavaScriptが干渉している可能性は考えられますか? もしそうであれば、どのように対処すれば良いでしょうか?

  • あるいは、これはテーマの不具合である可能性はありますでしょうか?

【環境情報】

  • WordPressバージョン: WordPress 6.7.2

  • Cocoonバージョン:バージョン: 2.8.5.3

お忙しいところ恐縮ですが、何かアドバイスいただけると大変助かります。
よろしくお願いいたします。


このトピックは1日前からhigakingに変更されました

   
大門未知子
(@chu-ya)
Illustrious Member Registered
結合: 3年前
投稿: 3443
 

上記条件で確認しましたが、サイドバーは表示されました。
さんざん、弄りまわしていますが、このような現象は経験ありません。

●サイドバー(CSSクラスsidebar)が出力されず、メイン(CSSクラスmain)となるケース

サイドバーに表示するウィジェトが無い場合、サイドバーがなく、1カラムとなります。

https://github.com/xserver-inc/cocoon/commit/7e03e4ade3a4012da62de0b03862182d7134c785


●確認事項

Cocoon親テーマに切り替え。

  1. 図示のようにsidebarはありますか?(再確認)
  2. bodyタグにCSSクラスno-sidebarはありますか?
  3. サイドバー、サイドバースクロール追従に配置した、ウィジェットの設定で「チェック・入力したページで非表示にする」にチェックが入っていませんか?

   
higaking reacted
(@higaking)
Active Member Registered
結合: 1日前
投稿: 3
トピックスターター  

ご回答いただきありがとうございます。
以下のとおり、お答えいたします。

1:親テーマに切り替えたところ、サイドバーは表示がされました。
2:bodyタグにCSSクラスno-sidebarはありません。
3:ウィジェットの設定で「チェック・入力したページで非表示にする」にはチェックを入れておりません。

親テーマに切り替えるとサイドバーが表示されることが分かり、ヒントになりそうです。引き続き原因を探してみます。ありがとうございます。


   
大門未知子
(@chu-ya)
Illustrious Member Registered
結合: 3年前
投稿: 3443
 

@higaking さん

●補足

ウィジェットエリア「サイドバー」「サイドバースクロール追従」に表示、非表示に関わらず、ウィジェットを配置するとis_active_sidebar()がtrueを返却。
結果、ウィジェットが非表示であっても、空のサイドバーが表示されます。
この場合、ウィジェットが空か判定し、no-sidebarを付加し、CSSで非表示となるよう、上記のURLで対策しています。


BODYタグにCSSクラスno-sidebarがない、親テーマなら表示される、この状況から、functions.phpや、テンプレート自体を修正していないでしょうか??

https://github.com/xserver-inc/cocoon/blob/7f56755f36aa906db162843fb48ddcbba2d3c8ff/sidebar.php#L10


   
higaking reacted
(@higaking)
Active Member Registered
結合: 1日前
投稿: 3
トピックスターター  

@chu-ya 
大変お世話になっております。
ご指摘のとおり、functions.phpを修正していたことが原因でした。
コードを今一度細かく確認して修正したところ、無事にサイドバーが表示されました。
親テーマなら表示されたことが大きなヒントとなりました。本当にありがとうございました。


   
共有:

問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。

また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。

「いいね!」機能はフォーラム登録者のみが利用できる機能です。

CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。

フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。

最近の書き込みはこちら。

詳細なカスタマイズ依頼をするならこちら。

タイトルとURLをコピーしました