Share on facebook
Share on google
Share on twitter
Share on linkedin
Share on pinterest
Share on email

How To Add WooCommerce Email Verification With a Free Plugin

 

For this tutorial, we will be showing you how to add WooCommerce email verification functionality to your WordPress website. We will be using this website that I have created, but this will work with any theme that is integrated with WooCommerce. WooCommerce is a plugin that allows you to sell products on your website. It also allows users to create an account to manage their details, payments, etc. So before going ahead, ensure you have WooCommerce installed.

You can do this by going to your plugins area, scroll down and find WooCommerce. If you do not have it installed, you can press ‘Add New‘, search for ‘WooCommerce‘, then press install and activate the plugin. However, it’s a good idea to find a theme that already has WooCommerce integrated, so the process of installing the user verification plugin will be much easier.

If you do have your theme set up with WooCommerce, you can go to ‘Pages‘ area and you should have a page called ‘My Account‘. Select ‘Edit‘ on the ‘My Account‘ page and you will be taken to another page where you can copy the permalink. Paste this link in an incognito browser (a browser where you are not logged in). Your page probably won’t look like this because you might be using another theme, but more or less you will have a login area where users can log into and a create account page.

 

Installing The WooCommerce User Email Verification Plugin

Now that we have checked if our ‘My Account‘ page is working, we can go to the ‘Plugins‘ area, press ‘Add New‘ and search for ‘User Email Verification‘. Or click here to visit their plugin page where you can download their plugin.

 

Woocommerce Email Verification Plugin Search

 

We will be installing the first plugin on the search result. Press ‘Install Now‘ and click ‘Activate‘. A few boxes will appear.

 

WooCommerce Email Verification Plugin

The first thing the plugin is notifying us with is that some web hosts limit the amount of emails that you can send out. Since people will be receiving a wooCommerce email confirmation when they sign up, if the email takes long or doesn’t send at all this will result in a bad user experience for people trying to sign up. So this is just advising us to consider using an SMTP solution like one of the following: Send13, Mandrill, SendGrid, SparkPost, or Amazon SES. You can also add an SMTP solution via a plugin which we will cover in a future tutorial. For now we can dismiss this note as the hosting service you are using will most likely have no issues sending out the emails.

The next thing the plugin is letting us know is that this company has taken over development, so if you need any help you can send them a support ticket.

Email Testing Notification

In this area, we can also test to see if emails are sending properly. This is important when someone signs up to your website and they receive a verification email. As you want to make sure it is being sent properly, so they can verify their email without any issues.

The next thing the plugin the plugin is notifying us about is that we have two users currently signed up that are not verified. What this plugin allows you to do is for any users that are currently not verified, you can send them an email, even after they have signed up, which we will demonstrate further down.

Lastly, the plugin developers are asking is to provide some non-sensitive information about your plugin use. This is so they can understand how users are interacting with their plugin and in turn helping them with development. If you want you can press yes and provide information, or you can press no for now and continue on.

 

Test Verification Email

Before we do anything else, to make sure the WooCommerce email verification function is working we need to make sure to test if our emails are working. So you can either press ‘Yes I want to test‘ here, or you can click on the ‘Test Verification Email‘ tab. You can always come back to this area to make sure the server is correctly sending out emails. So enter your email into the input field, press ‘Send Test Email‘ and just check your email inbox to see if you are receiving the email correctly.

 

Configuration Settings

So once you have confirmed that you have successfully received the test verification email, we can continue on with this plugin to configure the rest of the settings.

 

Email Template

The first tab is the ‘Email Template‘ where you are able to customise how the email will look. You have two options:

1. To use a custom header and footer for your email
2. To use the WooCommerce default email

Header Footer Customisation

If you are not sure how the default email looks for WooCommerce, you can go to the ‘WooCommerce‘ > ‘Settings‘ area in a new tab. Go to the ‘Emails‘ tab, scroll all the way down to ‘Email Template‘ and then press ‘Click here to preview your email template‘. This template has not been customised at all as there is no logo or title.

To add a header image to your email template, you can go to the ‘Media‘ > ‘Library‘ area and select the logo of your website for example. Copy the link of the WP Content file and paste it into the input field next to ‘Header image‘, which is under the ‘Emails‘ tab in the ‘WooCommerce‘ > ‘Settings‘ area. You can now press ‘Save Changes’ so when you view the email template again, you will see a logo on top in the header.

You can continue to make as many changes as you would like to your email template. Which will only show up when you select the option ‘No, use WooCommerce native Email Header, Footer and styling options.‘ under the ‘Email Template‘ Tab in the ‘WooCommerce Email Verification‘ Area. I would recommend choosing the second option where it uses the WooCommerce header email layout, so that all the emails your users receive will look similar and have a nice common style.

