Mar 272014
 

Google Authenticator Security WordPress tutorial show you how to create a second level security for your WordPress website.

Last Updated: June 13, 2019

Latest News: I updated the details in the documentation.

In this post you will learn how to setup Google Authenticator plugin. Nowadays everyone is aware how importing it is to secure their website login. Adding a two factor login procedure is one way to make your site login more secure. 

The two-factor authentication requirement can be enabled on a per-user basis. You could enable it for your administrator account, but log in as usual for other less privileged accounts.

If you are serious about your website security then install this plugin and follow these simple instructions.

Google Authenticator 0.52 changelog.

  • Add a Dutch translation
  • Add a Portuguese translation

What You Need:

  1. Google Authenticator Plugin
  2. A Smart phone, iPhone or a Google account to use an app through the browser
  3. Google Authenticator App is one that I recommend.
  4. (Optional) You might like to read my other tutorial WordPress Two Factor Authentication Core Files

Google Authenticator Security WordPress

Step 1 ) Install the plugin and activate it as illustrated in the image below.

google authenticator-plugin-activated

Important Must Read First

Remember: Every person that has an account in your website should have this security feature enabled. It is up to you to encourage your members to set up this feature. (Note: This process might change in the future.)

Step 2 ) Go to Settings -> Google Authenticator as illustrated in the image below to set up the following options.

Google Authenticator Options

  • Two Screen Signing
  • Roles requiring Google Authenticator Enabled
  • Click on Save Changes button when you finish with your settings.

google-authenticator-admin-settings.

Step 3 ) Go to your user profile as illustrated in the image below. This allows you to activate the two step security.

google authenticator-your-profile

Step 4 ) The following image Google Authenticator Settings allows you to set up and activate the following options.

Google Authenticator Settings Options

  • Active
  • Relaxed mode to allow enough time to enter the code. 
  • For Description c= use a simple description.
  • Copy the Secret code, somewhere safe.
  • Click on Show/Hide QR code button.
  • You can enable Enable App password = However if you do this will decrease your overall login security.

Important: The activation is performed only once. After that the mobile app in your mobile phone or google account will provide you with your authenticating code.

google authenticator-plugin-settings

Step 4-a ) The following image shows you the QR code you need to scan with your mobile phone app. (Note: Make sure you have a valid QR scanner app installed in your mobile phone)

google authenticator-qr-code

Step 4-b ) Make sure you click on Update Profile button to save your settings as illustrated in the image below.

google authenticator-update-profile

Step 5 ) Log out from your account as illustrated in the image below.

google authenticator-log-out

Step 5-a ) If everything goes well you should see a second level of security field on your login screen as illustrated in the image below.

google authenticator-google-code

Google Authenticator Login Test

Step 6 ) It is a good idea to test your new login just in case something went wrong. To log back into your account, you will now need to enter your Username, Password and your Google Authenticator code as illustrated in the image below. The code is provided by the app you installed in your mobile phone.

Note: The Google Authenticator Code you see in the image below is just an example of the code you will need to enter when login in.

google authenticator-login-with-code

Step 7 ) This plugin also works in a Multisite installation. Make sure you network activate the plugin and then log in as the user for each sub site in your network. This allows you to activate the plugin for the user logged in.

Troubleshooting

Note: If you enter a space on your description or you use a tilde, a character with a stress on top or accent the QR will not work.

Q1 ) What if you forget the code or security code, lost your phone, accidentally deleted the App from your mobile phone?

Follow these instructions:

  • Ftp into your server, you can use Filezilla for windows.
  • Locate the plugin directory as illustrated in the image below and rename the folder.

google authenticator-troubleshoot

  • Check your login again and see if the extra security level field has been removed as illustrated in the image below.

google authenticator-basic-login

Q2 ) How do I show Google Authenticator to only users who have enabled the security in their profile?

Solution: You can also installed the following plugin Google Authenticator Per User Prompt.

Q3 ) How do I hide Google Authenticator from settings from users?

Solution:  You can check every user’s account profile. In their account profile you will see two options under Google Authentication Settings. Select Hide settings from user.

===================================

Alternative to Mobile Phone

