テーマ内のコード側で自由なリダイレクト先の設定を行うことができます。
例えば
・ボタンAから会員登録→独自ページXに遷移
・ボタンBから会員登録→独自ページYに遷移
など、そのページごと(ボタンごと)に会員登録後やログイン後の遷移先を指定することができます。
簡単にいうと
コード側でリダイレクト先を指定することで『ボタンごとに最終的な遷移先を変更することが可能』になります。
(ボタンごとに分ける必要がない場合、コーディング不要で「ログイン後のリダイレクト先」「会員登録のリダイレクト先」をアプリの「一般設定」から設定が可能です。)
ちょっと難しいので図解にしました。
具体的なコード指定はこのようになります。
後で解説しますが、ボタンごとに最終的な遷移先を変えることが可能です。
<button
class="howdy-register-original-trigger-btn"
data-login-redirect="/"
data-register-redirect="/pages/thanks"
data-already-loggedin="{{ routes.account_url }}"
>ボタン</button>例えば、このようなユースケースが想定できます。
キャンペーンページから、会員登録したお客様には会員登録後にクーポンコードが表示されている独自ページに移動させる
通常の会員登録サイト導線からは、プロフィールページに遷移させる。
という形でボタンによって、最終的な遷移先を変更することが可能になります。
例えば Liquid の {{ request.path }} などを使用して、ログイン後/会員登録後に現在のページに戻すことも可能です。
https://shopify.dev/docs/api/liquid/objects/request
特にカートページ上でログイン必須にしている場合で、カートページからのログインの際などに ログイン後/会員登録後 にカートページにユーザーを戻すなどが実現可能になります。
リダイレクト指定のURLにはパラメータもつけることができるため、ストア分析などにも役立てることができます。
一般設定画面で『コード側で指定』の選択して保存しましょう。
コード側の設定を行います。
(コード編集に慣れていない方は弊社でサポート可能ですので、お問い合わせください。 support@macro-micro.co.jp )
基本的には上記のコードの形式になります。
・ログインした後のリダイレクト先(data-login-redirect)
・会員登録した後のリダイレクト先(data-register-redirect)
・すでにログインしている顧客の遷移先(data-already-loggedin)
の3点を自由に編集することができます。
具体的に必要な手順は、こちらです。
① howdy-register-original-trigger-btn のクラスを付与
② data-login-redirect でログイン後のリダイレクト先を指定
③ data-register-redirect で会員登録後のリダイレクト先を指定
④ data-already-loggedin ですでにログインしているユーザーの遷移先を指定
ちなみに特にボタンがなかった部分に新規で作成する場合には
このように作成して良いのですが、例えばチェックアウトボタンなど既存ボタンに対して「ログイン必須実装」で適用する場合には、このように liquid でログイン済みかどうかを判断して、ログインしていなければ、独自ボタンを表示する実装がおすすめです。