2013-04-11 180 views
2

我正在寻找将谷歌自定义搜索添加到我的网站,但我已经设计了搜索框占位符,我希望我的搜索框看起来像这样。带自定义搜索框的Google自定义搜索?

经过一番搜索,似乎以前的所有问题如this one都已过时。

我有关于造型发现的唯一的事情是这样的:

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

但是,当您提交表单,什么都不会发生。

我注意到action =“”被留空,当我输入我的网站“www.kokorugs.com/”时,它也不起作用。

任何想法将不胜感激!

回答

0

我发现的唯一方法是使用JQuery创建挂钩到呈现的Google元素中。由于您想将自定义搜索框与要素绑定,因此您应该渲染gsce:仅限结果而不是gsce:搜索并按照我以前的answers之一执行。