Separate Email for Verification

The next section asks us whether we want to have two separate emails or to combine both together. If you select ‘Yes‘ to have a separate email for verification your users will receive to emails. One – the welcome email that WooCommerce sends out by default anyway. And then two – a WooCommerce email confirmation asking users to confirm their email address. If you would like, you can select ‘No, include Verification Email Text in WooCommerce Welcome Email‘ this will combine both options together and send the WooCommerce email and in that email, a link will be provided for users to verify their account with.

My preference is to have the emails combined so users are not receiving two emails, which can get confusing for some. Simply, they will receive one email that says welcome with some details such as their username, account details, etc. And just below that, the plugin will add their own link for users to click on to verify their account.

If you want the option to combine the emails together, you will want to click on the second option ‘No, include Verification Email Text in WooCommerce Welcome Email‘ and a box will appear underneath with text that you can customise.

 

Woocommerce Email Verification Combine Emails

 

This is the text that will be added to the email saying ‘Please Verify your Email Account by clicking on the following link’ followed by a shortcode. The shortcode will give users their special unique link to verify their account, therefore you do not want to change this! However, the rest can be changed. For instance, you can say ‘Please verify your ‘your business name’ account by clicking on the following link’ and if you want to include any further information, you can add that here.

Short Codes

Underneath you will find a list of short codes. So if you add this short code for example {{xlwuev_user_login}} to the ‘Email Body‘, any user who receives the verification email will see their own login username specific to their account. So for example, below you can say ‘This is your username to log in with‘ and paste the short code.

However, the default WooCommerce email already displays their username so you would want to avoid repeating that. But you can have a look a look at some of these other short codes and use them however you would like.

 

You can use following merge tags in email body.
{{xlwuev_user_login}} = User Login Name for login
{{xlwuev_display_name}} = User Display Name
{{xlwuev_user_email}} = User Email
{{xlwuev_user_verification_link}} = Email Verification Link
{{wcemailverificationcode}} = Email Verification Link
{{sitename}} = Your Website Name
{{sitename_with_link}} = Your Website Name with link
{{xlwuev_verification_link_text}} = Shows the verification link text

 

Once you are happy with this you can press ‘Save Changes‘ and we can continue onto the next tab.

 

Verification Messages

Under the ‘Verification Messages‘ tab, you will find the different messages that will be displayed depending on what stage of the WooCommerce email verification process your user is in.

Verification Notice

So, the first message here in ‘Verification Notice‘ is the one that will appear just as the user creates their account. It says ‘We sent you a verification email. Check and verify your account.‘ along with a special link, which again, you don’t want to change.

You can leave this by default which is just fine, but I would recommend to specify somewhere that you should check both your inbox and spam inbox to find the WooCommerce email verification email. This is due to the fact that sometimes, email providers such as Google and Yahoo put emails into spam and this will be a problem when your user is trying to find their email to verify their account.

So including a short message in the email saying ‘We sent you a verification email. Check your inbox and spam folder to verify your account. Please be patient as the email sometimes may take longer than usual to deliver‘ will eliminate any confusion surrounding the location of the verification email.

Also, by specifying that the email may take longer than usual to deliver, this will reassure users that their verification email is definitely on its way. But may be just encountering a delay, which emails sometimes will depending on your hosting server.

 

Woocommerce Email Verification Message

 

You may also notice that there are some codes here where it says ‘<strong>‘ and ‘</strong>‘. This is to make the text in between bold, which will highlight that users should check for their email in their spam folder when signing up.

You simply just add this code ‘<strong>‘ before the text you want to make bold and add this code ‘</strong>‘ after. I also made the verification link bold, as well as underlining it using this code ‘<u>‘ before the text and this code ‘</u>‘ after. Or copy the the snippet from below.

 

We sent you a verification email. Check your <strong>inbox and spam folder</strong> to verify your account. Please be patient as the email sometimes may take longer then usual to deliver. <strong><u>{{xlwuev_resend_link}}</u></strong>

 

Verification Success Notice

The next message here just lets the user know their email is verified. You can leave this as default, or again you can edit it and say ‘Your (your business name) email is verified.‘ just to personalise the email a bit more.

Re-Verification Notice

Next is the message that will appear if the user clicks on the button to resend the email. So if the verification email is taking long to send, the user has the option to press a button to send the email again. This message will notify them that a new verification link has been sent to their email. Again, I recommend specifying here to check the spam inbox. You can say something along the lines of ‘A new verification link has been sent. Check your inbox and spam folder to verify your account.

You can use the snippet below to format your message:

 

A new verification link is sent. Check your <strong>inbox and spam folder</strong> to verify your account. <strong><u>{{xlwuev_resend_link}}</u></strong>

 

Notice for Verified Users

