FROM CACHE - jp_header
このコミュニティはピアツーピアサポートに移行しました。Shopify サポートは今後、このコミュニティへのサービスを提供いたしません。これからもぜひ、他のマーチャントやパートナーとつながり、サポートし合い、経験を共有してください。 当社の行動規範に違反する行動や削除を希望するコンテンツがありましたら、引き続きご報告ください

サイトのログイン画面からパスワードが変更できません

解決済

サイトのログイン画面からパスワードが変更できません

tamari
Shopify Partner
15 0 3

お世話になります。

 

【前提】

・テンプレート「Debut」を使用。

・オンラインストアは会員限定としています。

 (Shopifyブログの手順で設定 https://www.shopify.com/jp/blog/shopify-members-only-store)

・他、アプリで「EasyLockdown Access Management」を使用し、特定商品を特定ユーザーにしか表示しないように設定中です。

 

【問題】

・ログイン画面にて、「パスワードをお忘れですか?」をクリックしても、パスワード発行ページが表示されない。

 

【ご相談】

パスワード画面を表示するための方法、また確認すべき点はございますでしょうか。

metaタグで「ログインしていなければなければ、ログインページ(account/login?checkout_url=/)を表示する」としている箇所を何らか変更で解決できるでしょうか。

ご助言いただけますと、大変助かります。

 

なお、「EasyLockdown」アプリで、ログインしていないユーザに対してパスワード変更のURLを許可しようとしましたが、効果はありませんでした。

 

よろしくお願いいたします。

1 件の受理された解決策

Qcoltd
Shopify Partner
1120 453 448

成功

私が確認した限りでの回答になりますので、誤りがあった場合はご容赦ください。

 

Debutのバージョンにもよりますが、

私が確認したDebut 17.13.0では、

「パスワード発行ページ」は、

ログインページと同一のページです。

 

ログインページの中に、

パスワード発行用のフォームが埋まっており、

「パスワードをお忘れですか?」をクリックすると、

JavaScriptがDOM(HTML)を書き換え、

ログインフォームを隠して、

パスワード発行フォームを表示します。

 

パスワード発行フォームのDOM(HTML)は下記のようでした。

「パスワードをお忘れですか?」をクリックすることで、id=RecoverPasswordFormのdivのclassからhideが削除され、パスワード発行フォームが表示される、

という仕掛けです。

      <div id="RecoverPasswordForm" class="hide">

        <div class="text-center">
          <h2 id="RecoverHeading">パスワードをリセットする</h2>
          <p>パスワードをリセットするためのメールを送ります。</p>
        </div>

        <div class="form-vertical">
          <form method="post" action="/account/recover" accept-charset="UTF-8" onsubmit="window.Shopify.recaptchaV3.addToken(this, &quot;recover_customer_password&quot;); return false;"><input type="hidden" name="form_type" value="recover_customer_password"><input type="hidden" name="utf8" value="✓">

            
            

            <label for="RecoverEmail">メールアドレス</label>
            <input type="email" value="" name="email" id="RecoverEmail" class="input-full" autocorrect="off" autocapitalize="off"><div class="text-center">
              <p>
                <input type="submit" class="btn" value="送信する">
              </p>

              <a href="#LoginHeading" id="HideRecoverPasswordLink">キャンセル</a>
            </div>
          </form>
        </div>

 

  • divのidが、RecoverPasswordFormから変わってしまっていないか
  • このDOM(HTML)に相当するものが、customers/login.liquidに存在するか
  • JavaScriptの処理を変更してしまっていないか
  • CSSを変更し、このDOM(HTML)が表示されないようにしてしまっていないか

 

などを確認されると良いかと思います。

 

あくまで、参考まで。

(キュー田辺)

 

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/

元の投稿で解決策を見る

2件の返信2

Qcoltd
Shopify Partner
1120 453 448

成功

私が確認した限りでの回答になりますので、誤りがあった場合はご容赦ください。

 

Debutのバージョンにもよりますが、

私が確認したDebut 17.13.0では、

「パスワード発行ページ」は、

ログインページと同一のページです。

 

ログインページの中に、

パスワード発行用のフォームが埋まっており、

「パスワードをお忘れですか?」をクリックすると、

JavaScriptがDOM(HTML)を書き換え、

ログインフォームを隠して、

パスワード発行フォームを表示します。

 

パスワード発行フォームのDOM(HTML)は下記のようでした。

「パスワードをお忘れですか?」をクリックすることで、id=RecoverPasswordFormのdivのclassからhideが削除され、パスワード発行フォームが表示される、

という仕掛けです。

      <div id="RecoverPasswordForm" class="hide">

        <div class="text-center">
          <h2 id="RecoverHeading">パスワードをリセットする</h2>
          <p>パスワードをリセットするためのメールを送ります。</p>
        </div>

        <div class="form-vertical">
          <form method="post" action="/account/recover" accept-charset="UTF-8" onsubmit="window.Shopify.recaptchaV3.addToken(this, &quot;recover_customer_password&quot;); return false;"><input type="hidden" name="form_type" value="recover_customer_password"><input type="hidden" name="utf8" value="✓">

            
            

            <label for="RecoverEmail">メールアドレス</label>
            <input type="email" value="" name="email" id="RecoverEmail" class="input-full" autocorrect="off" autocapitalize="off"><div class="text-center">
              <p>
                <input type="submit" class="btn" value="送信する">
              </p>

              <a href="#LoginHeading" id="HideRecoverPasswordLink">キャンセル</a>
            </div>
          </form>
        </div>

 

  • divのidが、RecoverPasswordFormから変わってしまっていないか
  • このDOM(HTML)に相当するものが、customers/login.liquidに存在するか
  • JavaScriptの処理を変更してしまっていないか
  • CSSを変更し、このDOM(HTML)が表示されないようにしてしまっていないか

 

などを確認されると良いかと思います。

 

あくまで、参考まで。

(キュー田辺)

 

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/
tamari
Shopify Partner
15 0 3

Qcoltd様

 

ご回答いただきありがとうございます。

ご回答いただいた内容をもとに、改めて見直しを行いました。

 

最終的にですが、「'theme.js」を修正することで、問題を解決しました。

今回この問題を解決するにあたり、インストールをしているアプリの制作者様にも問い合わせをしたところ、問題箇所の指摘をしていただきました。

(ご回答をいただいたアプリ側からは、「アプリ自体の問題ではない」ともご連絡いただいております)

 

アプリをインストールしていない状態のDebutでは問題なくパスワード設定画面が表示されるため、

複数アプリの設定を重ねたことで、なんらか競合による問題が発生したと考えております。

この辺りについては、今後再発がないよう検証をしたいと思います。

 

この度はご回答いただきまして、ありがとうございます。

JavaScript自体には編集をしていなかったたので、ご指摘いただいたことで改めて確認をすることができました。

とても助かりました!