Dawnテーマでストアを構築中のユーザーが、ログイン画面に一文を追加したいが、該当ファイルが分からず困っている状況。Chrome検証ツールで調査したものの、初心者のため該当ファイルの記載を理解できていない。
解決方法:
その他の検索方法:
質問者は解決し、今後のファイル検索にも活用する予定。
ご覧いただき有難うございます。
現在Dawnにてストア構築中なのですが、ログイン画面をカスタマイズしたいと思っており
該当ファイルがどれなのかが分からず躓いている状況です。
変更内容はログインの下に一文追加のみ、コード編集で自身での対応が可能な領域かと
思うのですが、その一文を追加する元のファイルが分かりません。
お分かりの方がいらっしゃいましたらご教示いただければ幸いです。
また、このような場合は皆さんどのように該当ファイルを調査されているのでしょうか。
Chromeの検証ツールを使用してみているのですが、なにぶん初心者のため確認が甘いのか
該当ファイルの記載がイマイチ理解できていないようです。
お手数をおかけいたしますが、宜しくお願いいたします。
Dawn 12.0.0をお使いでしたら、
ログイン画面のLiquidファイルは下記です。
セクション > main-login.liquid
私の探し方が、参考になるか分かりませんが、念のため記載します。
対象のファイルにもよりますが
今回の場合ですと、
ログイン画面のtemplateは、
テンプレート > customers/login.json
であることが経験則から分かっているので、
customers/login.jsonを見ると、下記の記述があります。
{
"sections": {
"main": {
"type": "main-login",
"settings": {
"padding_top": 36,
"padding_bottom": 36
}
}
},
"order": [
"main"
]
}
sections.main.typeが、main-loginのですので、
セクション > main-login.liquid に、ログイン画面のコードが記載されていることが分かります。
他の探し方としては、
ログイン画面にアクセスし、この画面にしか存在しないであろうCSS Classに目星をつけます。
今回の場合ですと、
<div class="customer login
の、
customer login
が良さそうです。
あとは、「customer login」で、テーマファイル全体をgrep的な文字列検索をすれば、ファイルを突き止められるはずです。
例えば、githubのdawnのレポジトリで、「customer login」で検索すると下記のような結果が出ます。
https://github.com/search?q=repo%3AShopify%2Fdawn%20customer%20login&type=code
この結果を見ると、
sections/main-login.liquid
がログイン画面のコードが記載されたliquidであろうことが推し量れます。
ご参考まで。
(キュー田辺)
田辺さま
大変ご丁寧にご教示いただき有難うございました。
今後のファイル検索でも実行してみたいと思います！
おかげさまで今回の問題は解決出来そうです。
重ねて御礼申し上げます。