Recaptcha not responsive

  • Resolved marienany

    (@marienany)


    4 years, 10 months ago

    Hi,

    I have a problem with this plugin. My recaptcha is not responsive.
    When viewed on a mobile device, the recaptcha stretches outside the form container. Do you know how I could quickly fix this please?

    Thanks in advance,
    Marie

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author IQComputing

    (@iqcomputing)

    4 years, 10 months ago

    Hello,

    Unfortunately, reCaptcha is inherently unresponsive. Since the whole reCaptcha module is inside an iframe, at a URL other than the parent domain, any custom CSS or JS is ignored. We wouldn’t be able to tell you why Google hasn’t upgraded it to be inherently responsive, nor do we have any good one-size-fits-all solution. There are some hacky workarounds for this, but the cross-browser support is iffy at best.

    shubhampunj

    (@shubhampunj)

    4 years, 5 months ago

    Hey, I found a solution which worked for me –

    In your contact form, paste this –

    <div class=”g-recaptcha” style=”transform:scale(0.88);-webkit-transform:scale(0.88);transform-origin:0 0;-webkit-transform-origin:0 0;”>
[recaptcha]
</div>

    Found this from StackOverflow,

    The original answer said to paste this – 

    <div class=”g-recaptcha” data-sitekey=”XXXXXXXXXXXXX5oXXXXXX” style=”transform:scale(0.88);-webkit-transform:scale(0.88);transform-origin:0 0;-webkit-transform-origin:0 0;”>
[recaptcha]
</div>

    But I’m not sure if “data-sitekey” is needed since our concern is the style of the div only.

    Thread Starter marienany

    (@marienany)

    4 years, 5 months ago

    Hi @shubhampunj,

    Thanks for your solution. It works for me now 😉

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Recaptcha not responsive’ is closed to new replies.