条件によって変わるヘッダーでドロワーメニューの重なり順がおかしくなる件

日本語 ディスカッション 技術的なQ＆A

Topic summary

Dawn 13テーマで、商品ページのタグやパスに「ouchi」が含まれる場合にヘッダーを切り替える実装を行ったところ、切り替え後のヘッダーBでドロワーメニューの重なり順（z-index）に問題が発生しました。

問題の詳細:

  • ヘッダーBのドロワーメニューが商品やコレクションの後ろに表示される
  • ヘッダーAでは正常に最前面に表示される
  • 参考にした実装記事の追加ファイル（header-ouchi.liquidやheader-ouchi-group.json）に原因がある可能性を疑っている

解決方法:
ヘッダーのCustom CSSに以下を追加することで解決:

.section-header {
  position: static;
}

問題は解決済みです。

Summarized with AI on November 7. AI used: claude-sonnet-4-5-20250929.
1

テーマ「Dawn 13」
商品ページのタグやパスに「ouchi」が含まれている場合に通常のヘッダーAをヘッダーBに変えるようにしました。
そうしたところ、ヘッダーBでドロワーメニューの重なり順がおかしくなり、商品やコレクションの後ろに表示されるようになりました。
ヘッダーAのドロワーメニューの重なり順は一番前なので問題無く、ヘッダーBも同じようにしたいです。

ヘッダーを変える際に参考にしたのはこちらのサイトです。

https://neightbor.jp/blog/shopify-dawn-header

追加した「header-ouchi.liquid」か「header-ouchi-group.json」の中の記載に問題がある気がしますが原因がわかりません。
解決方法を教えていただきたいです。

2

ヘッダーのCustom CSSに以下の内容を追加することで解決しました。

.section-header {
position: static;
}