Setting Up Outbound Sending Via WP Mail SMTP In A Google Cloud Hosted WordPress Website

Is your WordPress website hosted under Google Cloud Platform? If it is, well, good luck! You’re up for a challenge.

Configuring your outbound sending to GCP to be honest is quite challenging.  Trying to make your WordPress Contact Form work is a bit tricky, but once you’ve manage to make it up and running, it is quite fulfilling. An extra points gained in setting up a feature under Google technology.

Google is very conscious when it comes to security, that is why all outbound connections are blocked.  Yup! You read it right.  As in blocked. So if you’re just going to rely in the built-in PHP Mailer of WordPress, it won’t work!  Why did they do that you may ask?  Well to avoid abuse which server-to-server SMTP are susceptible to.  This way, spam emails and data injections will be prevented.  The default SMTP port 25 is blocked on their end, which is why Google is suggesting to use their trusted third-party provider such as Mailgun, Mailjet, and SendGrid.  But in this Motley Tech. Guide, we didn’t use any of those.  Instead, we found two ways how to setup and send emails outbound without using the standard port 25.  Firstly, a requirement check! You need to have the plugin below.

For WordPress websites hosted under Google Cloud Platform, you MUST have this plugin:

• WP Mail SMTP (by WPForms) – For email sending

Have it installed and activated, and we’re ready to setup everything.  If you don’t have it yet, you can download it just by clicking “Add New” at the plugin page, then key-in and search for the plugin.

Let’s begin…

There are two ways to setup outbound sending with WP Mail SMTP securely:

1. via Gmail SMTP (with the use of Gmail API)
2. via Other SMTP (with the use of Transport Security Layer)

 

Via Gmail SMTP

Through Gmail SMTP, you need to have at least an email account setup under your company domain, e.g webadmin@yourdomain.com.  This is a requirement if you are about to setup an API credential and an OAuth consent screen.  Because Gmail SMTP setup requires you to provide a Client ID and Client Secret, for WP Mail SMTP plugin and Gmail API to talk to each other.

Enough talk.  Let’s do this.

1. Assuming WP Mail SMTP is activated, click “Settings“.
2. Once in the WP Mail SMTP page.  Look at the “From Email” field.  Make sure to provide an email address which emails are sent from.
3. Check the box “Force From Email“.
4. Look at the “From Name” field.  Make sure to provide the name which emails are sent from.
5. Check the box “Force From Name“.
6. At the “Mailer” selection, choose “Gmail“.
7. Check marked the box “Set the return-path to match the From Email“.
8. Scroll down to the Gmail section, and look for “Authorized Redirect URI” field.  Copy the value to a notepad.
9. Now, let’s leave the WP Mail SMTP settings for a while.  Make sure you’re logged in to your domain email account and then go to Gmail’s Application Registration.
10. Once in the Gmail API Registration, leave the default option “Create Project” from the dropdown selection. Click the “Continue” button.  
11. You’ll be prompted to a next screen that says “API is enabled“.  Click the “Go to Credentials” button to proceed.  
12. Now at the “Add credential to your project” screen, fill up the fields with the following values;
    1. In field “Which API are you using?“: Select “Gmail API“.
    2. In field “Where will you be calling the API from?“: Select “Web Server“.
    3. In field “What data will you be accessing?“: Select “User Data“.
