Recaptcha- 형태 사용자 정의

StackOverflow https://stackoverflow.com/questions/1715575

  •  19-09-2019
  •  | 
  •  

문제

기본 프레임없이 Recaptcha가 완전히 사용자 정의 할 수 있는지 아는 사람이 있습니까? 입력 필드뿐만 아니라 특정 너비 만 있으려면 recaptcha 이미지가 필요합니다. 성공하기 전에이 작업을 수행 한 사람이 있습니까?

도움이 되었습니까?

해결책

페이지에 이와 같은 것을 포함시켜 '사용자 정의'테마 옵션을 사용하여 사용자 정의 마크 업을 지정할 수 있습니다.

<script type="text/javascript">
    var RecaptchaOptions = {
        theme : 'custom',
        custom_theme_widget: 'recaptcha_widget'
    };
</script>

그런 다음 페이지에 DIV를 만듭니다. custom_theme_widget 다음과 같은 ID :

<div id="recaptcha_widget">
    <div id="recaptcha_image"></div>
    <input type="text" id="recaptcha_response_field" name="recaptcha_response_field" />
</div>

이미지가 recaptcha_image Div, 따라서 다음과 같은 CSS를 사용하여 폭을 제한 할 수 있습니다.

#recaptcha_image img {
    width: 200px;
}

...하지만 브라우저에서 더 큰 이미지를 크기를 조정하고 볼프 샤를 읽을 수 없게 만들 수 있으므로 반드시 권장하지는 않습니다. 그만큼 recaptcha_response_field 입력은 당신이 좋아하지만 스타일을 지정할 수 있습니다.

"모양과 느낌 사용자 정의"섹션을 참조하십시오 여기 사용자 정의 테마에서 할 수있는 것과해야 할 일에 대한 더 많은 예를 보려면.

다른 팁

사용자 정의를 만들 수 있습니다 주제 그것은 입력 필드에 도움이 될 것이지만 이미지 크기에 운이 좋지 않다고 생각합니다. 300 x 57로 고정되어 있습니다 (물론 치수를 변경할 수 있지만 훨씬 더 왜곡되고 아마도 상당히 상당히 가능합니다. 완전히 읽을 수없는 이미지)

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

이것은 Firefox에서 작동하지만 다른 브라우저에 대해서는 확실하지 않지만 IE6에서 작동하는 데 필요한 경우 CSS 이미지 크기 변경을 허용하지 않으므로 모든 것이 제자리를 벗어나게 될 것입니다.

내가 한 것은 Recaptcha 스타일을 업데이트하는 것입니다.

다음 CSS는 이미지와 컨테이너의 너비와 높이를 변경합니다. 크기는 원래 Google에서 정의되지만 페이지에 새로운 스타일을 추가하여 덮어 쓸 수 있습니다.

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

이미지가 작을수록 사용자가 읽기가 더 어렵다는 것을 조심하십시오.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top