Creating sign up or login popup or lightbox

Technical Q&A
1

Does anyone know How to show sign up/login page as pop up or lightbox?

Actually i do not want to loose my customer by clicking Register / Login abd redirecting to another page from product page. I want if a customer want to create a new account or login then he/she should able to sign up/ sign in in correct page (without being redirect ) as popup or lightbox.

{% unless settings.breadcrumb_styles == 'none' %}{% include 'breadcrumb' %}{% endunless %}

  

  

    
    

      

        ## {{'customer.register.title' | t }}
        

{{'customer.register.caption' | t }}

        {% form 'create_customer' %}

        {% if form.errors %}
        
          
          {{ form.errors | default_errors }}
        

        {% endif %}

        
          
          

            
            
          

          
          
            
            
          

          
          
            
          

          
        

        {% endform %}
        
        ##### {{'customer.register.benefits_title' | t }}
        
          - {{'customer.register.benefits_text_1' | t }}

          - {{'customer.register.benefits_text_2' | t }}

          - {{'customer.register.benefits_text_3' | t }}
        

      

    

    
    
      

        

          ## {{ 'customer.login.title' | t }}
          

{{ 'customer.login.welcome' | t }}

          {% form 'customer_login' %}
          

          {% if form.errors %}
          

            
            {{ form.errors | default_errors }}
          

          {% endif %}

          
            
            
          

          {% if form.password_needed %}
          
            
            
          

          {% endif %}
          
          
            

              {{ 'customer.login.forgot_password' | t }}
              {{ 'customer.login.cancel' | t }}
            

            
          

          {% endform %}

        

        

          ## {{ 'customer.recover_password.title' | t }}
          

{{ 'customer.recover_password.subtext' | t }}

          {% form 'recover_customer_password' %}

          {% if form.posted_successfully? %}
          {% assign reset_success = true %}
          {% endif %}

          {% if form.errors %}
          
            
            {{ form.errors | default_errors }}
          

          {% endif %}

          
            
            
          

          
            
            {{ 'customer.recover_password.cancel' | t }}
          

          {% endform %}
1 Like
2

honestly i am very new to shopify world! So i dont know what you meant by “inbuild solution”. All i know, customer should able to login or sign up in the same page without being redirect

1 Like
3

I’m looking to do the exact same things !
In 2021, this should be the only way to work

all major sites use it:

Capture.PNG
Capture.PNG1919×979 268 KB

4

I too looking for something similar. I found Admin REST API on ‘creating a customer’ https://shopify.dev/docs/admin-api/rest/reference/customers/customer#create-2021-04, and also Storefront API CustomerCreateInput https://shopify.dev/docs/storefront-api/reference/customers/customercreateinput. CustomerCreateInput looks more promising as it only requires email and password. Has anyone done sth similar?

5

@chenster

@Bilz636

@Pyxow

@Tecs4u

Hello Everyone!

My Shopify store is being developed right now. One of the features that we would like to have is a custom-made popup for customers to log in or register. We have a pop-up developed but it’s not working well. Our current pop-up doesn’t work when a customer wants to reset their password or if they put in the wrong password. Or if we direct a customer to a part of our store where they need to log in, such as a wishlist, or cart.

We would like customers to only use a pop-up for all log-in, registration, and password reset needs and completely abandon and not use Shopify’s generic Log In / Register page.

I know that Shopify has some limitations, so please let me know if this is possible to do.

I would appreciate that a lot!

Thank you so much!

6

You can create a custom section and copy the standard form. But if you want to use this form without being redirected to the login page (for example, if the login or password is incorrect, you will be redirected to /account/login), you must use the Storfront API. This api has the necessary mutations for login/create user/forgot password. I can help anyone with this issue. If you want to cooperate, write to alex.pavlyuk04@gmail.com