ヘッダーのグローバルメニューとアナウンスバーをページごとに変更したい。

AI-generated summary

Motionテーマで、トップページとオンラインショップでヘッダーのグローバルメニューとアナウンスバーをページごとに切り替えたい。

試行内容: theme.liquidの「section ‘header’」を条件分岐に変更。template == ‘index’ と page.handle == ‘shop_lp’ で、header / header-shop / header-for-other-pages を呼び分ける構成を実装。

発生した問題: header-for-other-pagesでエラー。回答者から、header-for-other-pages.liquidファイルの有無と具体的なエラー内容の確認が提案された。

現状の対応: 該当箇所を既存の『header』に戻すと表示は可能に。しかし、ページごとのヘッダーのグローバルメニュー/アナウンスバー切り替えは未達成。

技術補足: Liquidのsectionは対応する .liquid ファイルが必要。templateはページテンプレート、page.handleはページ固有の識別子で条件分岐に利用。

結論・次のアクション: 具体的な実装方法は未提示で未解決。ページ単位でヘッダーとアナウンスバーを変更する方法の提案を求めている。

有料テーマMotionにて、コーポレートサイト内にオンラインショップを開いています。

そのためトップページとオンラインショップで表示するグローバルメニューとアナウンスバーを変更したいと考えています。

英語のコミュニティで解決しそうなものをみつけ実装しましたが、うまくいきませんでした。

https://community.shopify.com/post/509127

theme.liquid内の {%- section ‘header’ -%} を

{% if template == ‘index’ %}
{%- section ‘header’ -%}
{% elsif page.handle == ‘shop_lp’ %}
{%- section ‘header-shop’ -%}
{% else %}
{% section ‘header-for-other-pages’ %}
{% endif %}

に書き換えました。

shop_lp(オンラインショップのページ名)

header-shop(オンラインショップ用のヘッダー名)

header-for-other-pagesに関しましてはエラーが出てしまいます。

こちらのコードに不備があるのか、またほかに解決方法があればご教示いただきたいです。

何卒よろしくお願いいたします。

Yuzuyuさま

いただいている形で実装可能かと存じますが、header-for-other-pages.liquidというファイルは作成されていますでしょうか?

またエラーとはどういったでエラーでしょうか?

お手数ですが確認いただけますと幸いです。

お返事ありがとうございます。

header-for-other-pages.liquidというファイルがなかったので、

{% section ‘header-for-other-pages’ %}内をheaderに変更したところうまく実装できました。

しかし私の行いたい「ヘッダーのグローバルメニューとアナウンスバーをページごとに変更」することがこちらの方法では実装できませんでした。

「ヘッダーのグローバルメニューとアナウンスバーをページごとに変更」する方法があればご教示いただきたいです。