350模板如何隐藏店铺导航?

本文目录
[隐藏]

店铺导航隐藏的方法有两种,一种是代码方式,另外一种就是修改店招尺寸,已达到隐藏导航的效果。350模板分为基础版模板和专业版模板,两种模板的操作有些许不同,大致是一样的。

下面通过截图一步步教您如何操作。

通过修改导航样式代码,是最快捷方便的方法了。

代码方式

模板编辑页面,鼠标移动到导航上方,点击【编辑】

10

弹出的界面中,点击切换至【样式设置】,复制下方代码。

.skin-box-bd{height:0;overflow:hidden;}

下图所示界面中,代码的最后一行,粘贴上面复制的代码。并且保存。

11

页面跳转之后,可以看到店招与海报图无缝拼接,导航栏已经被隐藏。

效果

店招高度方式

此方式隐藏店招的原理:店招+导航的高度为150px(页头尺寸),其中店招部分高度为120px左右,导航高度为30px左右,如果店招的高度改为150px,那么导航就被挤出页头部分,起到隐藏的作用。

基础版

基础版模板设置方式相对简单,基础版导航是居中950px,具体修改方法如下面截图所示:

模板编辑页面,鼠标移动到店招部分,点击【编辑】。

编辑

弹出的界面中,修改【店招高度】为150,并且保存。

店招高度

页面跳转之后,可以看到下图效果。

隐藏效果

专业版

专业版的修改,相对要复杂一些,要想达到最佳效果,需要准备一张全屏尺寸1920*150px的店招图片,具体操作如下图截图所示:

鼠标移动到店招上方,点击【编辑】。

编辑

弹出的界面中,点击【开始制作图片店招】,(注:此处直接修改店招高度,只会隐藏居中950区域,导航背景图仍然存在。)

开始制作图片店招

页面跳转之后,修改下图所示【店招高度】为150px。

修改尺寸

第一次点击保存,右上角会提示“店招+导航高度超过150像素,导航会显示不出来”。

高度

再次点击保存,页面就会跳转返回了,一共两次点击保存,才可以。

第二次点击保存

返回到下图界面中,【店招高度】一栏,自动改为150px了,点击【保存】即可。

保存

回到编辑页面之后,可以看到导航的居中区域,以及背景图都被隐藏了,但是页头的背景色还存在。此时只需要上传店招背景图就可以了。

效果

店招背景图上传的位置,如下图所示:页头编辑页面,点击【背景设置】,背景图片一栏,点击【单击这里上传】即可。

上传

还有一个地方,也可以上传页头背景图,模板编辑页面,点击页面上方的【全局配置】--【背景设置】--【上传自设图片】,如下图所示。

上传页头背景图

如有不懂的地方,可以通过客服联系我。

 

最后编辑于:2016/2/3作者:芃

芃

分享自己的经验,展示自己的风采,多交流沟通,一起进步成长。