本站专注于数据化运营,涉及阿里巴巴国际站运营,Google SEO,独立站建设等内容,欢迎各位发文投稿
博主:为主的祥助 提供阿里巴巴国际站运营诊断服务 QQ:2067552955
在线培训:玩转Google SEO:从入门到精通课程,报名VIP后联系我记录,可返红包30+送神器工具

修改代码隐藏阿里巴巴国际站导航栏

阿里巴巴国际站 为主的祥助 1701次浏览 4评论

隐藏阿里国际站导航栏,同时保持跳转效果

阿里巴巴国际站产品编辑页面有导航跳转功能,通过设置不同的导航,可以让客户点击导航栏快速跳转到对应的模块内容进行浏览。不过系统自己预设的导航栏的显示效果差强人意,而供应商选择设计的独立的导航条图片来作为展示效果的话,容易产生重复效果的问题。


阿里国际站导航栏代码

如上图,Products Description导航模块文本和图片的导航文字重复,看起来有些影响视觉。那么如何隐藏国际站默认的导航,同时又保持点击跳转的快捷效果呢?思路来源:包装-皮皮爹  感谢提供

方法如下

  •  点击源代码按钮,切换到HTML源代码模式
  • Ctrl+F,输入要隐藏的导航模块的文本内容,定位到代码如:

<div id=”ali-anchor-AliPostDhMb-8r11o” class=”mceSectionContainer” style=”padding-top: 8px;” data-section=”AliPostDhMb-8r11o” data-section-title=”Product Description”>
<div id=”ali-title-AliPostDhMb-8r11o” style=”padding: 8px 0; border-bottom: 1px solid #ddd;“><span style=”background-color: #ddd; color: #333; font-weight: bold; padding: 8px 10px; line-height: 12px;”>Product Description</span></div>

第一段DIV是导航模块跳转的控制,和编辑框右侧预先设置的导航模块信息对应,若删除,在详情页则无可点击的跳转导航

第二段DIV是导航模块在内页的显示效果,我们这里要修改的也就是第二段,不修改第一段(保持快捷导航的跳转效果)

  • 将第二段div的红色部分删除,修改为:style=”width:0; height:0; overflow: hidden;”  之后切换回正常编辑模式
  • style=”width:0; height:0; overflow: hidden;” 的作用是将这个div容器的宽度高度设置为0,同时overflow:hidden是溢出该容器范围的内容全部隐藏
  • 点击产品预览,就可以看见导航模块在内页消失了,但是依旧有导航栏并且点击可以跳转到对应的模块内容
作者:为主的祥助??  转载请保留页面地址: https://www.losvincent.com/hide-navigation-bar.html ‎
更多跨境平台运营技术干货,请关注公众号:跨境E站(GlobalSEO)    
一个有灵魂的公众号,专注更新外贸领域跨境电商平台的运营操盘和数据优化,独立站搭建,Google SEO和SEM Marketing等优质内容

转载请注明:跨境E站 » 修改代码隐藏阿里巴巴国际站导航栏

Some kind of trouble

微信公众号:跨境E站(GlobalSEO) ,一个有灵魂的公众号,专注更新外贸领域跨境电商平台的运营操盘和数据优化,独立站搭建,Google SEO和SEM Marketing等优质内容
本站服务:承接阿里国际站运营,官网建站等服务

微信 OR 支付宝 扫描二维码
为本文作者 打个赏
pay_weixinpay_weixin微信公众号
知识付费,金额随意 亲的支持是我更新的动力!~
喜欢 (8)or分享 (0)
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(4)个小伙伴在吐槽
  1. 原有的那个导航栏不要添加不就可以了吗?为什么还要用到代码这么麻烦?
    六六2018-06-11 21:40 回复
    • 不添加导航栏的话,没有点击导航跳转到对应模块的效果呢 这个方法解决的就是隐藏系统导航栏样式,但是同时不影响跳转模块的效果 不过目前这个方法被阿里修复堵上了似乎,后续更新新的方法可以关注网站
      为主的祥助2018-06-17 15:05 回复
  2. 博主,你好,boke112导航特来拜会,已将贵站收录到博客导航和博客目录的综合资讯类,谢谢支持!
    boke112导航2018-10-12 23:19 回复

每日一学,人人都是运营总监

联系我
切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录
切换登录

注册