If a user has already verified their account but they try to click the link and verify again for any reason, this message will let the user know that their email is already verified.

Resend Confirmation Link Notice

This message is the text that a user will click to resend a confirmation email, thus will be hyperlinked (This is the term used to describe adding a link to a text). The message will contain a link that will trigger the system to send them another WooCommerce email verification email when clicked. It is recommended to leave this as the default.

Email Verification Link Notice

The final message is the text that will contain the hyperlink that triggers the system to send them the first verification email. Again, this I would recommend leaving as default. Or, you can personalise the message by adding your company name at the end, for example ‘Click here to verify your LeadingVa account’.

Once you have edited and made all your necessary changes, you can click ‘Save Changes‘ and continue to the next step!

 

Bulk WooCommerce Email Verification

The Bulk Verification tool allows you to verify as many users as you want in one go. So in ‘Select User Role‘ you can select the type of users you would like to verify. If you only want to verify the authors of your account, or the customers, subscribers, etc. You can select that here, click verify and then all the users under that specific user role will become verified.

Or, if you want to verify all the users you can click ‘Verify All‘ under ‘Verify All Users‘. However, be careful because you may not want to verify all your users as that will defeat the whole purpose of this WooCommerce email plugin. You want the users to verify themselves to prove that they are not spammers. So be cautious with this tool because if you verify all your users, you will have to un-verify them again manually. Which can be a long-winded process, especially if you have a lot of users.

Screen Options

To put this tool to test, we can go to the ‘Users‘ area in a new tab where you will be able to view all you users. The coloured dot under ‘Verification Status‘ will indicate if the user is verified or not changing from red to green depending on their verification status. If the ‘Verification Status‘ column green/dot is not showing up on your view, make sure to go up to ‘Screen Options‘ and then tick the ‘Verification Status‘.

 

woocommerce email verification bulk verify tool

 

All of the tick boxes give you different options, which you can play around with and customise depending on the key options you want to view for your specific users. For example, the ‘Manually Verify‘ check box will add a column to the user view table where you can verify users manually by just clicking the verify button next to their username. This is similar to the bulk verification tool, but you can verify individual users instead – which is really handy!

Let’s go back to the bulk verification tool. The specific users we want verify in this test are customers, so if we select customers and click verify. When we go back to the ‘Users‘ area and refresh the page, we will see that all the users are now verified and the verification status is green, which is perfect. We also have the option to un-verify the user from here. As well as send them an email if they haven’t completed the WooCommerce email verification process yet.

 

Woocommerce Email Verification Status

 

Misc Settings

The last tab is the Misc Settings, which are just some extra settings that you can configure to change how the WooCommerce email verification process will work. These setting can change how your WooCommerce email verification WordPress plugin functions, so make sure to continue reading.

Allow User

The first section ‘Allow User‘ is quite important. If you want your user to make sure their account is fully verified before they can access their ‘My Account’ area, or download your products, etc. Then you have to tick the first option ‘No, force users to verify the account before they can login‘.

Otherwise if you had the option below selected ‘Yes, allow user to login and show a notice for verification email‘, it will let the user log in, but prompt them to verify their account essentially allowing users to bypass WooCommerce email verification process. Allowing this may be an issue if you have free products that only verified users can download.

Selecting the second option will give users full access to their account and your free products, even if they haven’t verified their account. So in this case, you may want your user to be 100% verified before they can access anything to ensure they are not a spammer and are actually a legitimate user. I would recommend selecting the second option. When you change these options depending on your preference, you will have a different notice for each option.

 

Woocommerce Email Verification Force User Email Confirmation

Notice

As we have done previously, you can add some tags to the notice without changing the link. We can add some tags on either side of the link to make it bold and underlined, so the user will not miss it. You can replace the text with this snippet:

 

You need to verify your account before login. <strong><u>{{xlwuev_resend_link}}</u></strong>

 

Verification Success Page

The next option can direct a user to a specific page after they have verified their account. If your business has a system where when the verification process is complete they are sent to landing page that has an offer, or a thank you page, you can select the second option ‘Custom Page’. From the drop down menu, you can choose which page you want the user to be directed to.

Keeping the option on the default ‘WooCommerce My-Account Page‘ will redirect the user to their My-Account area. Which is more straight-forward and can prevent confusion when customers create an account.

Verification Error Page

For the next section, it’s similar to the verification page, but for when an error occurs. So if there is an error, you can have the user be redirected to a specific page saying something along the lines of ‘Sorry for the inconvenience, there was an error that took place.’. Or you can leave it on default to the ‘WooCommerce My-Account Page‘ and an error should pop-up there anyway.

Allow Automatic Login After Successful Verification

