रिकैप्चा - फॉर्म अनुकूलन

Question

क्या किसी को पता है कि रिकैप्चा डिफ़ॉल्ट फ्रेम के बिना पूरी तरह से अनुकूलित किया जा सकता है या नहीं। मुझे केवल एक निश्चित चौड़ाई के साथ-साथ इनपुट फ़ील्ड होने के लिए रिकैप्चा छवि की आवश्यकता है। क्या किसी ने सफलता से पहले ऐसा किया है।

Answer 1

आप अपने पृष्ठ पर कुछ इस तरह शामिल करके 'कस्टम' विषय विकल्प का उपयोग कर कस्टम मार्कअप निर्दिष्ट कर सकते हैं:

:

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

फिर आप पृष्ठ पर एक div बनाने custom_theme_widget आईडी इस तरह मैच के लिए

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

छवि, recaptcha_image div में सम्मिलित किया जाएगा ताकि आप इस तरह सीएसएस का उपयोग कर इसकी चौड़ाई सीमित हो सकती है:

#recaptcha_image img { 
    width: 200px; 
} 

... लेकिन ध्यान रखें कि यह ब्राउज़र में बड़ी छवि का आकार बदल देगा और कैप्चा को अपठनीय हो सकता है, इसलिए मैं इसकी अनुशंसा नहीं करता। हालांकि आपको पसंद है recaptcha_response_field इनपुट भी स्टाइल किया जा सकता है।

कस्टम थीम में आप क्या कर सकते हैं (और चाहिए) के अधिक उदाहरणों के लिए "देखो और महसूस करें अनुकूलन" अनुभाग here देखें।

Answer 2

आप कस्टम theme बना सकते हैं जो आपको इनपुट फ़ील्ड में मदद कर सकता है, लेकिन मुझे लगता है कि आप छवि आकार के साथ भाग्य से बाहर हैं - यह 300 x 57 पर तय है (आप निश्चित रूप से आयाम बदल सकते हैं लेकिन वह होगा एक और भी अधिक विकृत, और बहुत संभव है पूरी तरह से पढ़ने योग्य नहीं है, छवि में परिणाम)

Answer 3

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

इस फ़ायरफ़ॉक्स के लिए हालांकि अन्य ब्राउज़र के बारे में निश्चित नहीं काम करता है,, यदि आप IE6 में काम करने के लिए इसकी आवश्यकता है मैं इसे नहीं लगता कि सीएसएस छवि आकार बदलता है, तो यह सब जगह से बाहर दिखेगा।

Answer 4

मैंने जो कुछ किया वह reCAPTCHA शैलियों को अपडेट किया गया था।

निम्न सीएसएस छवि और कंटेनर की चौड़ाई और ऊंचाई को बदलता है। आयाम मूल रूप से 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> 

बस सावधान रहें कि छवि जितनी छोटी होगी, उपयोगकर्ताओं के पढ़ने के लिए यह कठिन होगा।