专业版旺铺可以实现全屏的店招非常简单,但是基础版旺铺要实现全屏店招有很多方法,今天就讲一个大家比较常用的实现全屏的方法。
本教程有文字+视频,最后还附带了代码。
第一步、店招和导航的安装
第一步:图片制作,首先需要设计一张1920宽160高的图片,如下图:
然后我们进行切片,把整张图片分割成三块,如下所示:
切出来之后是这样滴:
①店招
②导航条
③全屏背景
然后把这三张图片上传到自己的图片空间,这样就完成了第一步,前期的准备工作。
这里可能很多人会问,为什么要把背景做成160高度的呢?
答:淘宝在导航条设定了10个像素的间隙,理论上基础版店铺是无法去除这个间隙的,所以我们把店招 背景做成160.来解决这个问题。
第二步、 更改默认模板设置(关键的一步)
相信很多人都有给店铺设置背景的代码,但是却不能在自己的店铺成功实现全屏店招,根本原因就是忽略了这一步。
其实很简单。
首先进入店铺装修页面,直接参考图片中的①②③步,照做就可以了。
第三步、要实现全屏店招
这里就是我们最最想要的一步了!!!
其实很简单,只需要把下面的代码复制到导航条里面就可以了
body{background-image:url(括号里面替换成你自己的全屏店招背景图片地址);background-repeat:no-repeat;background-position:center 110px;background-attachment:scroll;}
纳尼,导航条什么地方可以放代码了?
哈哈,小白了吧,看这里
大功告成,快行动起来看看效果吧!!
乐发网超市批发网提供超市货源信息,超市采购进货渠道。超市进货网提供成都食品批发,日用百货批发信息、微信淘宝网店超市采购信息和超市加盟信息.打造国内超市采购商与批发市场供应厂商搭建网上批发市场平台,是全国批发市场行业中电子商务权威性网站。
本文来源: 淘宝店铺基础版全屏店招代码