how-to-add-hcaptcha-to-a-wordpress-form_o

How to Add hCaptcha to WordPress Forms (reCAPTCHA alternative)

Do you want to add hCaptcha to WordPress forms?

Adding a Captcha or creating a hCaptcha form helps you fight spammers and protect your website from hackers.

In this article, we’ll show you how to add hCaptcha to WordPress forms, so you can keep your site safe.

Create Your WordPress Forms Now

What Is hCaptcha?

hCaptcha is a popular reCAPTCHA alternative. It is a free anti-spam tool that protects sites from bots, spam, and website attacks.

The term hCaptcha is derived from the popular term “CAPTCHA.”

CAPTCHA stands for Completely Automated Public Turing test to tell Computers and Humans Apart. The letter “H” in hCaptcha denoted humans.

what is hcaptcha

hCaptcha works similar to Google’s reCAPTCHA but is more focused on the user’s privacy. Their privacy policy is compatible with recent regulations such as GDPR and CCPA.

If you’re concerned about your site’s privacy and looking for a reCAPTCHA alternative, hCaptcha might be the right tool for you.

Why Add hCaptcha to Your WordPress Forms?

Let’s see some reasons that might help you decide if the hCaptcha service is a good fit for your website or not:

  • Setup Process: Creating and setting up hCaptcha account is super easy. We’ll see a complete hCaptcha sign-up process in our next step.
  • Better Privacy: Some site owners are more concerned about their site and user’s privacy. If you’re worried that Google’s reCAPTCHA might use your data, hCaptcha will be a better option for you.
  • More Effective: hCaptcha is proven to be more effective in stopping spam and bots. It offers several advanced features that can be used to save websites from being harmed by spam.
  • Get Paid for CAPTCHAs: hCaptcha pays a small reward every time your visitors solve challenges on your forms.
  • Freemium Service: hCaptcha includes both free and premium versions. The free version has plenty of features that you can use on your site forms; however, if you are looking for more advanced features such as custom challenges and time-based difficulty scheduling, you can go for the premium version.

How to Add hCaptcha to WordPress Forms?

Enabling captcha on WordPress forms requires prior knowledge of HTML, but the WPForms builder comes with in-built hCaptcha integration that allows you to add hCaptcha to your WordPress forms without writing a single line of code.

So let’s get started!

Step 1: Install the WPForms Plugin

The first thing you’ll need to do is to install and activate the WPForms plugin. If you’re new to WordPress or facing any difficulty during the plugin installation process, you can check the step-by-step guide on how to install a WordPress plugin.

Step 2: Select hCaptcha Type In WPForms

Now the second step is to select the hCaptcha type from WPForms’ settings.
To select the type, go to your WordPress dashboard and click WPForms » Settings.

WPForms Settings Tab

The WPForms settings page will open. Here you will see multiple tab options. Click CAPTCHA from the tabs across the top.

CAPTCHA tab of WPForms

On the captcha page, you will see 2 popular captcha services, hCaptcha, and reCAPTCHA. You’ll need to click on the hCaptcha icon.

add hCaptcha option

As soon as you click on the icon, you’ll see settings for hCaptcha on the bottom. Here you can see fields to add Site key and Secret Key to.

Site key and secret key option for hCaptcha type

Step 3: Generate hCaptcha Keys

To enable hCaptcha, first, we need to generate keys in the hCaptcha account and connect it with WPForms.

Open the hCaptcha site in a new tab and keep WPForms open in another tab.

Now to create a hCaptcha account, click the Sign-Up button at the top.

Signup hCaptcha

To use the free plan, click the button under Add hCaptcha to your service (free).

hCaptcha Plans

The signing-up process is relatively easy. You can sign up directly with Github, Google accounts or submits custom details.

Account sign up options for hCaptcha

Once your account is created, you’ll be redirected to your hCaptcha account. Here click the New Site button at the top right.

create new hCaptcha site

This will open a new page where you need to fill a form and enter site details. The first section you’ll see on the page is the Add New Sitekey section. If you’d like, you can add a name to this specific site key by clicking the pencil icon. But, again, this is only for your reference and optional, it’s not mandatory to fill out.

add new site key

Now the second section of the form is General Information. Here we need to add Hostnames, choose the difficulty level of the CAPTCHA, and set captchas filters based on audience interest.

general information for hCaptcha

Let’s discuss these 3 options in detail:

  • Hostnames: Here, we need to add your site URL or domain name that you’ll be activating hCaptcha on.

Add your site domain and click Add new domain button.

add site domain name

  • Captcha difficulty: This option allows you to set captcha difficulty levels within your forms. There are 4 levels Easy, Moderate, Difficult, and Always On; you can choose any level as per your requirements.

hCaptcha difficulty level option

Let’s share some information around hCaptcha difficulty level options; this will help you decide what to choose for your website:

  1. Easy: This option validates the user by displaying standard “easy” challenges that can be easily solved within a few seconds.
  2. Moderate: This option displays a bit more difficult challenges compared to Easy. It’s a more secure option, helps to check if the user is human or bot.
  3. Difficult: This will display more difficult challenge types than Easy or Moderate, which take a little longer to solve.
  4. Always On: This option forces every user to solve a ‘difficult’ CAPTCHA before submitting a form. However, this option might affect your website’s user experience but is the most secure method.
  • Filter captchas by audience interests: From this option. you can choose up to 3 different interests based on your website niche. This will filter out what type of content will be shown in your captchas. Let’s say you have a restaurant booking website, so you can choose the Food and drink option to filter your captchas.

