带有自定义搜索框和按钮的Google自定义搜索？

Question

我正在尝试进行Google自定义搜索（我只需要在我的网站上使用某种搜索引擎），并且需要使其可以使用我自己的搜索框（输入字段）。我需要它具有确切的大小。我也需要能够让我自己的按钮来搜索。我将需要能够改变搜索按钮的大小和背景。我还不完全确定，但我可能真的需要它是一个常规的IMG。

有谁知道如何做到这一点？

如果你不能用Google做到这一点，你知道另一种方式吗？

如果除了使用自己的搜索引擎之外没有其他的方法，我可以请链接到一个非常简单的教程，如何使自己的。我愿意投入额外的工作去学习，但我尝试了一下，在看了三个不同的内容之后，我放弃了，因为它们非常漫长而令人困惑。我希望我只是看错了地方。

Answer 1

这里是我使用的，你只需要一些样式添加到<input id='q'这是搜索框的一个，并且< input value='MyButton'是点击

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

编辑按钮：以上就是我的答案从2010年起，我无法确认它是否在工作或者不再工作，但这是一个正在工作的人。

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

欲了解更多信息：指https://developers.google.com/custom-search/docs/js/cselement-devguide

Answer 2

对于谁是寻找“外观和感觉”下新的“叠加结果”选项的解决方案的Google。我使用了你的答案，并添加了一些小小的黑客来使其工作。基本的想法是获取谷歌给你的代码，隐藏谷歌的搜索框和按钮，并用正确的XXXXX：YYYY代码使用你的答案。隐藏<gcse:search></gcse:search>"请勿使用display:none，否则搜索结果将不起作用。

<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计算器，

问题真的让我解雇，足够的做一个小步行通过 - 如果你想建立一个V2酒吧，对付扁平望远镜，只是想让望远镜工作，想用v2完全替换自定义栏，查找和定位使用的样式并覆盖它们。希望能帮助到你！ http://t.co/9nvx2l0DeD @ eb_p1

长地址：http://eburnett.hubpages.com/hub/googlecustomsearchenginev2