商品情報にスキップ
1 1
公開日:2024.03.16

Shopifyのテーマ「Dawn」のモバイル用ハンバーガーメニューで メニューリスト下のスペースに任意のHTMLを表示する設定例

Shopifyのテーマ「Dawn」のモバイル用ハンバーガーメニューで メニューリスト下のスペースに任意のHTMLを表示する設定例

用途

  • メニュー編集
詳細を表示する

Shopifyのテーマ「Dawn」のモバイル用ハンバーガーメニューですが、メニューリスト下のスペースに何かしら表示しようと思っても追加可能なブロック要素などがありません。そこで、カスタマイズされたLiquidセクションとJavascriptを使って任意のHTMLを表示するための設定例です。


テーマ「Dawn」のモバイル用ハンバーガーメニューでメニューリスト下のスペースに任意のHTMLを表示する設定例(テーマエディタのカスタマイズされたLiquidで行う場合)


【設定方法①】ヘッダーグループに「カスタマイズされたLiquid」セクションを追加しコードを挿入


【設定方法②】メニューリストの前に表示する場合はコードの一部を書き換える


ご購入(すべて¥0です)いただくと、サンプルコードをご覧いただけるようになります。

すでにご購入済みの方はこちらからログインしてください。

サンプルコード

動作検証済テーマ:Dawn/Rise 15.2.0

ヘッダーグループに「カスタマイズされたLiquid」セクションを追加しコードを挿入

関連ポスト