option to set captcha filter

Once you’ve configured all form’s settings, don’t forget to click the SAVE button on the upper right corner of the page.

save all settings

This will redirect you to a site key’s settings page. Here you’ll find Captcha SiteKeys. Click the Settings button to view the site key.

setting button to view site keys

Once you click the Settings button, you can see the Sitekey for your website under the Sitekey section, copy your entire site key.

Sitekey section

Remember the WPForms tab we kept open? Next, we need to paste this key into WPForms.

Now copy the site key, open the WPForms tab and paste it into your WPForms settings under the Site Key setting.

Paste site key to WPForms

The next option you’ll see is Secret Key. We need to copy the Secret Key from your hCaptcha account as well.

The secret key is located in the settings tab of your hCaptcha account, so we need to close the site key settings page. Close it by clicking on the Save button.

hCaptcha secret key setting page

Now click the Settings tab. You’ll see your Secret Key at the top.

Secret key of hCaptcha account

Copy your secret key and paste it into WPForms.

add hCaptcha secret key to WPForms

Once you’ve added your keys, you can also adjust other hCaptcha settings underneath. Let’s explain these settings in detail.

  • Fail Message: From here, you can customize the message that is shown to your visitors if hCaptcha stops the form from being submitted.
  • No-Conflict Mode: This option stops the conflicts if caused by any other plugin or theme. There might be times that your website’s other plugins or themes try to load CAPTCHA code. If this happens, there might be an error. You can check the No-Conflict Mode checkbox to force disable any conflicting hCaptcha code to prevent any error.
  • Preview: This will show a preview of your hCaptcha on the front end. Once you’ve added both Site and Secret keys, click the Save button to see Preview of hCaptcha.

Note: If the things are not configured properly, this setting will show an error message, which means you should double-check if your keys are correctly entered into your settings.

Step 4: Create a Form

Now that we’re done with the settings, it’s time to enable hCaptcha on your form.

To do that, first, we need to create a new form using WPForms.

Go to WPForms » Add New to create a new form.

add new form

Here we’ll create a simple contact form.

On the setup screen, name your form and select the template you want to use. WPForms offers a number of pre-built form templates; you can choose any form template depending on your requirements and use it on your website.

We’ll choose the Simple Contact Form template.

choose simple contact form template

Once you click the template, you can see a simple contact form template on the right and a drag and drop builder on the left. From this builder, you can add additional fields to your contact form.

A simple contact form includes all the basic form requirements, i.e., Name, Email, and Comment or Message.

overview of simple contact form template

Step 5: Add hCaptcha Block to Form

Now that we have our form ready, we just need to add the hCaptcha field.

On the left, look under the Standard Fields section and click on the hCaptcha field.

add hCaptcha field to WordPress form

As soon as you click the hCaptcha field, a message will be displayed to confirm that you’ve turned on hCaptcha for this form. Click OK.

hCaptcha enabled confirmation message

Now to confirm, you’ll see the hCaptcha logo on the top-right of your form.

enable hCaptcha in WordPress form

Don’t worry; this logo is only displayed on the backend of the form and won’t show up on your published form. It is only to remind you that the hCaptcha is active on your form.

Click on the Save button to get everything settled.

Step 6: Test hCaptcha

The final step is to test to make sure that hCaptcha works properly with your contact form or not.

To test this out, open the contact form on your site’s front-end, fill your form entries and submit to check. For more details on how to test out your forms, please look at our complete testing checklist.

Note: Test the contact form in another browser or incognito window, where you haven’t logged in as an admin on your site.

Next Steps: Secure Your Online Forms

And you’re done! This is how you can help fight contact form spam with WPForms and hCaptcha without adding any code and HTML CSS. If you are looking for more ways to keep your online forms safe, do check out our article on 12 WordPress security tips and tricks for your online forms.

We hope this article helps you understand the complete process of enabling hCaptcha with WordPress forms. In a similar way, you can also add CAPTCHA in WordPress login and registration form using the WPForms builder.

You might also want to check out our post on how to create a file upload form in WordPress (easily).

Don’t forget, if you liked this article, then please follow us on Facebook and Twitter.

Using WordPress and want to get WPForms for free?

Enter the URL to your WordPress website to install.

Comments

  1. Thank you for the article, I’ve a question, I want to completely remove hCaptcha to reinstall fresh, how do I do it?

    I ask because ti not working any more I’ve removed but it seams to have left some code that no longer show the captcha in my form no even the recaptcha.

    thank you in advance

    1. Hey Beppe. We are sorry for any trouble. In order to make sure we answer your question as thoroughly as possible, could you please contact our team with some additional details about what you’re looking to do?

      If you have a WPForms license, you have access to our email support, so please submit a support ticket. Otherwise, we provide limited complimentary support in the WPForms Lite WordPress.org support forum.

      Thanks.

  2. Hello,
    I have completely setup hcaptcha for my website and hcaptcha work fine.but when I login to my hcaptcha dashboard they told me that they do not get verification request.

    They refer me to this :

    “Verify the User Response Server Side#”.

    Can you tell me how to resolve it?

    1. Hi there — Sorry to hear about that!

      To help you with more thorough insights! Would you mind reach out to our support with the issue you are facing with additional details? and they’ll be happy to assist 🙂

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

This form is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.