php道勤 发表于 2014-10-17 09:55:32

旺铺专业版 全屏通栏店招制作方法(图文教程)

旺铺专业版 全屏通栏店招制作方法(图文教程)
上次做的通栏店招教程是适用于旧版店铺的,今天做一个适用于旺铺专业版的全屏通栏店招制作教程。旺铺专业版制作通栏店招并不难,相信大家都会,但如果要制作一个带导航栏的通栏店招(也就是把导航栏做成了图片),那可能有些朋友就不会了。用旺铺专业版的应该都知道,模板自带的导航是不可删除的,根本没有删除的按钮。但问题总有解决的办法,这也不例外。淘宝建议店招高度是120px,超过120的话,导航显示可能异常,那到底会有什么异常呢?其实就是会把导航挤下去,如果你的店招高度是150px,那导航就完全不见了,为什么?因为淘宝在店招和导航设置了“max-height: 150px;overflow: hidden;”,意思就是店招和导航的最大高度是150px,如果高出150px,多出来的部分将会自动隐藏。所以要想删除模板自带的导航,只需要把你的店招高度设置为150px即可。好了,说完如何删除模板自带的导航,下面就正式开始进入教程。本教程只有两步,只要两步即可实现旺铺专业版全屏通栏店招,而且你不用打开任何软件,更不需要切图。
第一步、进入旺铺专业版店铺装修页面,双击“店铺招牌”模块,招牌类型选择“自定义招牌”,高度输入150,点击自定义内容区的”源码“




输入以下代码,点击保存


<img src="http://img03.taobaocdn.com/imgextra/i3/128680804/T2YC_FXbJaXXXXXXXX_!!128680804.jpg" usemap="#dianzhao" />

         <map name="dianzhao">

                     <area coords="0,110,102,150" href="#" shape="rect" />

                      <area coords="102,110,215,150" href="#" shape="rect" />

                      <area coords="102,110,328,150" href="#" shape="rect" />

                      <area coords="102,110,440,150" href="#" shape="rect" />

                     <area coords="102,110,554,150" href="#" shape="rect" />

                     <area coords="102,110,666,150" href="#" shape="rect" />

                     <area coords="102,110,780,150" href="#" shape="rect" />

                     <area coords="102,110,950,150" href="#" shape="rect" />

         </map>
请把图片地址改成自己的地址,这里我采用的是MAP标签制作店招导航区链接,如果不会使用MAP标签,请看此教程:如何在图片上添加热点超链接
第二步、点击“装修”菜单下的“样式编辑”,再点击“背景设置”,选择你的页头背景图,横向平铺,居中对齐,最后保存即可。




页: [1]
查看完整版本: 旺铺专业版 全屏通栏店招制作方法(图文教程)