2010-02-01 5 views
14

J'essaie de faire une recherche personnalisée de Google (j'ai juste besoin d'une sorte de moteur de recherche sur mon site), et je dois faire en sorte que je puisse utiliser mon propre champ de recherche (champ de saisie). J'ai besoin qu'il soit de taille exacte. Je dois également être en mesure de faire mon propre bouton pour rechercher. Je vais devoir être en mesure de changer la taille et l'arrière-plan du bouton de recherche. Je ne suis pas encore tout à fait sûr, mais je pourrais en avoir besoin pour être un img régulier.Google Recherche personnalisée avec un champ de recherche personnalisé et un bouton?

Est-ce que quelqu'un sait comment faire cela?

Si vous ne pouvez pas faire cela avec Google, connaissez-vous une autre façon de le faire?

S'il n'y a pas d'autre moyen que d'utiliser votre propre moteur de recherche, puis-je obtenir un lien vers un didacticiel très simplifié sur la façon de faire mon propre moteur de recherche. Je suis prêt à faire le travail supplémentaire pour apprendre, mais j'ai essayé un peu, et après avoir regardé trois tuts différents, j'ai abandonné parce qu'ils étaient très très long et confus. J'espère que je regardais juste dans les mauvais endroits.

Répondre

18

Voici celui que je me sers, il vous suffit d'ajouter des styles à <input id='q' qui est la zone de recherche et < input value='MyButton' est le bouton à cliquer

<!-- 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> 
.... 

Modifier: Au-dessus est ma réponse à partir de 2010, je ne peux pas confirmer que ça marche ou pas, mais voici celui qui fonctionne.

<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> 

Pour plus d'informations: se référer à https://developers.google.com/custom-search/docs/js/cselement-devguide

+0

Et quels sont ceux XXXXX et YYYYYYY? – lzap

+0

ceux XXXX et YYYYY sont les numéros définis dans le code que vous obtenez de Google Custem Search. – Ergec

+0

Que devrait vraiment être en action = "http: // myblog"? –

18

Pour Googlers qui sont à la recherche d'une solution avec nouvelle option "Résultats Superposition" sous "Look and Feel". J'ai utilisé la réponse de YOU et ajouté quelques hacks mineurs pour le faire fonctionner. L'idée de base est d'obtenir le code que Google vous donne, de masquer le champ de recherche et le bouton de Google, et d'utiliser la réponse de YOU avec les bons codes XXXXX: YYYY. Lorsque vous masquez <gcse:search></gcse:search>", n'utilisez pas display:none sinon les résultats de la recherche ne fonctionneront pas.

<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> 
+2

Bonjour. Cela provoque le rechargement de la page, prend longtemps et ajoute certains caractères à l'URL. Pouvez-vous trouver un moyen d'obtenir des résultats tout comme le code copié de google, comme vous le faites est exactement ce que je veux, sauf pour les facteurs ci-dessus –

0

ge stackoverflow,

la question qui m'a vraiment assez tiré-up pour faire un mini rendez-vous à travers - si vous essayez de mettre en place une barre de v2, portant sur le Spyglass plat, je veux juste Pour faire fonctionner la spyglass, vous pouvez remplacer la barre personnalisée en utilisant v2, en recherchant et en localisant les styles utilisés et en les remplaçant. J'espère que cela aide! http://t.co/9nvx2l0DeD @ eb_p1

adresse longue: http://eburnett.hubpages.com/hub/googlecustomsearchenginev2

+0

Ajouter comme un commentaire ou élaborer. – Hemanth

Questions connexes