我想在导航上新增一些分类或链接如何设置呢?
更新日期:2014/10/28 10:59:23    浏览次数:5052

新旺铺的导航为系统自带模块,无法删除,编辑导航可以选择自己需要的页面或分类进行展现

如何编辑旺铺2012 的导航呢?进入店铺后台,选择导航处的”编辑“

1.在打开的弹窗里面选择”添加“:

2.添加宝贝分类至导航操作如下:

3.添加页面至导航操作如下:

 

 

4.添加自定义链接至导航操作如下:

 

5.设置好的内容可以在此调整位置或删除:

6.在前台展示如下:

 

另外,新旺铺导航是可以更换颜色和式样的哟 这里需要一些css的小技巧 。操作位置如下:

 

下面是自定义导航的示例. 首先要了解,什么是自定义css

 

CSS 也叫层叠样式表单, 是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言

店铺导航开放css设定,就是说让卖家通过css来让导航展现的更加丰富自定义,交给卖家控制。

下面,举几个简单的例子来说明下这个功能的作用

 

 

上面 这个是店铺官方模板导航样式, 但是我觉得这个背景色我不喜欢,我想换一个背景颜色或者文字颜色, 在css里面,设置背景色使用background-color: #颜色值#, 文字颜色是 color: #颜色值#

【设置整个导航的背景】

.tshop-pbsm-shop-nav-ch{

background-color: #F37C06;

}

设置导航中bd部分的背景】

.tshop-pbsm-shop-nav-ch .skin-box-bd .menu-list{

     background-color #F37C06;

}

设置导航文字的背景, 因为系统中默认有很多地方有背景,所以这个地方需要覆盖完全】

 

.tshop-pbsm-shop-nav-ch .skin-box-bd .menu-list .menu,.tshop-pbsm-shop-nav-ch .all-cats .link{

     background-color: #F37C06;

     background-image: none;

}

导航文字的右边框的颜色】

.tshop-pbsm-shop-nav-ch .skin-box-bd .menu-list .menu,.tshop-pbsm-shop-nav-ch .all-cats .link{

     border-color: #FFFFFF;

}

设置文字颜色】

.tshop-pbsm-shop-nav-ch .title{

     color: white;

}

 

tshop-pbsm-shop-nav-ch .title, .link…. 这些就是css的选择器,代表我想把哪个背景色或者文字颜色应用在哪个元素上面。看看效果: 

 

几行CSS,你的导航就是另外一种风格了。

但这个时候,我想让“所有分类有不同的展现,来突出这个地方,吸引下买家,

.tshop-pbsm-shop-nav-ch .all-cats-trigger .title{

font-family:微软雅黑;

font-size:16px;

color:black;

}

我把字体调整的大一点,然后设置成黑色了。

 

 

简单的教程就到这里,想了解更多样式,可以来这里学习css

http://www.w3cschool.cn/css_intro.html

 

 

补充:

1:可以注意到, 每个样式最前面有个.tshop-pbsm-shop-nav-ch 前缀, 意思是这个样式只能作用在导航上面,而不会影响到其他模块样式.

如果卖家在写的时候不加上这个前缀,系统会默认帮助加上, 同样是为了这个样式只作用在导航上,不影响到其他模块

2: css的样式值,同样有些样式是不能写的,比如 expression这个可执行js代码的属性,是不允许使用的.

   具体样式使用的白名单请参考

 

旺铺2012页头整体限高150PX。所以当店招设为150PX时,导航会被挤下去。

所以页头过高时,导航会被截断。解决办法就是调整店招高度。

 


正在加载,请稍后...