Liquid、JavaScriptなどに関する質問
Debutテーマを利用して、現在会員登録ページを作成しています。
Debutでは会員登録した後デフォルトだとトップページに飛ばされますが(カートに商品がある場合はチェックアウトに飛ぶ)、そうではなくページ機能で作成した会員登録完了ページ(/pages/register_completed)にとばしたいと考えております。
そこで色々調べたところ、下のようなコードをtheme.liquidの</body>タグの上に置いたら良いとか、
<!-- Handle registration redirect --> <script> $(document).ready(function(){ var $returnTo = $('<input type="hidden" name="return_to" value="/pages/register_completed" />'); if ($('#create_customer').length > 0){ //if registration form $returnTo.insertBefore($('#create_customer input[type="submit"]')); // add return_to input } else if ($('#g-recaptcha').length){ //if captcha form $returnTo.insertBefore($('.shopify-challenge__container input[type="submit"]')); } }); </script>
https://heliumdev.com/blog/shopify-redirect-after-registration/
<script> (function() { var REDIRECT_PATH = '/pages/register_completed'; var selector = '#create_customer, form[action$="/account"][method="post"]', $form = document.querySelectorAll(selector)[0]; if ($form) { $redirect = document.createElement('input'); $redirect.setAttribute('name', 'return_to'); $redirect.setAttribute('type', 'hidden'); $redirect.value = REDIRECT_PATH; $form.appendChild($redirect); } })(); </script>
の方法が見つかりましたが、これらの方法では、確かに会員登録完了ページにリダイレクトしてくれますが、エラーがある時(項目を未入力、一度会員登録したことあるメアドで登録)であっても会員登録完了ページに遷移してしまいます。
エラーがある時は、会員登録ページに戻され、会員登録が成功したときだけ会員登録完了ページに飛ばす良い方法はないでしょうか?
解決済! ベストソリューションを見る。
成功
横から失礼します。
的外れでしたら申し訳ありませんが拝見していて思いついたことがありますので以下記載したいと思います。無理やりな方法ではありますが。
■案1
意図としましては以下のようになります。
■案2
案1を考えた際に少し方向が違う別案を思いつきましたのでそちらも一応記載します。趣旨によっては以下も検討できるのではと思います。
ページのタイトルやURLの名称と矛盾する状態になる可能性はありますが、JSのリダイレクトを使うよりはシンプルかもしれません。
以上ですが趣旨や状況を勘違いしていましたら申し訳ありません。
この共有されている方法は、Shopifyの会員登録の送信先の隠しパラメータ的なものを追加している方法で、会員登録エラー自体はShopifyそのものが行うので、テーマ側で処理分岐するのは難しいです。
(エラー時のreturn_urlのような隠しパラメータがあれば、それを設定すれば動作するかもですが、存在は把握していません)。
なので、少し挙動はいまいちになりますが、通常の遷移のままにしてエラーハンドリングはShopifyに任せて、通常の完了で遷移するページの先にJavaAScriptかヘッダなどでリダイレクトさせるのが良いかと思います。
@junichiokamura さんは書きました:この共有されている方法は、Shopifyの会員登録の送信先の隠しパラメータ的なものを追加している方法で、会員登録エラー自体はShopifyそのものが行うので、テーマ側で処理分岐するのは難しいです。
(エラー時のreturn_urlのような隠しパラメータがあれば、それを設定すれば動作するかもですが、存在は把握していません)。
なので、少し挙動はいまいちになりますが、通常の遷移のままにしてエラーハンドリングはShopifyに任せて、通常の完了で遷移するページの先にJavaAScriptかヘッダなどでリダイレクトさせるのが良いかと思います。
会員登録完了の通常の遷移先はトップページですね
そのページで「会員登録完了してから遷移してきた」ことを検知して、JS script でリダイレクトさせたいんですが、
どうやって検知するかちょっとわからなくて、
やり方をご存知でしょうか?
なるほど、確かにGETパラメータで何も出ないので、難しいですね。
少し違うアプローチですが、以下の動画で、storefront APIを使って会員登録を自作する方法を説明しています。
https://www.youtube.com/watch?v=xgPrMP48W-M&list=PLkR3LRtxAZfod8TvcsKU7IEWeAO5fhcOe&index=3
これを応用して、会員登録のPOST先を自作のURLにして、内部でAPIで会員登録して、別の画面に返すのはいかがでしょうか?(少々大がかりですが)
成功
横から失礼します。
的外れでしたら申し訳ありませんが拝見していて思いついたことがありますので以下記載したいと思います。無理やりな方法ではありますが。
■案1
意図としましては以下のようになります。
■案2
案1を考えた際に少し方向が違う別案を思いつきましたのでそちらも一応記載します。趣旨によっては以下も検討できるのではと思います。
ページのタイトルやURLの名称と矛盾する状態になる可能性はありますが、JSのリダイレクトを使うよりはシンプルかもしれません。
以上ですが趣旨や状況を勘違いしていましたら申し訳ありません。
確かに、Liquid でログイン済みかどうかを判定するのはいいアイディアですね!
他にも customer_id とかいくつか判定方法ありますが、unless customer がシンプルで良さそうです。
ありがとうございます!案1でやりたかったことができました!
リエンゲージメントの自動化で売り上げ向上へ!素敵なオンラインストアを作成し、見込み顧客の携帯へ広告を直接に送信する、またはSNSなどで宣伝すると、お客様がストアに行き着...
By Mirai Mar 24, 2024Shopifyは世界で最も革新的なブランドと起業家をサポートしています。個人起業家やあらゆる規模のビジネスの成長を後押しするために、Shopify アカデミーではShopif...
By SarahF_Shopify Mar 22, 2024オンラインストア運営はとてもやりがいのある活動です。新しい注文が入った時の喜びや世界中のお客様とやりとりできる可能性、商品に対して最高のレビューをもらった時の満足感は、毎日の...
By Mina Mar 13, 2024