Wednesday, February 12, 2020

High Quality Google ReCaptcha Desktop & Mobile Locker

I was asked recently by a CPABuild member if I could build a Google ReCaptcha Content Locker. After having told them that @justi had already created one, they requested one with a bit more customization, so that's what I'm here to deliver. I hope it works well for you.


High Quality Google ReCaptcha Desktop & Mobile Locker

How do I start using this Content Locker design?
  • 1. Open the Visual Editor for Content Lockers
  • 2. Click "Create New" to create a new Content Locker, give it a name, and then click "Done"
  • 3. Click "Design Options > Pre-Made Designs"
  • 4. Choose "Google ReCaptcha"
  • 5. Click "Save" to save your design
How to customize this Content Locker?

With this Content Locker you're able to change the number of Offers to display, as well as the "Choose 1 offer or install 1 app below." text, and whether your Content Locker should be both vertically or horizontally centered.

To change the amount of Offers that are displayed: Click on "Offers", and adjust the "Number of Offers" value.
To change the enabled state of Automatic Google Translating: Click on "Google", and change the "Auto-Translate" option to "Enabled" or "Disabled". (Auto-Translating is disabled by default)
To change the "Choose 1 offer or install 1 app below." text: Click on "Design Your Content Locker", choose "Body > Offers", and change the text in the "Top Text" input.
To change the Horizontal alignment, click on "Custom CSS & JavaScript", choose "JavaScript", and set the variable "centerHorizontally" to "true" to align horizontally, and "false" to align to the left.
To change the Vertical alignment, click on "Custom CSS & JavaScript", choose "JavaScript", and set the variable "centerVertically" to "true" to align vertically, and "false" to align to at the top.

How do I use this Content Locker on my Landing Page?

If you're using CPABuild's Templates as your Landing Pages, visit the Global Links page, and click the "Edit" button next to each Template you want to use your new Content Locker on. Once you've pressed "Edit", just choose your new Mobile Locker and then press "Save".

If you're using custom Landing Pages, visit the Content Locker Code page, choose the Content Locker(s) you want to use, and then click "Generate Code". Follow the instructions depending on how you want to implement your Content Locker into your Landing Page.

No comments:

Post a Comment

Desktop + Mobile Detailed Locker

A CPABuild member showed me a Content Locker similar to this, so I figured I would re-create it with a few changes in hopes that some of you...