あなたのサイトでGoogleカスタム検索を実装する方法は？

Question

自分のウェブサイトにGoogleカスタム検索を実装したいユーザーが検索ボックスに入力すると、Googleサイトの検索結果が表示されます。

Answer 1

ここに私のコードです： product、breadcrumbsはitem.pagemap []配列にあります。カテゴリとアイテムを指定するのに役立ちます。私は分類されたリストを作成し、結果を表示するためにjqueryオートコンプリートを使用したいと思います。

var sUrl="https://www.googleapis.com/customsearch/v1?key={YOUR_API_KEY}&cr={COUNTRY_CODE}&cx={YOUR_CX_VALUE}&q="; 

function getAutosuggest(qTerm,res){ 
      if(qTerm.length>1){ 
       $.get(sUrl+qTerm,{},function(data){ 
        if(data && data.items && data.items.length>0){ 
         var qTerm=$sInput.val(), 
         sData=[];  
     var j=data.items.length; 

     for(var i=0;i<data.items.length;i++){ 

          if(data.items[i].pagemap && data.items[i].pagemap.product && data.items[i].pagemap.product.length>0){ 
           var prod=data.items[i].pagemap.product[0]; 
           //console.log("Search:"+qTerm+"|"+JSON.stringify(prod)); 
           var ht=new RegExp("\\b"+qTerm+"[^\\s]*","gi"); 
           if(newW && ((m=ht.exec(prod.name)) || (m=ht.exec(prod.description)))){               
            newW=false; 
            var hint=qTerm+m[0].substring(qTerm.length); 
            //console.log("Matched:"+JSON.stringify(m)); 
            //console.log("Hint:"+hint); 
            if(hint.slice(-1)===','){ 
             hint=hint.substring(0,hint.length-1); 
            } 
       hint=hint.length>35?'':hint; 
       console.log(hint); 
            $hintTxt.html(hint); 
            //break; 
           } 
           var cat="Makeup",itemId=0; 
           if(data.items[i].pagemap.breadcrumb && data.items[i].pagemap.breadcrumb.length>2){           
            if((cat=data.items[i].pagemap.breadcrumb[data.items[i].pagemap.breadcrumb.length-2].title)== undefined){ 
             cat="Makeup"; 
            } 
           } 
           if(prod.identifier){ 
            itemId=prod.identifier.substring(4); 
           } 
           var sItem={ 
            label:prod.name, 
            value:prod.name, 
            link:data.items[i].link, 
            item_id:itemId, 
            category:cat 
           }; 
           sData.push(sItem); 
          } 
         } 
         sData.sort(keysrt('category')); 

         if(sData.length>0){ 
          sData.push({label:"SEE ALL RESULTS",item_id:0,value:"",link:"/search.php?search="+qTerm,category:""});         
         }else if(sData.length==0){ 
          sData.push({label:"No results found",item_id:-1,value:"",link:""+qTerm,category:""}); 
         } 


         //console.log("Data:"+JSON.stringify(sData)); 
         res(sData); 

        }    
       },'json'); 
      } 
     } 

    function keysrt(key,desc) { 
     return function(a,b){ 
     return desc ? ~~(a[key] < b[key]) : ~~(a[key] > b[key]); 
     } 
    }