公告:唯艺客户端火爆上线,模板自动安装,国际安全认证~
马上注册,领取百套精美模板(永久免费) 个人中心 | 下载客户端 | 客户服务 | 登录 | 注册
您所在的位置:淘宝装修教程 > 淘宝装修代码

高级代码装修精美导航

2015-03-25 10:18:16

导航是淘宝店铺装修中的另一大需要卖家们注意的因素。导航作为引导工具,可以让卖家们掌握主动权,引导客户去浏览、购买产品。除了仔细分类外,一个精美制作的导航更能吸引客户按照卖家的引导去走。下面就来学习一下怎样编辑、装修导航吧。


1、首先,登录“卖家中心”,点击“店铺装修”,选择导航处的“编辑”一项。


2、在打开的弹窗里面选择“添加”。


3、添加宝贝分类至导航操作如下:



4、添加自定义页面(基础页面)至导航操作如下:

 


5、添加自定义链接至导航操作:

 


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

 


7、当上述操作完成后,在前台展示效果如下:

 

此外,导航条的颜色也可以进行自定义更换设置,不过需要一些css的小技巧。



详解淘宝店铺导航CSS代码使用修改技巧


1、首先我们进入到店铺的装修页面,将鼠标放在导航上面会出现“编辑”字样,单击,选择“显示设置”选项卡

 



2、修改导航分类下面的背景色,代码如下:

.skin-box-bd .link{background:#000000;}


 
 
3、如果你想要更加个性,而不想只要简单的纯色块的话,可以自己做图片,然后连接上去,代码如下:
.skin-box-bd .link{background:url(http://img03.taobaocdn.com/imgextra/i3/682206429/T210IOXCdXXXXXXXXX_!!682206429.jpg);}


将“图片连接”换成你的图片的连接就可以了,一般都是自己做好然后上传到淘宝图片空间,然后链接就可以了!在图片空间点击对应图片下方的“链接”按钮可以直接复制图片链接,替换到代码里就可以了!

 

 


 
4、导航背景色代码(除去“所有分类”)如下:
.menu-list .link{background:#000000;}

 


5、导航栏文字(除去“所有分类”)如下:
.menu-list .menu .title{color:#颜色代码;font-size:字号px;}

 


6、“所有分类”的背景色代码如下:
.all-cats .link{background:#000000;}

 


7、“所有分类”的文字代码如下:
.all-cats .link .title{color:#颜色代码;font-size:字号px;}

 


8、二级分类文字代码如下:
.popup-content .cats-tree .fst-cat .cat-name{font-size:字号px;color:#颜色代码;font-weight:bold/bolder/normal;}

 



 
9、二级分类背景代码如下:
.popup-content{background:#000000;}

 


10、三级分类文字代码(除去“所有宝贝”分类)如下

popup-content .cats-tree .snd-pop-inner{font-size:字号px;color:#颜色代码;font-weight:bold/bolder/normal;}




11、一级导航分类(除去“所有宝贝”分类)分隔线颜色代码如下:
.menu-list .menu{border-color:#FFFFFF;}

 


12、鼠标滑过一级分类导航文字变换背景色代码如下:

.menu-list .menu-hover .link{background:#000000;}



13鼠标滑过一级分类导航文字变换颜色代码如下:
.menu-list .menu-hover .link .title{color:#FFFFFF;}

 


注意事项

注意颜色代码的提取,可以用PS等工具选择你喜欢的颜色

制作图片链接时,注意图片的大小



      本文出自唯艺网店装修平台(www.weiyi5.cc),转载请注明出处!

0

相关教程

懒人专区:淘宝模板-免费安装查看更多>

  • 奢侈名表 简约奢华 饰品珠宝淘宝模板

    奢侈名表 简约奢华 饰品珠宝淘宝模板

    人气:38980
  • 日用杂货 清新简约 生活兴趣网店模板

    日用杂货 清新简约 生活兴趣网店模板

    人气:45643
  • 双十一 淘宝活动促销模板 潮流女装

    双十一 淘宝活动促销模板 潮流女装

    人气:33016
  • 高雅大牌 舒爽浅色 女包女鞋网店模板

    高雅大牌 舒爽浅色 女包女鞋网店模板

    人气:56240
  • 清新优雅 简约背景 内衣服饰淘宝模版

    清新优雅 简约背景 内衣服饰淘宝模版

    人气:1
  • 奢华香包 大图模块 珠宝鞋靴淘宝模版

    奢华香包 大图模块 珠宝鞋靴淘宝模版

    人气:0
  • 时尚简约 瀑布流 装饰家居淘宝模板

    时尚简约 瀑布流 装饰家居淘宝模板

    人气:35416
  • 英伦雅致 潮流鞋靴 精品鞋包网店模板

    英伦雅致 潮流鞋靴 精品鞋包网店模板

    人气:57481