If you select no for this last option, when a user successfully verifies their account by going to their email and clicking on their special link, they will have to login one more time. For instance, if i go to my email and click on the link which will take me to the website, I do not get logged in straight away. I will have to enter my username and password one more time.

If you select yes, then when a user clicks their verification link, they will get logged into their account straight away. They will not be obligated to input their password and will have complete access of their account.

Keeping this option on no will ensure that users: know how to log in, have their username and password safely stored or remembered and will eliminate any login issues. Once you have decided which option suits your needs, you can press ‘Save Changes‘ and continue on.

 

Testing The Email Verification Plugin

The last step is to ensure everything is working perfectly. To do this we can open up a private window or an incognito window, depending on what browser you are using – they name may differentiate. Launching this private/incognito browser will just mean that we are not logged into our account.

Enter your website domain/myaccount and it should bring us to the page with an option to login or to create a new account.

Now we can pretend we are a customer and create an account by inputting an email and password. Once you have entered these details, you can click ‘Create an Account‘ and let it load up.

Now, we should see the message that we configured earlier in the settings stating ‘We sent you a verification email. Check your inbox and spam folder to verify your account. Please be patient as sometimes the email takes longer than usual to deliver.’

 

Woocommerce Email Verification Email Sent Message

 

As we can see, it is bold which is exactly what we were trying to achieve. The link is also bold and underlined, which is again, exactly what we wanted. The only downside is the plugin doesn’t apply a lot of styling so it looks quite plain. However, we have some code that you can add to your themes CSS settings. Which can dramatically improve the look of the text.

 

Customising CSS

You can do this by going to your site and click ‘Customise‘ at the top. Most themes allow you to add additional CSS to your settings and its usually found in the customise section. Most of the time there is a search bar at the top where you can type CSS.

 

Located Theme's CSS

 

Here is the button that we can press on my theme (If you need help finding it on your theme, you can ask your themes developer and he/she should help you out with that), ‘Set Code‘ and make some space for our new code to paste in:

 

/**
* Style Woocommerce messages
*/.woocommerce-info {
color: #3c763d;
background-color: #dff0d8;
border: 1px solid #d6e9c6;
margin: 20px 0px;
padding: 20px;
overflow: hidden;
margin-bottom: 20px !important;
text-align: left !important;
}/**
* Make link inside of Woocommerce message alert green
*/
.woocommerce-info a:link {
color: #3c763d;
}

 

Adding Custom CSS

 

Press ‘Save Changes‘ and ‘Publish‘. Now when you open up the incognito browser again and refresh the page, the look of our notification message will be new and improved. There is now a nice box surrounding the text with a green font and back ground. This will look a lot cleaner, more professional and will attract the eyes of your user.

 

Message Formatted

 

The option to resend the confirmation email if they haven’t received it is displayed and they can see that they need to check their inbox and spam folder.

 

Receiving Confirmation Email

All that needs to be done is to check for the confirmation email in our inbox, so head over to your inbox. If you are having trouble receiving the email. A possible problem could be that the email is either going into spam, taking long, or it’s not sending at all and sometimes this can be down to the email service that you are using.

I have found services like Gmail and Yahoo take a while to send emails and frequently, emails go into spam. I would recommend considering a service like ProtonMail. This is a completely secure encrypted email service provider where you choose what emails you want to put into spam. I also found that emails deliver a lot faster.

So once you have received the email in your inbox, you will see the WooCommerce welcome email. Also providing a link that they can go to sign in with and underneath the plugin has added its own little message below which reads ‘Please verify your email account by clicking on the following link’.

 

Logging into Your Account

So now you can copy the link address provided in the email and paste it into our private/incognito window. It should take you to a login page where it says ‘Your (business name) account is verified‘. This is because earlier, we chose to force the user to login once more when they verify their account.

After we login, we will be redirected to the ‘My-Account Page‘ of WooCommerce where we can access our account details, our orders, our addresses, etc. We will also be notified that our email has been verified. So now that the whole process is complete, the user will have a verified account. Obtaining access to exclusive elements to users, such as free products, etc.

Finally, if we go back to our ‘Users‘ area and refresh this page, we will see that our test user here is now verified with a green tick, which indicates the process was all done correctly.

Congratulations, the plugin is now completely setup! So when someone registers on your website, they will need to confirm their email by clicking the unique link. This will eliminate any problems regarding spam and you will be a 100% sure that all the emails which are verified on your ‘User‘ area are indeed legitimate users. Potentially being later added to an email list where you can send promotional content.

Need Extra Help?

If you need any help from designing a custom website to promoting your website visit our website: https://www.yourwebcreative.com/

Leave your comment

<

14 + twenty =

Share on facebook
Facebook
Share on google
Google+
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on pinterest
Pinterest
Share on email
Email

Stay
Updated

Join our newsletter to be notified whenever we post more exlusive content like this!