Forgot your password not working with custom code

Shopify Discussion

Topic summary

Issue: A custom Shopify create/login page had a “Forgot password” link that didn’t reveal the recovery flow.

Diagnosis: The link existed but wasn’t configured to display the password recovery section.

Fix implemented (in main-login.liquid):

  • Add CSS (before the endstyle tag) to control visibility via the :target selector:
    • Hide #recover by default; show #recover when targeted; hide #login when #recover is targeted.
    • Minor styling for #RecoverEmail and .form__message.recover-success, including responsive tweaks.
  • Insert a recover_customer_password form (id=“recover”) immediately after
    to render the recovery UI and include a cancel link back to login.

Outcome: The original poster confirmed the solution worked; the issue is resolved.

Notes:

  • Code snippets are central to the fix; the solution depends on CSS :target behavior and adding the Shopify recover_customer_password form.
  • A follow-up suggestion recommended the Customer Account Deluxe app for advanced account page features (order history UI, wishlist, social login).
Summarized with AI on December 14. AI used: gpt-5.
5

Hi @Alykhan101 ,
I’m really glad it worked :blush:

If you’re looking to add more advanced customizations to your account page, I recommend checking out our Customer Account Deluxe app. It offers a modern, customizable customer account page, which includes:

  • A sleek, user-friendly order history section
  • A wishlist feature for customers to save favorite items
  • Social login for quick and seamless access to accounts
  • And much more!

You can explore the app here: Customer Account Deluxe

Feel free to reach out if you have any more questions or need further assistance. Always happy to help!

Best,
Foladun | Customer Account Deluxe

1 Like