PMC reCAPTCHA
This plugin handles the reCAPTCHA (Enterprise) integration for PMC sites. It was initially built to provide reCAPTCHA token generation (but not validation) for newsletter signup forms.
Features
- Provides theme settings for
- Toggling reCAPTCHA Enterprise on/off for the site.
- The reCAPTCHA Enterprise site key, which is managed in the pmc-analytical-data-mart Google Cloud project (opens in a new tab).
- Enqueues Google's reCAPTCHA JavaScript library on the frontend.
- Enqueues a JavaScript file that targets forms with
pmc-recaptcha-enterprise-formand handles token generation on submission. - Adds the reCAPTCHA target classname to Larva and non-larva form templates.
- Provides standard reCAPTCHA Enterprise legal terms.
What it doesn't do (future functionality)
- reCAPTCHA token validation. Token validation needs to occur on the system that is actually handling submission data, and newsletter signups (which this plugin was initially built to add reCAPTCHA to) are handled by Salesforce's Exact Target.
Newsletter signup integration
Intructions for setting up reCAPTCHA on a Exact Target newsletter signup form (with token validation on the Exact Target side) can be found on Confluence: Newsletter Signup reCAPTCHA Enterprise Integration (opens in a new tab).
How to add reCAPTCHA token generation to a form
-
Create a form in the relevant design system (Larva/Nova), if applicable.
-
Use the
Recaptchaclass to conditionally add thepmc-recaptcha-enterprise-formclass to the form element and enqueue the Google + PMC scripts. See thepmc_larva_o_email_capture_form_datafilter for an example.Recaptcha::add_non_larva_email_capture_form_data()is an example of a non-Larva form gaining the classname and enqueing assets. -
Append the reCAPTCHA terms to any existing form terms (such as PMC ToS/Privacy Policy).
Recaptcha::add_disclaimer_terms()can be used for Larva (just add the module name andc_tagline_termscomponent) andRecaptcha::add_non_larva_email_capture_form_disclaimer_terms()can be used as a non-Larva example. -
Ensure that reCAPTCHA Enterprise is enabled with a site key in the theme settings.
-
When the form is submitted, the reCAPTCHA JavaScript will automatically generate a token and add it as a hidden input to the form. No server-side code is needed for token generation. You can debug this with
assets/src/public/index.js. -
Validate the token on the server that handles form submission with a token assessment (opens in a new tab). If a WordPress plugin is doing this (meaning the actual action is for the WordPress site/database), a new handler method should be added to this plugin.
Building assets
- Enter the
assetsdirectory:cd assets - Select the correct version of Node:
nvm use - Install dependencies:
npm install - Start the taskrunner for development:
npm start - Build out the production-ready scripts before committing:
npm run build - See other commands for linting/etc:
npm run
Hooks
pmc_newsletter_recaptcha_enabled filter
Allows themes and plugins to switch reCAPTCHA Enterprise on and off. Defaults to false. This is the "opt-in" filter that makes the Admin::is_enterprise_enabled_for_newsletter() method work.