Ricerca personalizzata Google con casella di ricerca personalizzata e pulsante?

Question

Sto cercando di effettuare una ricerca personalizzata di Google (ho solo bisogno di una sorta di motore di ricerca sul mio sito), e ho bisogno di farlo in modo da poter usare la mia casella di ricerca (campo di input). Ho bisogno che sia di dimensioni esatte. Devo anche essere in grado di fare il mio pulsante per cercare. Avrò bisogno di essere in grado di cambiare la dimensione e lo sfondo del pulsante di ricerca. Non ne sono ancora completamente sicuro, ma potrei davvero aver bisogno di essere un normale img.

Qualcuno sa come fare?

Se non riesci a farlo con Google, conosci un altro modo per farlo?

Se non esiste altro modo oltre all'utilizzo del proprio motore di ricerca, è possibile ottenere un collegamento a un tutorial molto semplificato su come crearlo da solo. Sono disposto a dedicare del lavoro extra per imparare, ma ho provato un po 'e, dopo aver esaminato tre diversi tut, ho rinunciato perché erano molto lunghi e confusi. Spero di aver cercato nei posti sbagliati.

Answer 1

Qui è quello che sto usando, è sufficiente aggiungere alcuni stili di <input id='q' che è la casella di ricerca, e < input value='MyButton' è il pulsante per fare clic

<!-- Google CSE Search Box Begins --> 
<center> 
<form id="searchbox_XXXXXXXXXX:YYYYYYYYY" action="http://myblog"> 
    <input value="XXXXXXXXXX:YYYYYYYYY" name="cx" type="hidden"/> 
    <input value="FORID:11" name="cof" type="hidden"/> 
    <input id="q" style="width:600px;" name="q" size="75" type="text"/> 
    <input value="MyButton" name="sa" type="submit"/> 
</form> 
</center> 
.... 

Edit: Sopra è la mia risposta dal 2010, non posso confermare che funzioni o meno, ma qui è quello che funziona.

<div id="cse" style="width: 100%;">Loading</div> 
<script src="http://www.google.com/jsapi" type="text/javascript"></script> 
<script type="text/javascript"> 
    google.load('search', '1', {language : 'en'}); 
    google.setOnLoadCallback(function() { 
    var customSearchControl = new google.search.CustomSearchControl('XXXXXXXXXXXXXXXX:YYYYYYYYYYYYYY'); 
    customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET); 
    var options = new google.search.DrawOptions(); 
    options.setAutoComplete(true); 
    customSearchControl.draw('cse', options); 
    }, true); 
</script> 

Per maggiori informazioni: si riferiscono a https://developers.google.com/custom-search/docs/js/cselement-devguide

Answer 2

Per Googler che sono alla ricerca di una soluzione con l'opzione "overlay nuovi risultati" nella sezione "look and feel". Ho usato la risposta di YOU e ho aggiunto alcuni hack minori per farlo funzionare. L'idea di base è ottenere il codice che Google ti offre, nascondere la casella e il pulsante di ricerca di Google e utilizzare la risposta di YOU con i codici XXXXX: YYYY appropriati. Mentre si nasconde lonon utilizzare display:none altrimenti i risultati di ricerca non funzioneranno.

<script> 
    (function() { 
    var cx = 'XXXXXXXXXX:YYYYYYYYY'; 
    var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true; 
    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//www.google.com/cse/cse.js?cx=' + cx; 
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s); 
})(); 
</script> 
<div style="width:0px;overflow:hidden;height:0px;"> <!-- if you use display:none here, it doesn't work--> 
    <gcse:search></gcse:search> 
</div> 
<form id="searchbox_XXXXXXXXXX:YYYYYYYYY" action=""> 
    <input value="XXXXXXXXXX:YYYYYYYYY" name="cx" type="hidden"/> 
    <input value="FORID:11" name="cof" type="hidden"/> 
    <input id="q" style="" name="q" size="75" type="text"/> 
    <button class="btn">Search</button> 
</form> 

Answer 3

ge StackOverflow,

la questione veramente mi ha fatto licenziato-up abbastanza per fare una mini passeggiata attraverso - se si sta cercando di impostare una barra v2, che fare con il cannocchiale piatta, vogliono solo per far funzionare il cannocchiale, si vuole sostituire completamente la barra personalizzata usando la v2, trovando e localizzando gli stili usati e sovrascrivendoli. Spero che sia d'aiuto! http://t.co/9nvx2l0DeD @ eb_p1

lungo indirizzo: http://eburnett.hubpages.com/hub/googlecustomsearchenginev2