English 中文(简体)
Recaptcha - Form Customization
原标题:

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.

最佳回答

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.

问题回答

You can create a custom theme that should help you with the input field, but I think you re out of luck with the image size - it s fixed at 300 x 57 (you can of course change the dimensions but that will result in an even more distorted, and quite possibly completely unreadable, image)

http://risingofsilversurfer.blogspot.com/2009/10/customize-recaptcha-theme.html

this works for firefox, though not sure about other browsers, if you need it to work in ie6 i don t think it accepts css image size changing, so it ll look all out of place.

All I did was update the reCAPTCHA styles.

The following CSS changes the width and height of the image and container. The dimensions are originally defined by Google but can be overwritten by adding new styles to your page.

<style type="text/css">
#recaptcha_image img{
    height:46px;
    width:230px;
    margin: 0px;
    padding: 0px;
}
#recaptcha_container {
    margin: 0px;
    padding: 0px;
    width: 230px;
}
</style>

Just beware that the smaller the image, the harder it will be for users to read.





相关问题
Brute-force/DoS prevention in PHP [closed]

I am trying to write a script to prevent brute-force login attempts in a website I m building. The logic goes something like this: User sends login information. Check if username and password is ...

please can anyone check this while loop and if condition

<?php $con=mysql_connect("localhost","mts","mts"); if(!con) { die( unable to connect . mysql_error()); } mysql_select_db("mts",$con); /* date_default_timezone_set ("Asia/Calcutta"); $date = ...

定值美元

如何确认来自正确来源的数字。

Generating a drop down list of timezones with PHP

Most sites need some way to show the dates on the site in the users preferred timezone. Below are two lists that I found and then one method using the built in PHP DateTime class in PHP 5. I need ...

Text as watermarking in PHP

I want to create text as a watermark for an image. the water mark should have the following properties front: Impact color: white opacity: 31% Font style: regular, bold Bevel and Emboss size: 30 ...

How does php cast boolean variables?

How does php cast boolean variables? I was trying to save a boolean value to an array: $result["Users"]["is_login"] = true; but when I use debug the is_login value is blank. and when I do ...

热门标签