FROM CACHE - jp_header

テーマ「Brooklyn」のヘッダーに言語セレクターを設置したい

G_A_A
観光客
7 1 0

実現したいこと

・テーマ「Brooklyn」のヘッダーに言語セレクターをシンプルに設置したい

 

問題

・参考記事通りにうまいこといかない。(テーマ「Brooklyn」用の参考記事ではない)

・ヘッダーメニュー箇所にコードを埋め込むと、何故かハンバーガーメニューに変わってしまう。原因が知りたい。

・Brooklynに強い人がいましたらご回答お願いします。

 

Brooklynテーマのカスタマイズではデフォルトでヘッダーには言語セレクターのチェックボックスが存在しない。

なので、

参考記事の通りに以下試しました。

 

・スニペットフォルダにて新規ファイルの作成

・新規ファイルにHTML、JSコード記載

header.liquid内のschemaにて設定箇所を設ける

・header.liquid内にヘッダーメニューにコード設置

 

順番に(参考記事通りに)

・スニペットフォルダにて新規ファイル「lang-switch.liquid」を作成

G_A_A_0-1712713578328.png

 

・新規ファイルにHTML、JSコード記載

<HTML>

G_A_A_1-1712713923489.pngG_A_A_2-1712713956669.png

<JS>

G_A_A_3-1712713988312.pngG_A_A_4-1712714007455.png

 

header.liquid内のschemaにて設定

G_A_A_6-1712714158792.png

 

・header.liquid内にヘッダーメニューにコード設置

G_A_A_7-1712714429521.png

 

 

カスタマイズの設定箇所には表示されています。

G_A_A_8-1712714553089.png

 

ヘッダーメニューが勝手にハンバーガーメニューになってしまいます。

header.liquid」のヘッダーメニュー内に記述したコードがおかしいのでしょうか?

G_A_A_13-1712715771498.png

 

あとエラー出ています

G_A_A_10-1712714789534.png

Google翻訳「英語の Liquid エラー (スニペット/lang-switch 行 19): アセット スニペット/icon-caret.liquid が見つかりませんでした」

 

「lang-switch.liquid」の19行目

G_A_A_11-1712714868987.png

テーマが違うから「icon-caret.liquid」 が見つかるはずもなく・・・

※テーマ「Dawn」ならそのファイルがあるの確認できました。

 

参考にした記事内容も

そして、header.liquid内の<div class="header__icons">の最後の子要素に、以下のコードを追加します。

と記載しており、icon-caret.liquidがある前提の設置方法みたいです。

 

テーマ「Dawn」から「icon-caret.liquid」ファイルを新規スニペットにてファイルコピペで作ってみました。

G_A_A_12-1712715700809.png

 

これは・・・CSSで調整したら問題解決な気がしますが。。。

 

他の記事も試してみたんですが同じく、

ヘッダーメニューに追加しようとすると、勝手にハンバーガーメニューになりました。

 

ヘッダーメニューのコードです。

G_A_A_0-1712717633504.pngG_A_A_1-1712717683149.pngG_A_A_2-1712717734662.png

・312行目、カートの後ろに言語セレクターを設置したい

・言語セレクターを設置コードを追加すると何故かハンバーガーメニューになる。その原因もわかりません。

・Brooklynに強い人がいましたらご回答お願いします。

 

別にこの方法じゃなくても、言語セレクターをヘッダーに設置できたらいいので、

もし他の方法があればご教示よろしくお願いいたします。

0件の返信0