上周四发布了《淘宝自定义css全屏轮播特效代码生成器》，又经过一周的奋斗，第四款生成器→→《淘宝店内搜索框代码生成器》已经制成。 来上一张界面截图：

先来对此款神器做下点评：
优点：万能搜索代码，淘宝C店，天猫B店统统都可以一键生成，提供4种已制作的搜索框样式，用户也可以自行替换自己的个性搜索框样式；新增“我的html”区，会代码的用户可以在此输入自己的代码或者是用生成器生成的代码粘贴进来，点击提交后即可浏览店招效果。
缺点：此款生成器只生成搜索框代码，制作店招可通过《淘宝全屏海报+多链接代码生成器》中的多链接功能来进行制作。未进行合并原因：淘宝全屏海报+多链接代码生成器已包括了店招制作功能，此处再写就有点多余。
使用难度：低　　动手能力：强

下面对上图各数字的功能进行讲解：
1.店铺链接：必填项，不填会导致搜索功能在店铺中无法应用，请填写自己店铺首页链接；
2.店招宽度：默认950，C店950，B店990；
3.店招高度：默认150，店铺中最大高度为150，这里的值都未做限制，但店铺中会严格限制，所以在填写时请按标准来填写！
4.搜索样式：默认样式一，提供4种搜索样式模板。
模板一:　　模板二:　　
模板三:　　模板四:　
搜索框架默认尺寸：框架宽度:140px；高度:23px；文本框宽度:105px；搜索按钮宽度:35px；如图：

5.店铺类型：默认淘宝C店，天猫店铺请选择B店；
6.文本颜色：默认白色，即搜索框中文字的颜色，可通过点击在弹出的颜色库中选择自己喜欢的颜色，鼠标离开后会自动进行更换。先颜色时请注意背景与字体颜色的反差，避免输入文字无法看清。
_①：删除线的内容表示可略过；默认选项即可；
7.搜索方式：默认本窗口打开搜索结果，即点击搜索按钮后是在新页面打开搜索的宝贝还是在当前页面打开，可略过；
8.代码压缩：默认是，更节省空间，可略过；
9.高级功能：默认关闭，无div基础者请不要开启，开启后可以写自己的html代码和css样式，至于css，如果店铺中未开通旺铺css或者是不会破解自定义css者可忽略此操作；
破解自定义css限制：默认关闭，暂未提供开启功能，后期将会做一个单独的破解自定义css限制的生成器；
10.店招图片链接：即主区[950-990]这中间的图片，建议填写，这样更方便控制搜索框位置的精确度；
11.搜索图片链接：可以使用自己的搜索图片，如果没有的话请复制此文本框内的链接到新窗口，保存图片上传到自己图片空间，再复制图片链接替换此链接；
12.生成代码：点击后即可生成代码，再复制左侧的“html”内容到自己店铺店招中，保存发布即可；
13.html,css,我的html三者间的关系：“html”内为最终生成的代码，可直接复制到店铺中应用；“css”内为css样式代码，用户可以自己填写需要控制的店招以及搜索框的样式；“我的html”内为用户自己的html内容或是复制生成器生成的代码，例如：我先用“淘宝全屏海报+多链接代码生成器”生成一个c店的店招，然后复制代码放这个里面，点击“提交”后则可在当前页面浏览店招效果，再来调节搜索框的位置，最后点击生成代码即可。
14.搜索框：点击可以拖拽移动位置，想使用的话请点击“成品效果”在新页面预览
15.成品效果：点击可以在新页面预览最终的效果
16.使用攻略：点击后会跳转到这篇《淘宝店内搜索框代码生成器使用攻略》说明文章。

生成器地址明日发布，在使用中如有任何疑问或建议，均可在评论区中提交问题；或者点击导航上面的qq头像直接进群(请使用自己的大号，小号有不良记录的审核不会通过！)；或者发我qq邮箱:315800015@qq.com。最后希望所有使用的亲都能有所获。

2014.08.16　14:40更新

13.“精简搜索框html”为今日新增功能，主要作用是：单纯的生成搜索框样式代码，便于安装到任意模块中。如下图:
淘宝店内搜索框代码生成器地址：http://www.yilingsj.com/zxsc/dpzp/2014-08-16/191.html

转载声明：
　　若亲想转载本文到其它平台，请务必保留本文出处！
本文链接：/code/2014-08-15/190.html

若亲不想直保留地址，含蓄保留也行。艺灵不想再看到有人拿我的技术文章到他的地盘或者是其它平台做教(装)程(B)而不留下我的痕迹。文章你可以随便转载，随便修改，但请尊重艺灵的劳动成果！谢谢理解。