Google अदृश्य reCAPTCHA बैज को कैसे छिपाएं

157

नए Google अदृश्य reCATPTCHA को लागू करते समय, डिफ़ॉल्ट रूप से आप स्क्रीन के नीचे दाईं ओर थोड़ा "reCAPTCHA द्वारा संरक्षित" बैज प्राप्त करते हैं जो आपके ऊपर रोल करते समय बाहर निकलता है।

मैं इसे छिपाना चाहूंगा।

javascript recaptcha

— जेम्स लॉ
स्रोत

218

Google अब FAQ से बैज को छिपाने की अनुमति देता है :

मैं reCAPTCHA v3 बैज को छिपाना चाहूंगा। क्या अनुमति है?

You are allowed to hide the badge as long as you include the reCAPTCHA
branding visibly in the user flow. Please include the following text:

This site is protected by reCAPTCHA and the Google
    <a href="https://policies.google.com/privacy">Privacy Policy</a> and
    <a href="https://policies.google.com/terms">Terms of Service</a> apply.

उदाहरण के लिए:

तो आप बस निम्नलिखित सीएसएस का उपयोग करके इसे छिपा सकते हैं:

.grecaptcha-badge { 
    visibility: hidden;
}

display: none;स्पैम चेकिंग को डिसेबल करने के लिए इसका उपयोग न करें (धन्यवाद @Zade)

— Yann39
स्रोत

24

मैं आपको यह बताने के लिए नहीं कहूंगा कि क्या करना है?) मैं अभी किसी भी अन्य उपयोगकर्ताओं को चेतावनी दे रहा हूं कि इसे हटाने के लिए अवैध हो सकता है।

— यन्नुज

16

यह पूरी तरह से अस्वीकार्य है, क्योंकि छोटे स्क्रीन जैसे मोबाइल में यह बैज वेबपेज के एक महत्वपूर्ण क्षेत्र को कवर करता है।

— डॉन दिलंगा

12

इसे स्वीकार करें, या एक अलग सेवा चुनें। Google को यह अधिकार है कि आप उनकी मुफ्त सेवा के लिए ब्रांडिंग दिखा सकते हैं । आप फॉर्म डेवलपर्स के साथ इनलाइन होने के लिए बैज को भी निरस्त कर सकते हैं। http://www.recaptcha/docs/inv अदृश्य#render_param ।

— अलेक्जेंडर ओटावका

1

खैर, मैं केवल अपने संपर्क फ़ॉर्म पृष्ठ पर इस कैप्चा v3 का उपयोग करता हूं। इसलिए यह एकमात्र पृष्ठ है जो मैं चाहता हूं कि यह बिल्ला दिखाया जाए। यह मेरी साइट पर कहीं और लागू नहीं होता है। मुमकिन?

— एंड्रयू ट्रकले

4

@ Yann39 - कृपया अपना उत्तर अपडेट करें। इसे छिपाना ठीक है और जैसे इसे केवल संपर्क पृष्ठ पर जोड़ें: Developers.google.com/recaptcha/docs/faq

— Sol

172

मैंने सभी दृष्टिकोणों का परीक्षण किया है और:

चेतावनी: display: none स्पैम की जाँच को अक्षम करें!

visibility: hiddenऔर opacity: 0स्पैम चेकिंग को अक्षम न करें।

उपयोग करने के लिए कोड:

.grecaptcha-badge { 
    visibility: hidden;
}

जब आप बैज आइकन छिपाते हैं, तो Google चाहता है कि आप इसे जोड़कर उनकी सेवा का संदर्भ लें:

<small>This site is protected by reCAPTCHA and the Google 
    <a href="https://policies.google.com/privacy">Privacy Policy</a> and
    <a href="https://policies.google.com/terms">Terms of Service</a> apply.
</small>

— Helenesh
स्रोत

6

इस उत्तर को और ऊपर ले जाने की आवश्यकता है! इसमें सक्सेज तरीके से समाधान के लिए सभी आवश्यक जानकारी होती है।

— ब्योर्न लार्सन

3

