Customer Registration form using specific email domain

[JonathanReeves]

Hello,

I am working on a website for a client that wants the contents of their store hidden behind a login page if the user doesn't already have an account setup and is logged in. They want a particular email domain to be used for customers to create an account with. I am not at liberty to discuss who the store is for or the email to be used but I can explain the concept using generic terms.

Customer has a specific email: j.reeves@myspecificemail.com the myspecificemail.com part is what I want to make a check for on the customer registration form. I need to make sure that the email that is typed into that input field matches with that email domain so that only customers with that can login. I am having trouble figuring out the logic for this. I thought about writing a JavaScript file with a custom Regex function that checks that input field against the regex and if it matches allow the account to be created and if not send an error message: 'Please check your email address and try again." or something to that effect. I then tried to use Liquid to handle the logic by using a domain variable and checking against that parsing out the input string on the @ sign to see if I could check the email domain with my domain variable and if they match allow the account to be created. I wasn't sure what would be the easiest approach and was hoping for some resources on the topic to learn a bit more and if anyone had any tips or suggestions on what avenue to take. 

Thanks,

Jonathan

[gr_trading]

Hi @JonathanReeves ,

Yes, you are heading in right way. The best and easy way to impliment this. Regex expression on signup form.

Also tag users with particular domain name. So that even user logged in with other domain will not able to view products.

[JonathanReeves]

@gr_trading Thank you. Do you have any references on how to import the script into the liquid file? I am still fairly new to Shopify and the Liquid template engine so I am hoping to find some references on that. 

When it comes to tagging users can you send me a link to some articles explaining how to do that?

[Brett_Helium · Accepted solution]

Hi Jonathon! You can actually do this by adding some HTML attributes directly to the form code.

You will want to find the specific input field in your code. Mine is in the main-register.liquid file, and simply add pattern="regex" and title="error message" attributes. Here's an example that I made in the dawn theme:

<input
        type="email"
        name="customer[email]"
        id="RegisterForm-email"
        pattern="(?:.+)(?:@heliumdev\.com)"
        title="Only Heliumdev users can register"
        {% if form.email %}
          value="{{ form.email }}"
        {% endif %}
        spellcheck="false"
        autocapitalize="off"
        autocomplete="email"
        aria-required="true"
        {% if form.errors contains 'email' %}
          aria-invalid="true"
          aria-describedby="RegisterForm-email-error"
        {% endif %}
        placeholder="{{ 'customer.register.email' | t }}"
      >

 Note: You may also need to find the Liquid {% form %} tag and remove novalidate: 'novalidate'

An alternative option would be to use an app like Helium Customer Fields which allows you to create a totally custom registration form without any coding, including validation rules such as only allowing specific email domains.

Hopefully that helps you out, feel free to let me know if you have any questions about this or our app!

[JonathanReeves]

Thank you. I am going to use this and if the company I am building the store for decides that it's not enough and they want more will definitely be up for looking into adding the Helium app. Thank you.