打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
【可视化/装修】动手来装修二:制作自定义导航来链接自定义页面

上一篇教程讲了如何创建自定义页面。但是官方提供的导航模块没办法编辑,那么制作的这些自定义页面就相当于是断了线的风筝,找都找不到了。下面就让我们来解决这个难题。

开始之前,请大家将页面的“导购站点导航栏”模块删除,因为它已经彻底不需要了。

还记得上篇教程里添加的自定义内容区1吗?本篇教程里将用到它。

http://bbs.taobao.com/catalog/thread/16698010-273276892.htm?spm=0.0.0.0.awAX6D

进入“页面编辑”,选择自定义内容区1。分别将下图的html和css代码输入到编辑器里

 

注意粘贴html代码是要切换到源码模式哦。见图。

 

 

输入完保存,效果就如下图所示。看着还可以吧,起码比原来的导航看着顺眼了。

 

以上就是所有操作步骤。是不是很简单?

“不啊”,你可能会说,”谁知道这堆html代码是啥玩意,还有那堆css。。。“

 

好吧,那让我来说明一下吧。下图是上一篇教程里我添加好的所有自定义页面。

 

 

上一篇里已经将MyHome设为首页。这里我在MyHome添加了如上的导航代码,是为了链接这些个自定义页面。如,瑜伽服的链接地址是http://***.uz.taobao.com/p/List1.htm?classId=10102588 (上图里的链接还多了一些字符串,这是淘宝自动给加的,但实际就是这个地址),瑜伽用品的链接是http://***.uz.taobao.com/p/List2.htm?classId=10102888,等等。

我就是在链接里把自定义页面的地址给替换了。不相信的话,可以右键查看一下你的优站的导航地址,是不是类似http://***.uz.taobao.com/List.htm?spm=a2116.7512675.w9010-8920887306.2.ldjRaf&classId=10102588&scene=taobao_shop这样的。

List.htm就是默认列表页面的地址,这个可以在页面属性里看到。(不得不说一句,“页面地址”后面一行字“可以直接在导航模块添加该链接”,导航模块压根就不能编辑,让我们怎么添加)。

 

自定义页面的地址,注意多了一个“/p”

 

看到了吧,就是这个***.uz.taobao.com/p/List1.htm的地址,导航里用的就是这个链接。只要知道了替换,剩下的就好办了吧。classid后面的就是栏目编号,复制过来就可以啦。别的不多说了。

在我的优站里,每个栏目配备一个自定义页面,也就是我做了那一溜自定义页面MyList的原因。然后每个MyList,可以定义不同的布局和图片装饰。

 

以上就是我要给站友们分享的啦。如果你还想问html和css代码的,私下聊吧。这都是导航的外观和样式,就由你自己发挥了。如果不会写,网上好像有那种类似生成器的工具。当然你也可以私下找我要,导航的代码随意用。没办法粘贴文本的,就只能上图片了。

 

另外,教程还会不断更新。比如我的主导航条下面还有一行链接,那些被我用来作为关键词使用了。还有如何添加浮动面板等等。敬请期待。

已发布第三篇教程:【可视化/装修】动手来装修三:活用标签实现搜索/子栏目

http://bbs.taobao.com/catalog/thread/16698010-273415740.htm?spm=0.0.0.0.X8RLnC

 

>>这排版也太费劲了,淘宝论坛就不能换个好用的编辑器

 

>>站友们最后别忘了跟帖分享一下,你们创作的个性化页面哦,供大家学习欣赏<<

 

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
【教材】可视化装修成自定义教程
一款桌面日历设置
【自定义】优站从7月1日开始恢复自定义申请
移动互联网浪潮下 不能不会的淘宝无线店铺装修 图文加视频教程!
淘宝装修教程
【卖家教程
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服