• Skip to main content

Victor Font Consulting Group, LLC

The DEX Intranet Specialists

Call Us:

+1 919-604-5828

  • Home
  • Care Plans
    • Care Articles
    • Optional Subscriptions
  • Consultations
  • Products
    • Code Snippets
    • Public GitHub Repositories
    • Gist Snippets
    • Pastebin Snippets (Free)
    • Free Plugins
  • FAQs
  • Support
    • Graphic Design
  • Contact
    • Speakers
    • Portfolio
  • Resources
    • Free WordPress Video Training
    • Tutorials
    • Articles
    • Cybersecurity
    • EU Referral Network
You are here: Home / Code Snippet / Resize Google reCAPTCHA for Mobile in Formidable Forms

Resize Google reCAPTCHA for Mobile in Formidable Forms

By Victor M. Font Jr.
July 26, 20182 Comments

Did you ever build a Formidable Form using the reCAPTCHA and then test it on mobile devices? Of course you have! The reCAPTCHA doesn't fit and extends over the edges of the forms. This is because the reCAPTCHA is set in an iFrame with a width that can exceed the width of its field container. When that situation occurs, there is a fix!

The following code snippets, when added to your theme, will resize the reCAPTCHA's iFrame to fit properly on mobile devices.

Add this CSS to your theme's style.css or add it to the WordPress Customizer/Additional CSS section:

Change the #frm_field_xxx_container to your form's reCAPTCHA container at line 9 in the below jQuery and add it all to the After Fields section of the forms Settings/Customize HTML page:

  • 6shares
  • Facebook4
  • Twitter1
  • Pinterest0
  • LinkedIn1
  • Print
  • SMS0

About Victor M. Font Jr.

Victor M. Font Jr. is an award winning author, entrepreneur, and Senior IT Executive. A Founding Board Member of the North Carolina Executive Roundtable, he has served on the Board of Advisors, of the North Carolina Technology Association, the International Institute of Business Analysis, Association of Information Technology Professionals, Toastmasters International, and the North Carolina Commission for Mental Health, Developmental Disabilities, and Substance Abuse Services. He is author of several books including The Ultimate Guide to the SDLC and Winning With WordPress Basics, and Cybersecurity.

Reader Interactions

VictorFont.com runs on the Genesis Framework

Genesis FrameworkThe Genesis Framework empowers you to quickly and easily build incredible websites with WordPress. Genesis provides the secure and search-engine-optimized foundation that takes WordPress to places you never thought it could go.

Check out the incredible features and the selection of designs. It's that simple—start using Genesis now!

Click here to download The Genesis Guide for Absolute Beginners (PDF - 1.4 MB)

Leave a Reply Cancel reply

Your email address and website will not be published. Required fields are marked *
Posting a comment means that you agree with and accept our Comment & Product Review Policy

Comments

  1. Adam Helman

    January 31, 2019 at 7:03 am

    Hi Victor – scrap that last question – I finally found it :-)

    I now see you meant you need to replace the xxx in ‘#frm_field_xxx_container’ with the recaptcha’s field’s ID.

    :-)

    Reply
  2. Adam Helman

    January 31, 2019 at 6:59 am

    Hi Victor,

    Thank you – just what I’m after, but I’m a little unclear when you say “Change the #frm_field_xxx_container to your form’s reCAPTCHA container at line 9”.

    Can you please expand a little on what you’re referring to – the field’s key or id, or something else should go there?

    Thanks

    Reply

Call: +1 919-604-5828

Send us an E-mail

Accessibility Statement | Affiliate Marketing Disclosure | Capability Statement

Cookie Policy | Comment & Product Review Policy | Privacy Policy | Site Map | Terms & Conditions

Copyright © 2003–2023 Victor M. Font Jr.

Return to top of page