13. Then click the button “What credentials do I need?” to proceed.  
14. You’ll be prompted to a page where you need to setup your Open Authentication also known as OAuth.  OAuth will provide permission for your website to use Gmail account to authenticate emails.  Now provide the following values to the following fields:
    1. “Name“, value is anything you’d like.  But we prefer the App Name you’ll be linking it with.
    2. “Authorized Javascript Origins“, value is the URL of your website (e.g. https://yourwebsite.com).
    3. Now go back to the notepad where we copied the Authorized Redirect value.  Copy and paste it at the “Authorized Redirect Value” field.
15. Click “Create Client ID” button.  
16. You will be prompted to a consent screen setup.  All you have to do here is to provide a “Product Name” that will be prompted to users, and verify the email address that will be use.  Click “Continue” button to proceed.
17. Now you manage to create a Gmail web application.  At the “Add credentials to your project” page, just click “I’ll do this later“.  You will be redirected to “Credentials” page where list of App OAuth IDs can be found.  
18. Now select the newly created app, and select “Edit“.
19. App details will show up.  Copy the “Client ID” and “Client Secret” values to a notepad.
20. Let’s go back to our WP Mail STMP plugin and go to Gmail section. Paste the “Client ID” and “Client Secret” values to its respective fields from the notepad.  
21. Click “Save Settings” button.  After saving, the page will refresh.   
22. At the “Authorize” section, click “Allow plugin to send email using your Google account” button to authorize the plugin.  This will open a login screen for Google.
23. Provide the credentials and login, then you will be redirected to screen asking for permission to send email. Just click “Allow” button to proceed.  You will be redirected again to WP Mail SMTP settings with a success message for linking the plugin.   
24. Now let’s check if the sending feature is working.  Click “Email Test“.     
25. At the “Test Email” page, just type in any email address (preferably another personal address email you own) in the given field and hit the “Send Email” button.  Should there be an error, there is an error notification that will be provided by the plugin pointing to the cause and what needs to be done.  If you manage to successfully send and received an email, then CONGRATULATIONS!

 

Via Other SMTP

So we’ve tackled how to setup our outbound sending functionality via Gmail SMTP. A bit complicated but perfectly secured to use.  This time we’ll use Other SMTP or our personal gmail account as SMTP to forward or send outbound emails.  Is this approach secured?  The answer is yes because it use TLS or Transport Layer Security that maximize data encryption and has its dedicated port which is port 587.  This approach is pretty simple and straight forward.  The example account that we will be using here is the free gmail account which obviously most of us have.  So let’s dive into it shall we?

1. Firstly, log in to your Gmail account.
2. Click your account profile icon, and click “Google Account” button.   
3. New tab and page will be opened.  At your Google Account page, click “Sign-in & Security“.   
4. At the “Sign-in & Security” page, scroll all the way down to “Apps with account access” section.   
5. Look for “Allow less secure apps” section, and switch it “On“.  Close the page.   
6. Now let’s go to our Gmail settings by clicking the “cog” or “gear” icon, then select “Settings“.
7. In your settings section, look and select “Forwarding and POP/IMAP“.   
8. Select the following options:  At the “POP Download” section, select “Enable POP for all mail“.  At the “IMAP Access” section, select “Enable IMAP“.
9. Scroll down a little, and click “Save Changes” button.  You’re done at the Gmail side.
10. Now let’s go and access our WordPress admin. account.  Hover to “plugins“, and then select “Installed Plugins“.
11. Look for “WP Mail SMTP” plugin.  We assume the this plugin is already activated so just click “Settings“.   
12. At the WP Mail SMTP settings, fill up the following fields:
    1. provide email for “From Mail“,
    2. check “Force From Mail“,
    3. provide name for “From Name“,
    4. check “Force From Name“.
    5. Lastly check “Set the return-path to match From Email“.
13. At the “Mailer” section, select “Other SMTP“.   
14. Upon selecting “Other SMTP”, a configuration form below will show up.  Provide the following values for the following fields:   
    1. “SMTP Host” field, value is “smtp.gmail.com“.
    2. “Encryption” field, select “TLS“.
    3. “SMTP Port” field, value is “587“.
    4. “Authentication“, turn it “on“.
15. Upon turning on  the “Authentication”, a SMTP credential fields will show below.  Provide the following values to the following fields:
    1. “SMTP Username“, value is your gmail email address.
    2. “SMTP Password“, value is your password to your gmail account.
16. Once done, click the “Save Settings” button.     
17. Now to test if your configuration is working properly, scroll to the top most part of WP Mail SMTP plugin and click “Email Test“.  Just type in any email address (preferably another personal address email you own) in the given field and hit the “Send Email” button.  Should there be an error, there is an error notification that will be provided by the plugin pointing to the cause and what needs to be done.  If you manage to successfully send and received an email, then CONGRATULATIONS!

So we’ve have managed to successfully setup our sending feature of our  WordPress website hosted under Google Cloud Platform in two says which both are secured. One approach use Gmail API, and the other approach use personal gmail account that maximize TLS (Transport Layer Security) for email encryption.  Both are a bit tedious at first but once you get use to it, it will be easy peasy lemon squeezy.