Does anyone know if recaptcha can be fully customize without the default frame. I need the recaptcha image to only be a certain width as well as the input field. Has anyone done this before with success.
Custom theming allows you to control exactly how the reCAPTCHA image appears. (Here is a demo of custom theming.) In order to use custom theming, you must first set the theme property of the RecaptchaOptions to 'custom'. This tells reCAPTCHA that it should not create a user interface of its own.
Add Google reCAPTCHA to a formClick the pencil icon or Edit on the form or newsletter block. In the Storage tab, click Google reCAPTCHA. Switch the Use Google reCAPTCHA toggle on. Repeat these steps for all form blocks on your site where you want to add a reCAPTCHA.
Settings Navigate to the settings category. Security & Membership -> Protection Under , select a . CAPTCHA settings Control to use Save the settings. When you change the CAPTCHA type, all web parts and features that have CAPTCHA enabled use the new type.
- Save file changes; - Go to the "Settings" tab on the plugin settings page (Admin Dashboard -> reCaptcha); If everything is OK, you will see your form in 'Enable reCAPTCHA for' => 'Custom Forms' (with labels which you specified in the "gglcptch_add_custom_form" hook call function).
You can specify custom markup using the 'custom' theme option by including something like this on your page:
<script type="text/javascript">
var RecaptchaOptions = {
theme : 'custom',
custom_theme_widget: 'recaptcha_widget'
};
</script>
You then create a div on the page to match the custom_theme_widget
id like this:
<div id="recaptcha_widget">
<div id="recaptcha_image"></div>
<input type="text" id="recaptcha_response_field" name="recaptcha_response_field" />
</div>
The image will be inserted into the recaptcha_image
div, so you could limit its width using CSS like this:
#recaptcha_image img {
width: 200px;
}
...but keep in mind that it will resize the larger image in the browser and may cause the captcha to become unreadable, so I wouldn't necessarily recommend that. The recaptcha_response_field
input could also be styled however you like.
See the "Look and Feel Customization" section here for more examples of what you can (and should) do in a custom theme.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With