好几个朋友之前问过我有关Google自定义搜索的美化，之前我一直在Bus工作，只是在QQ上应付几句完事。现在刚好请假，有点时间，自己弄了一下，发现其实一点不复杂，只需要基本的HTML知识就可以搞定了。
问我自定义搜索的朋友大致有两类，一个是嫌程序本身自带的搜索太烂，比如wordpress就是，还有一个是为了赚$，当然这个需要和Google Adense帐号绑定，本文不打算介绍这部分内容，因为我的Adense帐号不知为何故就被Google告知作弊，然后就莫名其妙的封掉了，我对天发誓，我没有做过弊，帐号中仅有的几美元也随之飞灭，从此我对Google Adense失去兴趣。
要自定义Google搜索，首先你当然需要有个Google自定义搜索，没有的同学，可以去这里申请一个，过程超级简单，Google有帮助功能，此处略去数千字。
第二步你需要做的是，拿到Google自定义搜索的代码，在自定义搜索的控制面板的导航中有，我相信你能找到。将Google代码复制到你的文本编辑器中，此处推荐Editplus，找到你的主题的搜索框的HTML代码，如果你没有编辑主题的权限，我也帮不了你。如果是wordpress，编辑主题时没有出现“更新” 按钮，一般是因为权限问题，请将这个主题的文件夹的文件设置成777权限。
第三步，将你刚才得到的Google自定义搜索的代码中
<input type="hidden" name="cx" value="015590816180039829114:vrqilrgmo4k" /> <input type="hidden" name="ie" value="UTF-8" />
加入到你自定搜索的表单中，比如我的是这样：
<form method="get" id="searchform" action="<?php bloginfo('home'); ?>/">
<div><input type="text" value="Search" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Go" />
</div>
</form>加入后就变成这样：
<form method="get" id="searchform" action="<?php bloginfo('home'); ?>/">
<div>
<input type="hidden" name="cx" value="015590816180039829114:vrqilrgmo4k" />
<input type="hidden" name="ie" value="UTF-8" />
<input type="text" value="Search" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Go" />
</div>
</form接下来替换form中的action内容，换成你刚才得到Google自定义搜索引擎代码中的action内容，一般简体中文的搜索内容是提交到http://www.google.com/cse，当然你最好还是要看一下自定义搜索引擎代码中的action内容。如果你想跟我一样，在新的窗口或者标签中显示搜索结果，在form中加入target=“_blank”即可。
Google自定义搜索引擎的代码中，最后一般都有一段javascript引用，这里可以完全忽略，它只是用来给自定义搜索打上一个Google版权的水印，如果你想保留的话，那么你form中的id,和input框中的id必须和自定义刚刚从Google得到的代码中完全一致，否则会产生错误。我在Google的自定搜索版权说明中没有看到一定要加这个水印的说明，所以我推荐不要加了，省得麻烦。
我的自定义搜索最后完成的完整代码如下：
<form method="get" id="cse-search-box" action="http://www.google.com/cse" target="_blank"> <div> <input type="hidden" name="cx" value="015590816180039829114:vrqilrgmo4k" /> <input type="hidden" name="ie" value="UTF-8" /> <input type="text" value="Search" name="q" id="s" /> <input type="submit" id="searchsubmit" name="sa" value="搜索" /> </div> </form>
接下来，你需要做的就是在各位的css文件中定义一下样式，特别提醒一下form、input中的id要和css中的完全一致哦。
我的css样式如下：
#cse-search-box { position: absolute; top: 0px; right: 0px; background: url(images/searchform-bg.png) no-repeat right bottom; height: 37px; width: 210px; } #cse-search-box #s{ background: #ffffff url(images/form-field-bg.gif) no-repeat ; height: 17px; width: 148px; margin: 6px 5px 0px 10px; padding: 3px 7px 2px 5px; color: #999999; border: none; } #cse-search-box #searchsubmit { background: url(images/search-btn.png) no-repeat left top; height: 24px; width: 24px; border: none; text-indent: -999%; line-height: 1px; margin-top: 6px; }