वास्तव में मैं क्या देख रहा था और यह बहुत अच्छा काम करता है। इसके अलावा सबूत की तलाश में किसी के लिए भी यह कृपया यह पृष्ठ देखें अनुमति दी है कि (यदि आप पहले से ही यह सब इस अतः धागा से अधिक देखा है) developers.google.com/recaptcha/docs/faq

— जेक

इस @ जेक का उल्लेख करने के लिए धन्यवाद। मैंने इसे अपने उत्तर में जोड़ा है।

— हेलनेश

क्या किसी ने सीएसएस हैक के बजाय बैज को छिपाने का एक प्रलेखित तरीका पाया है? Google उनकी ब्रांडिंग दिखाने के लिए एक वैकल्पिक तरीका प्रदान करता है, लेकिन मैं उनके बैज को छिपाने का एक समर्थित तरीका नहीं खोज सकता।

— कॉलिन प्राइस

38

data-badgeकरने के लिए विशेषता सेट करेंinline

<button type="submit" data-sitekey="your_site_key" data-callback="onSubmit" data-badge="inline" />

और निम्नलिखित सीएसएस जोड़ें

.grecaptcha-badge {
    display: none;
}

— जेम्स लॉ
स्रोत

7

सावधान रहे; यह स्पैम जाँच को अक्षम करने के लिए प्रकट होता है।

— जेडे

3

क्या यह वास्तव में स्पैम चेकिंग को अक्षम करता है? यदि हां, तो सभी उत्थान क्यों?

— चार्ली श्लिसेर

1

@ जेड शायद इसके बजाय उपयोग opacity: 0या visibility: hidden? यू भी एक लिंक है जहाँ यह आँकड़े है कि?

— ctf0

4

उपयोगकर्ता अनुबंध कहता है कि आपको उपयोगकर्ताओं को सूचित करना होगा क्योंकि @ Yann39 ऊपर कहता है।

— मिहेल मिंकोव

1

@ हेनेश एक अलग जवाब के लायक है?

— अनुपम

14

Google अब कहता है "जब तक आप उपयोगकर्ता प्रवाह में दृश्य रूप से ब्रांडिंग शामिल करते हैं, तब तक आपको बैज को छिपाने की अनुमति है।" संपर्क

— codesmith
स्रोत

2

