Howdy新規会員登録アプリは、すべてのテーマで使えます。アプリ埋め込みブロック「会員登録/ログインフォーム表示」を有効にすると、どのテーマでも Shopify 標準のログインリンクを自動で検出し、クリック時にフォームを表示します。
この記事は、ブロックを有効にしてもフォームが表示されないテーマで、テーマのコード編集でフォームを設置する手順です。
コード編集が必要なため、エンジニア向けの記事になります。
※ご担当のエンジニアがいない場合は、弊社カスタマーサービスまでご連絡ください。弊社にて導入をサポートいたします。
Howdyカスタマーサービス:support@macro-micro.co.jp
まず最初に、会員登録フォームの設定を終わらせてください。
Shopify管理画面の「オンラインストア」→「カスタマイズ」から、テーマのカスタマイズ画面に移動します。
左の「埋め込みアプリ」で「会員登録/ログインフォーム表示」(Howdy New Customer)をオンにして、「保存」を押します。
コード編集後の動作を確認するため、会員登録フォームの表示タイミングを「ログイン前」にします。
アプリ管理画面の「一般設定」を開き、「会員登録フォームの設置タイミング」にある「新規会員登録フォームの設置」で「ログイン前」を選んで保存します。
「ログイン前」にするのは動作を確認するためです。確認が終わったら、運用する設定に戻して構いません。
Howdy新規会員登録アプリは、ログインボタンをクリックするとポップアップを開く仕組みです。ログインボタンの<a>タグなどに以下のclassを付けると、自動で検出されないテーマでもポップアップが開きます。
コード編集を行う箇所は2か所、PCのログインボタンとSPのログインボタンです。
PC・SPのログインボタンそれぞれに対応する<a>タグ等を探し、コード編集画面で下記のclassを追記します。
※コード編集の前に、いつでも元の状態に戻せるように、必ずテーマのコピーをお取りください。
以上で、自動で検出されないテーマにもHowdy新規会員登録アプリを設置できます。