Programmable Search Engine के कॉम्पोनेंट, जैसे कि खोज बॉक्स और खोज नतीजों के पेज एचटीएमएल मार्कअप का इस्तेमाल करके, अपने वेब पेजों और दूसरे वेब ऐप्लिकेशन को ऐक्सेस और मैनेज करना. ये Programmable Search Engine एलिमेंट में ऐसे कॉम्पोनेंट होते हैं जिन्हें रेंडर होने के लिए, स्टोर की गई सेटिंग के हिसाब से और वह भी Programmable Search सर्वर.
सभी JavaScript एसिंक्रोनस रूप से लोड होती हैं. इससे आपका वेबपेज जब तक ब्राउज़र Programmable Search Engine JavaScript को फ़ेच कर रहा होता है, तब तक लोड करना जारी रखें.
शुरुआती जानकारी
यह दस्तावेज़ Programmable Search Engine जोड़ने के लिए बेसिक मॉडल देता है आपके वेब पेज के एलिमेंट के साथ-साथ आपके एलिमेंट के बारे में भी जानकारी कॉन्फ़िगर किए जा सकने वाले कॉम्पोनेंट और सुविधाजनक JavaScript API.
स्कोप
इस दस्तावेज़ में, नीचे दिए गए फ़ंक्शन और प्रॉपर्टी को इस्तेमाल करने का तरीका बताया गया है Programmable Search Engine Control API.
ब्राउज़र के साथ काम करना
Programmable Search Engine के साथ काम करने वाले ब्राउज़र की सूची देखी जा सकती है यहां पढ़ें.
दर्शक
यह दस्तावेज़ उन डेवलपर के लिए है जिन्हें Google Programmable को जोड़ना है उनके पेजों पर खोज की सुविधा.
Programmable Search एलिमेंट
अपने पेज पर Programmable Search एलिमेंट जोड़ने के लिए, एचटीएमएल मार्कअप का इस्तेमाल किया जा सकता है. हर एलिमेंट में कम से कम एक कॉम्पोनेंट होता है: खोज बॉक्स, खोज का ब्लॉक परिणाम या दोनों. खोज बॉक्स में, नीचे दिए गए विकल्पों में से किसी में भी उपयोगकर्ता के इनपुट स्वीकार किए जाते हैं तरीके:
- टेक्स्ट इनपुट फ़ील्ड में टाइप की गई खोज क्वेरी
- यूआरएल में जोड़ी गई क्वेरी स्ट्रिंग
- प्रोग्रैम्ड तरीके से एक्ज़ीक्यूट करें
इसके अतिरिक्त, खोज परिणामों का ब्लॉक इन तरीकों से मदद पाएं:
- यूआरएल में जोड़ी गई क्वेरी स्ट्रिंग
- प्रोग्रैम्ड तरीके से एक्ज़ीक्यूट करें
Programmable Search एलिमेंट के ये टाइप उपलब्ध हैं:
| तत्व प्रकार | घटक | ब्यौरा |
|---|---|---|
| स्टैंडर्ड | <div class="gcse-search"> |
खोज बॉक्स और खोज के नतीजे,
उसी <div> में दिखाया गया है. |
| दो-कॉलम | <div class="gcse-searchbox"> और <div class="gcse-searchresults"> |
दो कॉलम वाला लेआउट, जिसमें एक ओर खोज के नतीजे और खोज बॉक्स मौजूद है
अन्य पर. अगर आपको दो कॉलम वाले मोड में एक से ज़्यादा एलिमेंट शामिल करने हैं
आपके वेबपेज में, आप gname एट्रिब्यूट का इस्तेमाल करके
खोज बॉक्स, जिसमें खोज के कई नतीजे दिखेंगे. |
| सिर्फ़ खोज बॉक्स | <div class="gcse-searchbox-only"> |
एक स्टैंडअलोन खोज बॉक्स. |
| searchresults-only | <div class="gcse-searchresults-only"> |
खोज के नतीजों का स्टैंडअलोन ब्लॉक. |
अपने वेबपेज में कितने भी मान्य Search एलिमेंट जोड़े जा सकते हैं. दो कॉलम के लिए मोड, सभी ज़रूरी कॉम्पोनेंट (खोज बॉक्स और खोज) परिणाम ब्लॉक) मौजूद होने चाहिए.
यहां एक सामान्य Search एलिमेंट का उदाहरण दिया गया है:
<!-- Put the following javascript before the closing </head> tag and replace 123456 with your own Programmable Search Engine ID. --> <script async src="https://cse.google.com/cse.js?cx=123456"></script> <!-- Place this tag where you want both of the search box and the search results to render --> <div class="gcse-search"></div>
Programmable Search एलिमेंट का इस्तेमाल करके, लेआउट के अलग-अलग विकल्प लिखना
नीचे दिए गए लेआउट के विकल्प, Programmable Search Engine के कंट्रोल पैनल के रंग-रूप वाले पेज पर उपलब्ध हैं. Programmable Search एलिमेंट का इस्तेमाल करके, लेआउट के विकल्पों को कंपोज़ करने के बारे में, यहां कुछ सामान्य दिशा-निर्देश दिए गए हैं. इनमें से किसी भी विकल्प का डेमो देखने के लिए, लिंक पर क्लिक करें.
| विकल्प | घटक |
|---|---|
| फ़ुल-विथ | <div class="gcse-search"> |
| कॉम्पैक्ट | <div class="gcse-search"> |
| दो कॉलम | <div class="gcse-searchbox">, <div class="gcse-searchresults"> |
| दो पेज | पहले पेज पर <div class="gcse-searchbox-only">, दूसरे पेज पर <div class="gcse-searchresults-only"> (या दूसरे कॉम्पोनेंट). |
| सिर्फ़ नतीजे | <div class="gcse-searchresults-only"> |
| Google की ओर से होस्ट किए गए | <div class="gcse-searchbox-only"> |
लेआउट के विकल्पों के बारे में ज़्यादा जानकारी.
Programmable Search एलिमेंट को पसंद के मुताबिक बनाना
रंग, फ़ॉन्ट या लिंक की स्टाइल को पसंद के मुताबिक बनाने के लिए, प्रोग्राम करने लायक सर्च इंजन के लुक और फ़ील पेज पर जाएं.
इसमें बनाए गए कॉन्फ़िगरेशन को ओवरराइट करने के लिए, वैकल्पिक एट्रिब्यूट का इस्तेमाल किया जा सकता है
Programmable Search Engine
कंट्रोल पैनल में दिखाया जाएगा. इसकी मदद से, अलग-अलग पेज के हिसाब से खोज अनुभव बनाया जा सकता है.
उदाहरण के लिए, यह कोड एक खोज बॉक्स बनाता है, जिससे नतीजे वाला पेज खुलता है
(http://www.example.com?search=lady+gaga) सबमिट करें. इस कीवर्ड का मान
उपयोगकर्ता क्वेरी स्ट्रिंग के साथ queryParameterName एट्रिब्यूट भी ऐसा है
इसका इस्तेमाल, नतीजों का यूआरएल बनाने के लिए किया जाता है.
ध्यान दें कि queryParameterName एट्रिब्यूट की शुरुआत data- से की जाती है.
यह प्रीफ़िक्स सभी एट्रिब्यूट के लिए ज़रूरी है.
<div class="gcse-searchbox-only" data-resultsUrl="http://www.example.com" data-newWindow="true" data-queryParameterName="search">
अगर आपने Programmable Search Engine के कंट्रोल पैनल का इस्तेमाल, इन सुविधाओं को चालू करने के लिए किया है अपने-आप पूरी होने की सुविधा या रिफ़ाइनमेंट की सुविधा का इस्तेमाल करके, एट्रिब्यूट का इस्तेमाल किया जा सकता है उन सुविधाओं को कस्टमाइज़ करना न भूलें. इन एट्रिब्यूट का इस्तेमाल करके अपनी पसंद के मुताबिक बनाने की सुविधा कंट्रोल पैनल में की गई सेटिंग को ओवरराइड कर देगा. नीचे दिए गए उदाहरण से, दो कॉलम वाला Search एलिमेंट, जिसमें ये सुविधाएं शामिल हैं:
- इतिहास मैनेज करने की सुविधा चालू है
- अपने-आप पूरे होने वाले अनुरोधों की ज़्यादा से ज़्यादा संख्या, 5 पर सेट है
- रिफ़ाइन करने के तरीके को लिंक के तौर पर दिखाया जाता है.
<div class="gcse-searchbox" data-enableHistory="true" data-autoCompleteMaxCompletions="5"> <div class="gcse-searchresults" data-refinementStyle="link">
इस्तेमाल किए जा सकने वाले एट्रिब्यूट
| एट्रिब्यूट | टाइप | ब्यौरा | कॉम्पोनेंट |
|---|---|---|---|
| सामान्य | |||
gname |
स्ट्रिंग | (ज़रूरी नहीं) Search Element ऑब्जेक्ट के लिए कोई नाम. वापस पाने के लिए नाम का इस्तेमाल किया गया है
नाम से संबंधित कॉम्पोनेंट या searchbox को जोड़ने के लिए
एक searchresults कॉम्पोनेंट वाला कॉम्पोनेंट. अगर यह सप्लाई नहीं की गई है,
Programmable Search Engine, फ़िल्टर के आधार पर अपने-आप gname जनरेट करेगा
वेबपेज पर कॉम्पोनेंट का क्रम. उदाहरण के लिए, पहला बिना नाम वाला
searchbox-only के पास gname "सिर्फ़ खोज बॉक्स वाला0" है
दूसरे में gname "seachbox-only1" है
ध्यान दें कि इसमें मौजूद कॉम्पोनेंट के लिए, अपने-आप जनरेट हुआ gname
दो कॉलम वाला लेआउट two-column होगा. यह उदाहरण
searchbox को जोड़ने के लिए, storesearch नाम का इस्तेमाल करता है
searchresults कॉम्पोनेंट वाला कॉम्पोनेंट:
<div class="gcse-searchbox" data-gname="storesearch"></div> <div class="gcse-searchresults" data-gname="storesearch"></div> अगर किसी ऑब्जेक्ट को वापस पाने के दौरान, एक से ज़्यादा कॉम्पोनेंट एक जैसे हों
|
कोई भी |
autoSearchOnLoad |
बूलियन | इससे पता चलता है कि यूआरएल में जोड़ी गई क्वेरी का इस्तेमाल करके, खोज की जा सकती है या नहीं
लोड हो रहा है. ध्यान दें कि यूआरएल में क्वेरी स्ट्रिंग का मौजूद होना ज़रूरी है
ऑटो-सर्च की सुविधा इस्तेमाल करने के लिए. डिफ़ॉल्ट: true. |
कोई भी |
enableHistory |
बूलियन | अगर true, ब्राउज़र के लिए इतिहास को मैनेज करने की सुविधा चालू करता है
और 'आगे बढ़ें' बटन हैं. डेमो देखें. |
खोज बॉक्स सिर्फ़ खोज बॉक्स |
queryParameterName |
स्ट्रिंग | क्वेरी पैरामीटर का नाम—उदाहरण के लिए, q (डिफ़ॉल्ट)
या query. इसे यूआरएल में एम्बेड किया जाएगा (उदाहरण के लिए,
http://www.example.com?q=lady+gaga). ध्यान दें कि
अकेले क्वेरी पैरामीटर नाम लोड होने पर ऑटो-खोज को ट्रिगर नहीं करता. क्वेरी
ऑटो सर्च चलाने के लिए यूआरएल में स्ट्रिंग मौजूद होनी चाहिए. |
कोई भी |
resultsUrl |
यूआरएल | नतीजों के पेज का यूआरएल. (यह डिफ़ॉल्ट रूप से Google का होस्ट किया गया पेज होता है.) | सिर्फ़ खोज बॉक्स |
newWindow |
बूलियन | यह बताता है कि नतीजों का पेज नई विंडो में खुलता है या नहीं.
डिफ़ॉल्ट: false. |
सिर्फ़ खोज बॉक्स |
ivt |
बूलियन |
इस पैरामीटर की मदद से, Google को यह जानकारी देने वाला बूलियन दिया जा सकता है कि आपको इसकी अनुमति देनी है किसी अमान्य ट्रैफ़िक का पता लगाने वाली कुकी और सहमति वाला और लोकल स्टोरेज, दोनों का स्टोरेज सहमति न देने वाला ट्रैफ़िक.
डिफ़ॉल्ट: इस्तेमाल के उदाहरण: |
खोज के नतीजे searchresults-only |
mobileLayout |
स्ट्रिंग |
इस नीति से यह तय होता है कि मोबाइल डिवाइसों के लिए मोबाइल लेआउट स्टाइल का इस्तेमाल किया जाना चाहिए या नहीं.
डिफ़ॉल्ट: इस्तेमाल के उदाहरण: |
कोई भी |
| ऑटोकंप्लीट | |||
enableAutoComplete |
बूलियन | यह विकल्प सिर्फ़ तब उपलब्ध होता है, जब Programmable Search Engine के कंट्रोल पैनल में, ऑटोकंप्लीट की सुविधा चालू की गई हो.
true से ऑटोकंप्लीट की सुविधा चालू होती है. |
कोई भी |
autoCompleteMaxCompletions |
पूर्णांक | प्रदर्शित करने के लिए अपने आप पूर्णताओं की अधिकतम संख्या. | खोज बॉक्स सिर्फ़ खोज बॉक्स |
autoCompleteMaxPromotions |
पूर्णांक | ऑटोकंप्लीट में दिखाने के लिए प्रमोशन की ज़्यादा से ज़्यादा संख्या. | खोज बॉक्स सिर्फ़ खोज बॉक्स |
autoCompleteValidLanguages |
स्ट्रिंग | भाषाओं की कॉमा-सेपरेटेड लिस्ट, जिनके लिए ऑटोकंप्लीट की सुविधा होनी चाहिए चालू किया गया. इस्तेमाल की जा सकने वाली भाषाएं. | खोज बॉक्स सिर्फ़ खोज बॉक्स |
| रिफ़ाइन करने के तरीके | |||
defaultToRefinement |
स्ट्रिंग | यह सुविधा सिर्फ़ तब उपलब्ध होती है, जब Programmable Search Engine का कंट्रोल पैनल. यह डिफ़ॉल्ट रिफ़ाइनमेंट लेबल को Display.Note: इस एट्रिब्यूट का इस्तेमाल, Google के होस्ट किए गए लेआउट में नहीं किया जा सकता. | कोई भी |
refinementStyle |
स्ट्रिंग | स्वीकार की जाने वाली वैल्यू tab (डिफ़ॉल्ट) और link हैं.
link सिर्फ़ तब काम करता है, जब इमेज खोज की सुविधा बंद हो या
चित्र खोज सक्षम है लेकिन वेब खोज अक्षम है. |
खोज के नतीजे searchresults-only |
| इमेज सर्च | |||
enableImageSearch |
बूलियन | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
अगर |
खोज के नतीजे searchresults-only |
defaultToImageSearch |
बूलियन | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
अगर |
कोई भी |
imageSearchLayout |
स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
इमेज के लिए खोज नतीजों के पेज का लेआउट तय करता है. स्वीकार की जाने वाली वैल्यू
|
खोज के नतीजे searchresults-only |
imageSearchResultSetSize |
पूर्णांक, स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
इमेज खोज के लिए सेट किए गए खोज नतीजों के ज़्यादा से ज़्यादा साइज़ के बारे में बताता है.
उदाहरण के लिए, |
कोई भी |
image_as_filetype |
स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
इससे नतीजों को, बताए गए एक्सटेंशन की फ़ाइलों तक सीमित किया जाता है.
| कोई भी |
image_as_oq |
स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
लॉजिकल OR का इस्तेमाल करके, खोज के नतीजे फ़िल्टर करें. अगर आपको "term1" वाले खोज नतीजे चाहिए, तो सैंपल का इस्तेमाल करें या "term2": | कोई भी |
image_as_rights |
स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
लाइसेंस के हिसाब से फ़िल्टर.
सामान्य कॉम्बिनेशन देखें. | कोई भी |
image_as_sitesearch |
स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
किसी खास साइट के पेजों के लिए, नतीजों को सीमित करें. इस्तेमाल के उदाहरण: | कोई भी |
image_colortype |
स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
यह नीति, खोज के नतीजों को ब्लैक ऐंड व्हाइट (मोनो), ग्रेस्केल या रंगीन इमेज तक सीमित रखती है. | कोई भी |
image_cr |
स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
खोज के नतीजों को, किसी खास देश में जनरेट हुए दस्तावेज़ों तक सीमित करता है. | कोई भी |
image_dominantcolor |
स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
खोज को किसी खास रंग की इमेज तक सीमित करता है.
| कोई भी |
image_filter |
स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
खोज के नतीजों को अपने-आप फ़िल्टर करना. इस्तेमाल की जा सकने वाली वैल्यू: 0/1 इस्तेमाल के उदाहरण: | कोई भी |
image_gl |
स्ट्रिंग | तभी उपलब्ध होगा, जब Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है. उन खोज नतीजों को बूस्ट करता है जिनके मूल देश का नाम पैरामीटर वैल्यू से मेल खाता है. | कोई भी |
image_size |
स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
तय किए गए साइज़ की इमेज दिखाता है, जिसमें साइज़ इनमें से कोई एक हो सकता है: | कोई भी |
image_sort_by |
स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
तारीख या अन्य स्ट्रक्चर्ड कॉन्टेंट का इस्तेमाल करके, नतीजों को क्रम से लगाएं. ज़रूरत के मुताबिक क्रम से लगाने के लिए, खाली स्ट्रिंग (image_sort_by="") का इस्तेमाल करें. इस्तेमाल के उदाहरण: | कोई भी |
image_type |
स्ट्रिंग | तभी उपलब्ध होगा, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है.
खोज को किसी खास तरह की इमेज तक सीमित करता है.
इसके लिए, | कोई भी |
| वेब खोज | |||
disableWebSearch |
बूलियन | अगर true, वेब खोज बंद कर देता है. आम तौर पर सिर्फ़ तब इस्तेमाल किया जाता है, जब
Programmable Search Engine के कंट्रोल पैनल में, इमेज खोजने की सुविधा चालू कर दी गई है. |
खोज के नतीजे searchresults-only |
webSearchQueryAddition |
स्ट्रिंग | लॉजिकल OR का इस्तेमाल करके, सर्च क्वेरी में अतिरिक्त शब्द जोड़े गए.
इस्तेमाल के उदाहरण: |
कोई भी |
webSearchResultSetSize |
पूर्णांक, स्ट्रिंग | परिणामों का अधिकतम आकार सेट किया गया. इस पर लागू होती है
इमेज खोज और वेब खोज, दोनों के लिए. डिफ़ॉल्ट लेआउट और लेआउट पर निर्भर करता है
Programmable Search Engine को पूरे वेब पर खोजने के लिए कॉन्फ़िगर किया गया है या सिर्फ़ उस सर्च इंजन के बारे में बताया गया है
साइटें. ये वैल्यू डाली जा सकती हैं:
|
कोई भी |
webSearchSafesearch |
स्ट्रिंग |
यह बताता है कि
SafeSearch की सुविधा
को वेब खोज परिणामों के लिए सक्षम किया गया है. off और active स्वीकार की जाती हैं.
|
कोई भी |
as_filetype |
स्ट्रिंग | इससे नतीजों को, बताए गए एक्सटेंशन की फ़ाइलों तक सीमित किया जाता है. Google जिन फ़ाइल टाइप को इंडेक्स कर सकता है उनकी सूची Search Console सहायता केंद्र में देखी जा सकती है. | कोई भी |
as_oq |
स्ट्रिंग | लॉजिकल OR का इस्तेमाल करके, खोज के नतीजे फ़िल्टर करें.
अगर आपको "term1" वाले खोज नतीजे चाहिए, तो सैंपल का इस्तेमाल करें या "term2": |
कोई भी |
as_rights |
स्ट्रिंग | लाइसेंस के हिसाब से फ़िल्टर.
सामान्य कॉम्बिनेशन के बारे में जानने के लिए, https://wiki.creativecommons.org/wiki/CC_Search_integration देखें. | कोई भी |
as_sitesearch |
स्ट्रिंग | किसी खास साइट के पेजों के लिए, नतीजों को सीमित करें.
इस्तेमाल के उदाहरण: |
कोई भी |
cr |
स्ट्रिंग | खोज के नतीजों को, किसी खास देश में जनरेट हुए दस्तावेज़ों तक सीमित करता है.
इस्तेमाल की जा सकने वाली वैल्यू इस्तेमाल के उदाहरण: |
कोई भी |
filter |
स्ट्रिंग | खोज के नतीजों को अपने-आप फ़िल्टर करना.
इस्तेमाल की जा सकने वाली वैल्यू: 0/1 इस्तेमाल के उदाहरण: |
कोई भी |
gl |
स्ट्रिंग | उन खोज नतीजों को बूस्ट करता है जिनके मूल देश का नाम पैरामीटर वैल्यू से मेल खाता है.
यह सिर्फ़ भाषा की वैल्यू सेटिंग के साथ काम करेगा. इस्तेमाल की जा सकने वाली वैल्यू इस्तेमाल के उदाहरण: |
कोई भी |
lr |
स्ट्रिंग | खोज के नतीजों को किसी खास भाषा में लिखे गए दस्तावेज़ों तक सीमित करता है.
इस्तेमाल की जा सकने वाली वैल्यू इस्तेमाल के उदाहरण: |
कोई भी |
sort_by |
स्ट्रिंग | तारीख या अन्य स्ट्रक्चर्ड कॉन्टेंट का इस्तेमाल करके, नतीजों को क्रम से लगाएं. एट्रिब्यूट की वैल्यू, Programmable Search eg9 की नतीजों को क्रम से लगाने की सेटिंग की सेटिंग में दिए गए विकल्पों में से एक होनी चाहिए.
ज़रूरत के मुताबिक क्रम से लगाने के लिए, खाली स्ट्रिंग (sort_by="") का इस्तेमाल करें. इस्तेमाल के उदाहरण: |
कोई भी |
| खोज के नतीजे | |||
enableOrderBy |
बूलियन | इसकी मदद से, खोज के नतीजों को प्रासंगिकता, तारीख या लेबल के मुताबिक क्रम से लगाया जा सकता है. | कोई भी |
linkTarget |
स्ट्रिंग | लिंक टारगेट सेट करता है. डिफ़ॉल्ट: _blank. |
खोज के नतीजे searchresults-only |
noResultsString |
स्ट्रिंग | जब कोई नतीजा, क्वेरी से मेल नहीं खाता है, तो यह डिफ़ॉल्ट टेक्स्ट दिखाता है. डिफ़ॉल्ट नतीजे वाली स्ट्रिंग का इस्तेमाल स्थानीय भाषा में लिखी गई स्ट्रिंग को सभी में दिखाने के लिए किया जा सकता है भाषाओं का उपयोग नहीं कर सकते, जबकि कस्टमाइज़ की गई भाषाओं में नहीं. | खोज के नतीजे searchresults-only |
resultSetSize |
पूर्णांक, स्ट्रिंग | परिणामों का अधिकतम आकार सेट किया गया. उदाहरण के लिए, large,
small, filtered_cse, 10. कॉन्टेंट बनाने
डिफ़ॉल्ट लेआउट, इस बात पर निर्भर करता है कि खोज के लिए इंजन को कॉन्फ़िगर किया गया है या नहीं
पूरे वेब या सिर्फ़ कुछ खास साइटों पर. |
कोई भी |
safeSearch |
स्ट्रिंग | निर्दिष्ट करता है कि क्या
वेब और इमेज, दोनों तरह की खोज के लिए सेफ़ सर्च की सुविधा चालू है. ये वैल्यू स्वीकार की जाती हैं: off
और active. |
कोई भी |
कॉलबैक
कॉलबैक, खोज-एलिमेंट शुरू करने और खोज की प्रोसेस को बेहतर तरीके से कंट्रोल करने की सुविधा देते हैं.
इन्हें ग्लोबल __gcse के ज़रिए, सर्च एलिमेंट JavaScript के साथ रजिस्टर किया जाता है
ऑब्जेक्ट है. रजिस्टर करें कॉलबैक की मदद से,
काम करने वाले कॉलबैक.
window.__gcse = {
parsetags: 'explicit', // Defaults to 'onload'
initializationCallback: myInitializationCallback,
searchCallbacks: {
image: {
starting: myImageSearchStartingCallback,
ready: myImageResultsReadyCallback,
rendered: myImageResultsRenderedCallback,
},
web: {
starting: myWebSearchStartingCallback,
ready: myWebResultsReadyCallback,
rendered: myWebResultsRenderedCallback,
},
},
};
इनिशलाइज़ेशन कॉलबैक
Search Element JavaScript, खोज नतीजों को रेंडर करने से पहले इनिशलाइज़ेशन कॉलबैक शुरू करता है
एलिमेंट की संख्या को बढ़ा दें. अगर parsetags को explicit पर सेट किया जाता है, तो
__gcse, Search Element JavaScript, Search एलिमेंट को रेंडर करना बंद कर देता है
इनिशलाइज़ेशन कॉलबैक (जैसा कि कॉलबैक रजिस्टर करें में दिखाया गया है).
इसका इस्तेमाल एलिमेंट को रेंडर करने के लिए किया जा सकता है. इसके अलावा, रेंडरिंग एलिमेंट को तब तक टाला जा सकता है, जब तक वे
की ज़रूरत नहीं है. यह एलिमेंट के एट्रिब्यूट को भी बदल सकता है; उदाहरण के लिए, यह
खोज बॉक्स जिसे कंट्रोल पैनल या एचटीएमएल एट्रिब्यूट के ज़रिए डिफ़ॉल्ट रूप से वेब पर कॉन्फ़िगर किया गया हो
या यह बताएं कि Programmable Search Engine फ़ॉर्म के ज़रिए सबमिट की गई क्वेरी
को सिर्फ़ खोज नतीजे दिखाने वाले एलिमेंट में चलाया जाता है.
डेमो देखें.
इनीशियलाइज़ेशन कॉलबैक का रोल, parsetags की वैल्यू से कंट्रोल किया जाता है
__gcse की प्रॉपर्टी.
- अगर इसकी वैल्यू
onloadहै, तो Search Element JavaScript, पेज पर मौजूद Search के सभी एलिमेंट को अपने-आप रेंडर करता है. इनीशियलाइज़ेशन कॉलबैक यह है का अब भी इस्तेमाल किया जा चुका है, लेकिन यह सर्च एलिमेंट को रेंडर करने के लिए ज़िम्मेदार नहीं है. - अगर इसकी वैल्यू
explicitहै, तो Search एलिमेंट का JavaScript रेंडर नहीं होता सर्च एलिमेंट. कॉलबैक उन्हेंrender()फ़ंक्शन, याgo()फ़ंक्शन की मदद से खोज के सभी एलिमेंट को रेंडर करें
नीचे दिया गया कोड बताता है कि खोज बॉक्स को, खोज के नतीजों के साथ कैसे रेंडर किया जाए
div, explicit पार्सटैग और इनिशलाइज़ेशन कॉलबैक का इस्तेमाल करके:
हमें आईडी वैल्यू वाला <div> शामिल करना होगा
जहां हमें सर्च एलिमेंट कोड चाहिए:
<div id="test"></div>अभी तक किसी भी व्यक्ति ने चेक इन नहीं किया है
इस JavaScript को <div> के बाद जोड़ें. ध्यान दें कि
test का रेफ़रंस है. id का इस्तेमाल करके, हमने
<div>const myInitCallback = function() {
if (document.readyState == 'complete') {
// Document is ready when Search Element is initialized.
// Render an element with both search box and search results in div with id 'test'.
google.search.cse.element.render(
{
div: "test",
tag: 'search'
});
} else {
// Document is not ready yet, when Search Element is initialized.
google.setOnLoadCallback(function() {
// Render an element with both search box and search results in div with id 'test'.
google.search.cse.element.render(
{
div: "test",
tag: 'search'
});
}, true);
}
};
// Insert it before the Search Element code snippet so the global properties like parsetags and callback
// are available when cse.js runs.
window.__gcse = {
parsetags: 'explicit',
initializationCallback: myInitCallback
};
खोज एलिमेंट को लोड करने के लिए, इस एचटीएमएल को शामिल करें. इसमें cx वैल्यू को बदलें
आपके अपने cx के साथ src क्लॉज़.
<script async
src="https://cse.google.com/cse.js?cx=000888210889775888983:y9tkcjel090"></script>
कॉलबैक खोजें
Search Element JavaScript छह कॉलबैक के साथ काम करता है. ये कॉलबैक खोज कंट्रोल फ़्लो. खोज कॉलबैक जोड़े में आते हैं. वेब-खोज कॉलबैक और मिलते-जुलते इमेज-खोज कॉलबैक:
- खोज शुरू हो रही है
- इमेज खोजने के लिए
- वेब खोज के लिए
- नतीजे आ गए हैं
- इमेज खोजने के लिए
- वेब खोज के लिए
- रेंडर किए गए नतीजे
- इमेज खोजने के लिए
- वेब खोज के लिए
इनीशियलाइज़ेशन कॉलबैक की तरह,सर्च कॉलबैक
को __gcse ऑब्जेक्ट में एंट्री का इस्तेमाल करके कॉन्फ़िगर किया गया है. ऐसा Search एलिमेंट के तौर पर होता है
JavaScript शुरू हो जाती है. स्टार्टअप के बाद __gcse में किए गए बदलावों को अनदेखा कर दिया जाता है.
इनमें से हर कॉलबैक को इसके लिए gName पास किया जाता है
को आर्ग्युमेंट के तौर पर चुना जा सकता है.
किसी पेज पर एक से ज़्यादा खोज नतीजे होने पर, gname का इस्तेमाल किया जा सकता है. कुछ खोजें
data-gname एट्रिब्यूट का इस्तेमाल करके, gname वैल्यू का एलिमेंट:
<div class="gcse-searchbox" data-gname="storesearch"></div>
अगर एचटीएमएल, Gname की पहचान नहीं करता, तो Search एलिमेंट JavaScript एक ऐसी वैल्यू जनरेट करता है जो एचटीएमएल में बदलाव किए जाने तक लगातार बने रहें.
इमेज/वेब खोज से जुड़ा शुरुआती कॉलबैक
खोज शुरू करने वाले कॉलबैक को Search Element JavaScript अनुरोधों के ठीक पहले शुरू किया जाता है अपने सर्वर से खोज परिणाम. इस्तेमाल का एक उदाहरण यह होगा कि क्वेरी में किए गए बदलावों को कंट्रोल करता है.
searchStartingCallback(gname, query)
gname- सर्च एलिमेंट की पहचान करने वाली स्ट्रिंग
query- वह मान जिसे उपयोगकर्ता ने डाला है (शायद खोज के ज़रिए बदला गया है एलिमेंट JavaScript.)
कॉलबैक वह वैल्यू दिखाता है जिसका इस्तेमाल इस खोज के लिए, क्वेरी के तौर पर किया जाना चाहिए. अगर यह खाली स्ट्रिंग डालने पर, रिटर्न वैल्यू को नज़रअंदाज़ किया जाता है और कॉलर, बिना बदलाव की गई क्वेरी का इस्तेमाल करता है.
इसके अलावा, कॉलबैक फ़ंक्शन को __gcse ऑब्जेक्ट में रखा जा सकता है या
JavaScript के साथ ऑब्जेक्ट में डायनैमिक तौर पर कॉलबैक जोड़ें:
window.__gcse['searchCallbacks']['web']['starting'] = function(gname, query) {...};
खोज शुरुआती कॉलबैक का उदाहरण
उदाहरण के तौर पर, कॉलबैक शुरू करने की खोज का समय
उदाहरण खोज शुरू करने के लिए कॉलबैक में morning जोड़ा जाता है
या दिन के समय के हिसाब से क्वेरी में afternoon जोड़ें.
const myWebSearchStartingCallback = (gname, query) => {
const hour = new Date().getHours();
return query + (hour < 12 ? ' morning' : ' afternoon');
};
window.myImageSearchStartingCallbackName = myWebSearchStartingCallback;
इस कॉलबैक को window.__gcse: में इंस्टॉल करें
window.__gcse || (window.__gcse = {});
window.__gcse.searchCallbacks = {
image: {
starting: 'myImageSearchStartingCallbackName',
},
web: {
starting: myWebSearchStartingCallback,
},
};
<script
async src="https://cse.google.com/cse.js?cx=000888210889775888983:y9tkcjel090"></script>
<div class="gcse-searchbox"></div>
<div class="gcse-searchresults"></div>
इमेज/वेब खोज के नतीजों के लिए तैयार कॉलबैक
ये कॉलबैक, Search Element JavaScript के प्रमोशन रेंडर करने से ठीक पहले शुरू किए जाते हैं और नतीजे. इस्तेमाल का उदाहरण एक कॉलबैक है, जो प्रमोशन और नतीजों को इस तरह रेंडर करता है सामान्य कस्टमाइज़ेशन के साथ तय नहीं किया जा सकता.
resultsReadyCallback(gname, query, promos, results, div)
gname- सर्च एलिमेंट की पहचान करने वाली स्ट्रिंग
query- ऐसी क्वेरी जिससे ये नतीजे मिले
promos- प्रमोशन से जुड़े ऑब्जेक्ट का कलेक्शन, जो मैच करने वाले डेटा से मेल खाता है प्रमोशन उपयोगकर्ता की क्वेरी सबमिट करें. प्रमोशन ऑब्जेक्ट की परिभाषा देखें.
results- नतीजे के तौर पर इस्तेमाल होने वाले ऑब्जेक्ट का कलेक्शन. ज़्यादा जानकारी के लिए, नतीजे के ऑब्जेक्ट की परिभाषा.
div- DOM में एक एचटीएमएल div जहां Search एलिमेंट आम तौर पर शामिल होता है
प्रचार और खोज परिणामों को शामिल किया जा सकता है. आम तौर पर, Search एलिमेंट JavaScript,
इस div को पॉप्युलेट कर रहे हैं, लेकिन यह कॉलबैक परिणामों की अपने आप रेंडरिंग को बंद कर सकता है
और खुद नतीजों को रेंडर करने के लिए, इस
divका इस्तेमाल करें.
अगर यह कॉलबैक true वैल्यू दिखाता है, तो Search एलिमेंट का JavaScript उस वैल्यू को स्किप कर देता है
पेज-फ़ुटर काम करता है.
नतीजों के लिए तैयार कॉलबैक का उदाहरण
उदाहरण के लिए, resultsReady कॉलबैक
नतीजे के लिए तैयार कॉलबैक का उदाहरण, डिफ़ॉल्ट प्रज़ेंटेशन को बदल देता है
के प्रमोशन और नतीजों को बहुत आसान विकल्प से बदल दिया गया है.
const myResultsReadyCallback = function(name, q, promos, results, resultsDiv) {
const makePromoElt = (promo) => {
const anchor = document.createElement('a');
anchor.href = promo['url'];
anchor.target = '_blank';
anchor.classList.add('gs-title');
const span = document.createElement('span');
span.innerHTML = 'Promo: ' + promo['title'];
anchor.appendChild(span);
return anchor;
};
const makeResultParts = (result) => {
const anchor = document.createElement('a');
anchor.href = result['url'];
anchor.target = '_blank';
anchor.classList.add('gs_title');
anchor.appendChild(document.createTextNode(result['visibleUrl']));
const span = document.createElement('span');
span.innerHTML = ' ' + result['title'];
return [anchor, span];
};
const table = document.createElement('table');
if (promos) {
for (const promo of promos) {
const row = table.insertRow(-1);
const cell = row.insertCell(-1);
cell.appendChild(makePromoElt(promo));
}
resultsDiv.appendChild(table);
resultsDiv.appendChild(document.createElement('br'));
}
if (results) {
const table = document.createElement('table');
for (const result of results) {
const row = table.insertRow(-1);
const cell = row.insertCell(-1);
const [anchor, span] = makeResultParts(result);
cell.appendChild(anchor);
const cell2 = row.insertCell(-1);
cell2.appendChild(span);
}
resultsDiv.appendChild(table);
}
return true;
};
इस कॉलबैक को window.__gcse: में इंस्टॉल करें
window.__gcse || (window.__gcse = {});
window.__gcse.searchCallbacks = {
web: {
ready: myResultsReadyCallback,
},
};
<script async
src="https://cse.google.com/cse.js?cx=000888210889775888983:y9tkcjel090"></script>
<div class="gcse-searchbox"></div>
<div class="gcse-searchresults"></div>
कॉलबैक को खोजने की प्रोसेस की तरह ही, ऊपर दिए गए तरीके का इस्तेमाल करके, कॉलबैक को
__gcse ऑब्जेक्ट.
इमेज/वेब खोज के नतीजों के लिए रेंडर किया गया कॉलबैक
ये कॉलबैक, Search एलिमेंट JavaScript के पेज को रेंडर करने से ठीक पहले शुरू किए जाते हैं फ़ुटर. इस्तेमाल के उदाहरणों में कॉलबैक शामिल होगा, जो खोज के नतीजों में दिखने वाला कॉन्टेंट जोड़ता है तत्व नहीं दिखाई देता है, जैसे कि इसे सेव करें चेकबॉक्स या ऐसी जानकारी जो अपने-आप रेंडर होने की सुविधा चालू हो या कॉलबैक, जो ज़्यादा जानकारी के लिए बटन जोड़ता हो.
अगर रेंडर किए गए नतीजों के कॉलबैक के लिए, promos और
results
पैरामीटर का इस्तेमाल करके ट्रिगर किया जाता है, तो यह उसे उनके बीच पास कर सकता है, इस तरह से:
callback(gname, query, promoElts, resultElts);
gname- सर्च एलिमेंट की पहचान करने वाली स्ट्रिंग
query- खोज स्ट्रिंग.
promoElts- प्रमोशन वाले डीओएम एलिमेंट की कलेक्शन.
resultElts- नतीजों वाले डीओएम एलिमेंट की कलेक्शन.
कोई रिटर्न वैल्यू नहीं है.
नतीजे रेंडर किए गए कॉलबैक के उदाहरण
उदाहरण के लिए, resultsRendered कॉलबैक
नतीजे के तौर पर रेंडर किए गए कॉलबैक का उदाहरण, एक डमी Keep जोड़ता है
हर प्रमोशन और नतीजे के लिए चेकबॉक्स पर सही का निशान लगाएं.
myWebResultsRenderedCallback = function(name, q, promos, results) {
for (const div of promos.concat(results)) {
const innerDiv = document.createElement('div');
innerDiv.appendChild(document.createTextNode('Keep: '));
const checkBox = document.createElement('input');
checkBox.type = 'checkbox';
checkBox.name = 'save';
innerDiv.appendChild(checkBox);
div.insertAdjacentElement('afterbegin', innerDiv);
}
};
इस कॉलबैक को window.__gcse: में इंस्टॉल करें
window.__gcse || (window.__gcse = {});
window.__gcse.searchCallbacks = {
web: {
rendered: 'myWebResultsRenderedCallback',
},
};
<script async
src="https://cse.google.com/cse.js?cx=000888210889775888983:y9tkcjel090"></script>
<div class="gcse-searchbox"></div>
<div class="gcse-searchresults"></div>
अगर रेंडर किए गए नतीजों के लिए कॉलबैक की ज़रूरत होती है
जानकारी को नतीजों के लिए तैयार कॉलबैक को भेजा जाता है. यह डेटा को
कॉलबैक न करें. नीचे दिए गए उदाहरण में, रेटिंग वैल्यू पास करने के कई तरीके बताए गए हैं.
richSnippet के नतीजे के लिए तैयार कॉलबैक से लेकर रेंडर किए गए नतीजों तक
कॉलबैक.
const makeTwoPartCallback = () => {
let saveForRenderCallback;
const readyCallback = (name, q, promos, results, resultsDiv) =>
{
saveForRenderCallback = [];
for (const result of results) {
const {
richSnippet: {
answer = []
} = {},
} = result;
const firstAnswer = answer[0];
if (firstAnswer) {
const upVotes = firstAnswer['upvotecount'];
if (upVotes) {
saveForRenderCallback.push(
{upvotes: parseInt(upVotes, 10)}
);
continue;
}
}
saveForRenderCallback.push({});
}
};
const renderedCallback = (name, q, promos, results) => {
for (let i = 0; i < results.length; ++i) {
const div = results[i];
const votes = saveForRenderCallback[i]['upvotes'];
if (votes) {
const innerDiv = document.createElement('div');
innerDiv.innerHTML = '<b>Upvotes: ' + votes + '</b>';
div.insertAdjacentElement('afterbegin', innerDiv);
}
}
};
return {readyCallback, renderedCallback};
};__gcse सेट अप करते समय, इस कॉलबैक को इस तरह के कोड का इस्तेमाल करके इंस्टॉल करें:
const {
readyCallback: webResultsReadyCallback,
renderedCallback: webResultsRenderedCallback,
} = makeTwoPartCallback();
window.__gcse || (window.__gcse = {});
window.__gcse.searchCallbacks = {
web: {
ready: webResultsReadyCallback,
rendered: webResultsRenderedCallback,
},
};
<script async
src="https://cse.google.com/cse.js?cx=000888210889775888983:kdroeu4mwju"></script>
<div class="gcse-searchbox"></div>
<div class="gcse-searchresults"></div>
कॉलबैक के ज़्यादा उदाहरण
कॉलबैक के अन्य उदाहरण कॉलबैक के ज़्यादा उदाहरण दस्तावेज़.
प्रमोशन और नतीजे की प्रॉपर्टी
JSDoc नोटेशन का इस्तेमाल करके, ये promotion और नतीजे ऑब्जेक्ट. यहां हम उन सभी प्रॉपर्टी की सूची बनाते हैं जो इसमें मौजूद हो सकती हैं. कई प्रॉपर्टी की मौजूदगी प्रमोशन या खोज के नतीजे की जानकारी के हिसाब से तय होता है.
{
content: string,
image: {
height: number,
url: string,
width: number,
},
title: string,
url: string,
visibleUrl: string,
}
{
content: string,
contentNoFormatting: string,
contextUrl: string, // For image search results only
fileFormat: string,
image: { // For image search reseults only
height: number,
url: string,
width: number,
},
perResultLabels: !Array<{
anchor: string,
label: string,
labelWithOp: string,
}>,
richSnippet: !Array<!Object>, // For web search results only
thumbnailImage: {
height: number,
url: string,
width: number,
},
title: string,
titleNoFormatting: string,
url: string,
visibleUrl: string,
}
नतीजों में richSnippet में
ऑब्जेक्ट हैं. इस कैटगरी में एंट्री की वैल्यू,
स्ट्रक्चर्ड डेटा
जो हर खोज परिणाम के वेब पेज पर मिलती है. उदाहरण के लिए, समीक्षा वाली वेबसाइट में
वह स्ट्रक्चर्ड डेटा जो इस अरे एंट्री को richSnippet में जोड़ता है:
'review': {
'ratingstars': '3.0',
'ratingcount': '1024',
},
Programmable Search एलिमेंट कंट्रोल एपीआई (V2)
google.search.cse.element ऑब्जेक्ट इन्हें पब्लिश करता है
स्टैटिक फ़ंक्शन:
| फ़ंक्शन | ब्यौरा | ||||||
|---|---|---|---|---|---|---|---|
.render(componentConfig, opt_componentConfig) |
सर्च एलिमेंट रेंडर करता है.
पैरामीटर
|
||||||
.go(opt_container) |
बताए गए कंटेनर में सभी सर्च एलिमेंट टैग/क्लास को रेंडर करता है.
पैरामीटर
|
||||||
.getElement(gname) |
gname से एलिमेंट ऑब्जेक्ट हासिल करता है. अगर नहीं मिलता है, तो शून्य दिखाएं.
लौटाए गए
यह कोड, "news" क्वेरी को एक्ज़ीक्यूट करता है "एलिमेंट1" में: var element = google.search.cse.element.getElement('element1');
element.execute('news');
|
||||||
.getAllElements() |
सफलता से बनाए गए सभी एलिमेंट ऑब्जेक्ट का मैप दिखाता है, जिसे gname से लिखा जाता है. |