केवल v3 पर लागू होता है! v2 को अभी भी बैज दिखाने की आवश्यकता है। :(

— ADTC

13

चूंकि बैज को छिपाना टीओयू के अनुसार वास्तव में वैध नहीं है, और मौजूदा प्लेसमेंट विकल्प मेरे यूआई और / या यूएक्स को तोड़ रहे थे, मैं निम्नलिखित अनुकूलन के साथ आया हूं जो निश्चित स्थिति की नकल करता है, लेकिन इसके बजाय इनलाइन प्रदान किया गया है:

आपको बस अपने बैज कंटेनर पर कुछ सीएसएस लागू करने की आवश्यकता है:

.badge-container {
  display: flex;
  justify-content: flex-end;
  overflow: hidden;
  width: 70px;
  height: 60px;
  margin: 0 auto;
  box-shadow: 0 0 4px #ddd;
  transition: linear 100ms width;
}
.badge-container:hover {
    width: 256px;
}

मुझे लगता है कि जहां तक आप कानूनी तौर पर इसे धक्का दे सकते हैं।

— krukid
स्रोत

1

अच्छा लगा। मैंने इसे और भी आगे बढ़ाया (वास्तव में इसे पूरी तरह से छिपाए बिना) का उपयोग करके transform: scale(0.6)औरopacity: 0.6

— छिपाए

क्या आप बाएं से दाएं नीले रंग का बैनर खोल पा रहे हैं? इसके रंग योजना को भी अनुकूलित करें?

— वैशाल पटेल

@VaishalPatel सिद्धांत रूप में, हाँ, लेकिन दो विपक्ष हैं: सबसे पहले, मूल बिल्ला डिज़ाइन के साथ छेड़छाड़ करना Google द्वारा हतोत्साहित किया जाता है और दूसरी बात, आपके द्वारा अपने परिवर्तनों में मौजूदा डिज़ाइन के बारे में जितनी अधिक धारणाएँ हैं, उतनी ही नाजुक आपकी छवि बन जाती है - ध्यान रखें Google बैज शैलियों और लेआउट को बदलने के लिए स्वतंत्र है जब भी वे ऐसा महसूस करते हैं।

— क्रुक्कड

1

@krukid मैं उनकी डिफ़ॉल्ट शैली इनलाइन के साथ गया।

— वैशाली पटेल

9

मैंने अपने संपर्क पृष्ठ (वर्डप्रेस का उपयोग करके) को छोड़कर सभी पृष्ठों पर बैज छिपाने का निर्णय लिया:

/* Hides the reCAPTCHA on every page */
.grecaptcha-badge {
    visibility: hidden !important;
}

/* Shows the reCAPTCHA on the Contact page */
/* Obviously change the page number to your own */
.page-id-17 .grecaptcha-badge {
    visibility: visible !important;
}

मैं एक वेब डेवलपर नहीं हूँ इसलिए अगर कुछ गड़बड़ है तो कृपया मुझे सही करें।

संपादित करें: प्रदर्शन के बजाय दृश्यता का उपयोग करने के लिए अद्यतन किया गया।

— लियोन
स्रोत

यह काम करेगा लेकिन पेज-आईडी- # आपकी वेबसाइट के लिए विशिष्ट है, इसलिए इसका उपयोग करने वाले किसी व्यक्ति को उस पृष्ठ को फिट करने के लिए आईडी को समायोजित करने की आवश्यकता होगी जिस पर वे प्रदर्शन करना चाहते हैं। || मैंने रिपोर्ट को यह कहते हुए देखा है कि यह प्रदर्शन: कोई नहीं; जाँच को भी अक्षम कर देगा, लेकिन मुझे अभी इस बारे में निश्चित नहीं है।

— माइकल टुननेल

सावधान! यह स्पैम चेकिंग को निष्क्रिय कर देता है। अधिक जानकारी के लिए मेरे उत्तर की जाँच करें

— हेलेनेश

माइकल एंड हेलेनेश की उपरोक्त टिप्पणियों के आधार पर अपडेट किया गया

— लियोन

4

मैथ्यू डॉवेल की पोस्ट का एक छोटा संस्करण, जो संक्षिप्त फ़्लैश से बचा जाता है, लेकिन जब भी संपर्क फ़ॉर्म 7 फ़ॉर्म दिखाई देता है, तो यह प्रदर्शित होता है:

div.grecaptcha-badge{
    width:0 !important;
}

div.grecaptcha-badge.show{
    width:256px !important; 
}

फिर मैंने अपने बाल विषय में शीर्ष लेख में जोड़ा।

<script>
jQuery( window ).load(function () { 
    if( jQuery( '.wpcf7' ).length ){ 
        jQuery( '.grecaptcha-badge' ).addClass( 'show' );
    }
});
</script>

— निगेल डायर
स्रोत

3

मेरा समाधान बैज को छिपाना था, फिर इसे प्रदर्शित करें जब उपयोगकर्ता एक फार्म इनपुट पर ध्यान केंद्रित करता है - इस प्रकार अभी भी Google के टी और सी एस का पालन कर रहा है।

नोट: जिस reCAPTCHA को मैं ट्विक कर रहा था वह एक वर्डप्रेस प्लगइन द्वारा उत्पन्न किया गया था, इसलिए आपको reCAPTCHA को एक के साथ लपेटना पड़ सकता है<div class="inv-recaptcha-holder"> ... </div> अपने ।

सीएसएस

.inv-recaptcha-holder {
  visibility: hidden;
  opacity: 0;
  transition: linear opacity 1s;
}

.inv-recaptcha-holder.show {
  visibility: visible;
  opacity: 1;
  transition: linear opacity 1s;
}

jQuery

$(document).ready(function () {
  $('form input, form textarea').on( 'focus', function() {
    $('.inv-recaptcha-holder').addClass( 'show' );
  });
});

जाहिर है कि यदि आवश्यक हो तो आप विशिष्ट रूपों को लक्षित करने के लिए jQuery के चयनकर्ता को बदल सकते हैं।

— एंडी पी
स्रोत

3

Wordpress पर Contact Form 7 के उपयोगकर्ताओं के लिए यह तरीका मेरे लिए काम कर रहा है: मैं v7 Recaptcha को सभी पेजों पर छुपाता हूँ, केवल संपर्क 7 फ़ॉर्म वाले लोगों को छोड़कर।

लेकिन इस विधि को किसी भी साइट पर काम करना चाहिए जहां आप एक अद्वितीय वर्ग चयनकर्ता का उपयोग कर रहे हैं जो पाठ इनपुट फॉर्म तत्वों के साथ सभी पृष्ठों की पहचान कर सकता है।

सबसे पहले, मैंने CSS में एक लक्ष्य शैली नियम जोड़ा, जो टाइल को ढहा सकता है:

सीएसएस

 div.grecaptcha-badge.hide{
    width:0 !important;
}

फिर मैंने अपने हेडर में JQuery की स्क्रिप्ट जोड़ी, विंडो लोड होने के बाद ट्रिगर करने के लिए इसलिए 'grecaptcha-badge' वर्ग चयनकर्ता JQuery के लिए उपलब्ध है, और उपलब्ध CSS स्टाइल को लागू करने के लिए 'Hide' क्लास को जोड़ सकता है।

$(window).load(function () { 
    if(!($('.wpcf7').length)){ 
      $('.grecaptcha-badge').addClass( 'hide' );
       }
});

मेरी टाइल अभी भी हर पेज पर आधे से एक सेकंड के लिए फ्लैश करेगी, लेकिन यह अब तक का सबसे अच्छा वर्कअराउंड है जिसे मैं उम्मीद करता हूं कि मैं इसका पालन करूंगा। सुधार के सुझाव की सराहना की।

— मैथ्यू डॉवेल
स्रोत

2

यह स्पैम जाँच को अक्षम नहीं करता है

div.g-recaptcha > div.grecaptcha-badge {
    width:0 !important;
}

— Mqtthieu
स्रोत

2

यदि आप संपर्क फ़ॉर्म 7 अपडेट और नवीनतम संस्करण (संस्करण 5.1.x) का उपयोग कर रहे हैं, तो आपको उपयोग करने के लिए Google reCAPTCHA v3 को स्थापित करना होगा।

डिफ़ॉल्ट रूप से आपको स्क्रीन के नीचे दाईं ओर प्रत्येक पृष्ठ पर Google reCAPTCHA लोगो दिखाई देता है। यह हमारे आकलन के अनुसार उपयोगकर्ताओं के लिए एक बुरा अनुभव पैदा कर रहा है। और आपकी वेबसाइट, ब्लॉग थोड़ा धीमा हो जाएगा (पेजस्पिड स्कोर से दर्शाएं), आपकी वेबसाइट द्वारा इस बैज को प्रदर्शित करने के लिए Google से अतिरिक्त 1 जावास्क्रिप्ट लाइब्रेरी लोड करना होगा।

आप इन चरणों का पालन करके Google reCAPTCHA v3 को CF7 से छिपा सकते हैं (केवल जब आवश्यक हो तो इसे दिखाएं):

सबसे पहले, आप functions.phpअपने विषय की फ़ाइल खोलें (फ़ाइल प्रबंधक या एफ़टीपी क्लाइंट का उपयोग करके)। इस फ़ाइल का पता लगाया गया है /wp-content/themes/your-theme/और निम्नलिखित स्निपेट जोड़ें (हम प्रत्येक पृष्ठ पर reCAPTCHA बॉक्स को हटाने के लिए इस कोड का उपयोग कर रहे हैं):

    remove_action( 'wp_enqueue_scripts', 'wpcf7_recaptcha_enqueue_scripts' );

इसके बाद, आप इस स्निपेट को उस पृष्ठ में जोड़ देंगे, जिसे आप Google reCAPTCHA (संपर्क पृष्ठ, लॉगिन, रजिस्टर पृष्ठ…) प्रदर्शित करना चाहते हैं:

if ( function_exists( 'wpcf7_enqueue_scripts' ) ) {
    add_action( 'wp_enqueue_scripts', 'wpcf7_recaptcha_enqueue_scripts', 10, 0 );
}

OIW ब्लॉग पर देखें - वर्डप्रेस 7 में संपर्क फ़ॉर्म 7 से Google reCAPTCHA लोगो को कैसे निकालें (छिपाएं reCAPTCHA बैज)

— OIW
स्रोत

2

हां, आप कर सकते हैं । आप या तो css या javascript का उपयोग reCaptcha v3 बैज को छिपाने के लिए कर सकते हैं ।

CSS मार्ग का उपयोग करें display: noneया visibility: hiddenreCaptcha बैच को छिपाने के लिए। यह आसान और त्वरित है।

.grecaptcha-badge {
    display:none !important;
}

जावास्क्रिप्ट तरीका है

var el = document.querySelector('.grecaptcha-badge');
el.style.display = 'none';

Google नीति के अनुसार बैज को छिपाना वैध है और यहां पर जवाब दिया गया है । यह गोपनीयता नीति और Google से उपयोग की शर्तों को दिखाने के लिए अनुशंसित है जैसा कि नीचे दिखाया गया है।

— किरण मनिया
स्रोत

1

'नहीं' क्वेरी 'लेकिन' क्वेरीस्लेक्टर 'नहीं।

— Keisuke Nagakawa

1

@ O 永川 टाइपो में वापस आने के लिए धन्यवाद।

— किरण मानिया

1

मैंने इसके बारे में अगली टिप्पणी देखी

यदि आप अपना खुद का CSS इसमें लगाना चाहते हैं तो बैज इनलाइन लगाना भी सहायक है। लेकिन याद रखें कि जब आप API कुंजी के लिए पंजीकृत होते हैं तो Google के नियम और शर्तों को दिखाने के लिए सहमत होते हैं - इसलिए इसे छिपाएं नहीं, कृपया। और जब यह सीएसएस के साथ बिल्ला को पूरी तरह से गायब करना संभव है, तो हम इसकी सिफारिश नहीं करेंगे।

— यूजेन कोनकोव
स्रोत

0

नोट: यदि आप बैज छिपाने के लिए चुनते हैं, तो कृपया उपयोग करें
.grecaptcha-badge { visibility: hidden; }

जब तक आप reCAPTCHA ब्रांडिंग को उपयोगकर्ता प्रवाह में शामिल करते हैं, तब तक आपको बैज को छिपाने की अनुमति है। कृपया निम्नलिखित पाठ शामिल करें:

यह साइट reCAPTCHA और Google द्वारा संरक्षित है
<a href="https://policies.google.com/privacy">Privacy Policy</a> and <a href="https://policies.google.com/terms">Terms of Service</a> apply.

यहाँ अधिक विवरण reCaptacha

— मोहसिन सईद
स्रोत

-1

रिकैप्टा संपर्क फ़ॉर्म 7 और रिकैप्टाचा वी 3 समाधान।

body:not(.page-id-20) .grecaptcha-badge {
    display: none;
}

एक संपर्क फ़ॉर्म पृष्ठ से अधिक?

body:not(.page-id-12):not(.page-id-43) .grecaptcha-badge {
    display: none;
}

यदि आपके पास अधिक संपर्क फ़ॉर्म पृष्ठ हैं, तो आप अधिक "नोट" जोड़ सकते हैं।

body:not(.page-id-45):not(.page-id-78):not(.page-id-98) .grecaptcha-badge {
    display: none;
}

सुनिश्चित करें कि आपका शरीर अनुभाग इस तरह होगा:

<body>

इसे बदलें ताकि यह इस तरह दिखे:

 <body <?php body_class(); ?>>

— बिजय कुमार ओली
स्रोत

कृपया अन्य उत्तरों को प्रदर्शित करें, कोई भी स्पैम जाँच को अक्षम नहीं करता है।

— हेलेनेश

@ हेलनेश स्पैम चेकिंग क्या है और यह सीएसएस शैली को जोड़ने से कैसे संबंधित है?

— बेरकेंट इपेक