Info ) If you don’t have a smart phone you can use some Google Extensions. The following is one that has very good reviews the-qrcode-generator.

===================================

That is how simple it is to set up a Two Level Authentication Security for your WordPress website.

If you have any questions please leave a message. I will be updating this tutorial from to time to time. So keep coming back for any latest updates.

Enjoy.

More WordPress Plugins Tutorials:

Manuel Ballesta Ruiz is a web developer, Blogger and WordPress Enthusiast.

  10 Responses to “Google Authenticator Security WordPress”

  1. Hi,
    Thanks for a great tutorial on Google Authenticator.
    I have read through and implemented the process that you outlined in your tutorial. I then updated my profile and saved my new settings as instructed. I then logged out and tried to log back in but couldn’t, as it was asking me to input the QR code but I couldn’t see the QR code. I then had to ask the administrator to re-set my log in. He also explain that i needed to click on the show/hide QR code during the setup stage. and also to scan the displayed QR code with my smart phone during the setup, and that this step is only done once before you update your profile. next time when I log back in it will ask me for the Google authenticator code, which i should get through my smart phone. I think that step 3 of the tutorial should be updated and include a step in there explaining that the scanning of the QR code is done once during the setup stage and that it will be the only time that you will see the QR code. because next time you log back in you will have the access code on the mobile phone, that is where i got confused as i automatically thought that the QR code will be visible every time you try to log in, which is not correct. anyway hope it makes sense what I am trying achieve as i think it would make it easier for a first timer like myself. Thank you. J.Romero

    • Hello Joaquin Romero, thank you for your comment.

      After reading your review and poiting out that more information needs to be added to step 3. I can see your point and will make some changes to better explain the whole procedure. It is always a good idea to take on what readers suggest as they are the ones that read my tutorials.

      Once again thank you for your review.

  2. Hi,
    Thank you for the change in your tutorial, I’ve had a browse and it looks great, that extra paragraph will really help.
    thank you.
    J.Romero

  3. Just adding some insights to this post if you’re having troubles adding new users once 2FA has been enabled.

    Step 1: Install the per user plugin

    Step 2: When adding a new user, note their password and also ensure ‘active’ is disabled under their profile for Google Authenticator

    Step 3: Login as that user and set up their Google Authenticator details (if you login as an admin you can’t set these settings on behalf of another user, well I couldn’t if the user was say an Editor)

    Step 4: Provide QR Code to that user along with their access details

    Step 5: User downloads Google Authenticator App and scans code before first access

    Step 6: User (should) changes password as you’ve previously copied down their password to set it up for them

    Step 3-6 you can ask the user to do but you know what they’ll do, they’ll leave 2FA switched off until they need it (which will be after they get hacked) :)

    Hope this helps peeps out there.

    Regards,

    Tim Sutherland
    68 Consulting

  4. Hi, Great post and steps, thanks! I have a membership site using Wishlist Member and for new users all I want is for them to login using 2FA and access the content – 2FA to prevent sharing one account among many would be paying subscribers.

    However, the setup of this seems to require a manual process for each new user.

    Do you know of any integrations or processes with WLM that can assist an automatic signup by the new subscriber? Rather than having the administrator go through each new user and setup sending them the Secret key or QR code?

    As well if you’ve come across a better way to prevent people from sharing logins (currently using Limit Login Attempts Reloaded & Prevent Concurrent logins).

    much appreciate any comments/suggestions.

    • Hi, thank you for your comment. Unfortunately I don’t know much about Wishlist Member “I assume this is a plugin”. I know of a plugin that automatically logs the members into the site after they successfully register as a member. Would this information help you?

      Kind regards

  5. So I activated the plugin and then stepped away from my computer and got signed out without the setup :(. What do I do now? I didn’t scan the QRcode or anything!

    • Hi Ru, did you enable the plugin for your WP User? For example, when you try to log in does it ask you for the authentication code? If it does and as you mentioned above, you did not scan the bar; then you need to carry out the troubleshooting steps found in this tutorial. Let me know how you go.

Leave a Reply to JOAQUIN ROMERO Cancel reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(required)

(required)