Customize registration page when form returns a verification request

dilphinkickme
Tourist
5 0 0

We are seeing that a high percentage of people who see "We have sent an email to XXXX please click the link included to verify your email address." notification on registration, do not see the notification. They are attempting to register several times and getting confused.

We will update the CSS to make the box more visible, but we'd also like to add copy to the page to explain better to the customer.

dilphinkickme_0-1624559148241.png

I don't see how to edit the copy in the box in the image above. 

We were thinking we could include an {% if %} in the template to output some additional copy when the form is in this state.

However, I can't find info on how to read the state of the form or what state the above would be.

Open to other approaches as well. 

Thanks!

 

Replies 4 (4)

Kyle_W
Shopify Expert
172 26 105

Hi @dilphinkickme!

You should be able to edit the copy for the error message in question by editing the language settings for your store's theme. You can find the language settings in the Shopify admin under Online Store > Themes > (current theme) > Actions > Edit languages. Most Shopify themes will store this error message in Checkout & system > Errors, but it might be easier to simply type in "verify email" in the 'Search translations' field to find the setting faster.

If you're willing to consider a paid app that would allow you to easily customize your store's registration form (including error messages), then I would suggest taking a look at Customer Fields.

Hopefully this helps!

Kyle W | Helium
Helium builds apps that thousands of merchants depend on:
- Customer Fields ✪✪✪✪✪ (300+ reviews)
- Meteor Mega Menu ✪✪✪✪✪ (200+ reviews)
dilphinkickme
Tourist
5 0 0

Thank you @Kyle_W. I appreciate you reaching out and teaching me a little about the Shopify interface and forms. I didn't know that section of the theme editor existed.

 

Do you know how to read that specific error in the liquid templates? 

 

The user is not reading the text, so we want to create our own <div> and copy to guide them better, but need to capture the form.error that is being used to generate that message.

In pseudo-code we would expect something like:

{% if form.error == 'verify_email' %}

<div> magic copy </div>

{% endif %}

 

Looks like the copy comes from "Errors" > "Verify email" in the template editor interface.

 

 

dilphinkickme
Tourist
5 0 0

Ah, looks like this solution is all we have based on the form.errors docs

 

{% if form.errors %}
{% for field in form.errors %}
   {% if form.errors.messages[field] contains "Email is invalid." %}
      Show something else...
   {% endif %}
  {% endfor %}
{% endif %}

 

Thank you @Mark11 

 

 

 

 

 

Kyle_W
Shopify Expert
172 26 105

You're most welcome, @dilphinkickme!

The solution you've referenced should allow you to add your own special message. Just make sure to use the proper string for the `contains` operator, like so:

{% if form.errors %}
  {% for field in form.errors %}
    {% if form.errors.messages[field] contains "verify" %}
      <div>Special message</div>
    {% endif %}
  {% endfor %}
{% endif %}

 

Kyle W | Helium
Helium builds apps that thousands of merchants depend on:
- Customer Fields ✪✪✪✪✪ (300+ reviews)
- Meteor Mega Menu ✪✪✪✪✪ (200+ reviews)