你好,欢迎来到阿里巴巴外贸圈 注册 登出
cn1515421951iign
外贸博士
外贸博士
  • 用户名cn1515421951iign
  • 粉丝429
  • 发帖数500
  • 铜币2158枚
  • 威望-1点
  • 外贸达人
  • 社区居民
  • 忠实会员
  • 社区明星
阅读:13232回复:309

[网站建设]修改代码隐藏阿里巴巴国际站导航栏

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

图片:自定义导航栏-768x460.jpg



如上图,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是导航模块在内页的显示效果,我们这里要修改的也就是第二段,不修改第一段(保持快捷导航的跳转效果)

本部分内容设定了隐藏,需要回复后才能看到
  • hidden的作用是将这个div容器的宽度高度设置为0,同时overflow:hidden是溢出该容器范围的内容全部隐藏
    点击产品预览,就可以看见导航模块在内页消失了,但是依旧有导航栏并且点击可以跳转到对应的模块内容,如下图:
本部分内容设定了隐藏,需要回复后才能看到


作者为主的祥助                                  出自跨境E站
转载请注明出处链接:https://www.losvincent.com/hide-navigation-bar.html
更多干货更新,敬请关注公众号:跨境E站         关注后回复:阿里国际站,可下载阿里巴巴国际站运营干货大全,随时更新

更多原创运营文章:
震惊!阿里国际站P4P直通车定向推广原理剖析
2018阿里国际站精准匹配的开端-标题与关键词
Google 2018搜索指南-RankBrain算法
解析阿里巴巴国际站内页h2标签用法
赶紧Get:如何查看同行店铺数据  
主图识别算法-修改MD5让主图重复使用(上篇)
IIS配置301:不带www跳转到带www的URL的方法
修改代码隐藏阿里巴巴国际站导航栏
[提升排名]无线端下拉框词做移动端排名优化
[无线端优化]无线端APP下拉框排名的效果测试
批发与零售的详情页设计思路区别
如何分析P4P带来的询盘效果
Google更新猫头鹰算法-Project Owl
Dreamweaver CC 2017设置一图多链的方法
发布产品做属性优化-匹配搜索下拉框推荐
旺铺首页和产品详情内页放GIF动态图片的方法

1条评分, 铜币 +1
喜欢23 评分1
微信公众号:跨境E站  | 前沿的阿里巴巴国际站运营优化+Google SEO干货
个人博客:https://www.losvincent.com/
国际站运营企鹅群:287112851   |   VIP技术群-微信:Los_Vincent  
cn1520896764eajl
外贸学长
外贸学长
  • 用户名cn1520896764eajl
  • 粉丝7
  • 发帖数747
  • 铜币116枚
  • 威望0点
沙发#
发布于:2017-10-03 16:00
回复(2) 喜欢(0)     评分
cn1520886891tzjw
禁止发言
禁止发言
  • 用户名cn1520886891tzjw
  • 粉丝162
  • 发帖数4513
  • 铜币499枚
  • 威望-35点
  • 原创达人
  • 社区明星
  • 外贸达人
  • 忠实会员
  • 最爱沙发
  • 社区居民
  • 追星达人
  • 活跃读者
板凳#
发布于:2017-10-05 14:42
用户被禁言,该主题自动屏蔽!
回复(0) 喜欢(0)     评分
cn1515421951iign
外贸博士
外贸博士
  • 用户名cn1515421951iign
  • 粉丝429
  • 发帖数500
  • 铜币2158枚
  • 威望-1点
  • 外贸达人
  • 社区居民
  • 忠实会员
  • 社区明星
地板#
发布于:2017-10-09 14:05
微信公众号:跨境E站  | 前沿的阿里巴巴国际站运营优化+Google SEO干货
个人博客:https://www.losvincent.com/
国际站运营企鹅群:287112851   |   VIP技术群-微信:Los_Vincent  
回复(0) 喜欢(0)     评分
cn1520200888wgyb
外贸博士
外贸博士
  • 用户名cn1520200888wgyb
  • 粉丝55
  • 发帖数7505
  • 铜币1338枚
  • 威望-4点
  • 社区居民
  • 最爱沙发
地下室#
发布于:2017-10-10 09:35
代码 原来有这样的意思啊
智目录,免费产品目录和宣传画册制作的软件,可以一键生成产品目录画册,支持中英文展示,可以直接导出,也可以手机同步分享!快点击链接试试吧:http://www.icatalog.cn
回复(1) 喜欢(1)     评分
cn1515421951iign
外贸博士
外贸博士
  • 用户名cn1515421951iign
  • 粉丝429
  • 发帖数500
  • 铜币2158枚
  • 威望-1点
  • 外贸达人
  • 社区居民
  • 忠实会员
  • 社区明星
下水道#
发布于:2017-11-08 10:11
cn1520200888wgyb:代码 原来有这样的意思啊回到原帖
恩,是的
微信公众号:跨境E站  | 前沿的阿里巴巴国际站运营优化+Google SEO干货
个人博客:https://www.losvincent.com/
国际站运营企鹅群:287112851   |   VIP技术群-微信:Los_Vincent  
回复(0) 喜欢(0)     评分
cn1515421951iign
外贸博士
外贸博士
  • 用户名cn1515421951iign
  • 粉丝429
  • 发帖数500
  • 铜币2158枚
  • 威望-1点
  • 外贸达人
  • 社区居民
  • 忠实会员
  • 社区明星
地下城市#
发布于:2017-11-13 09:07
微信公众号:跨境E站  | 前沿的阿里巴巴国际站运营优化+Google SEO干货
个人博客:https://www.losvincent.com/
国际站运营企鹅群:287112851   |   VIP技术群-微信:Los_Vincent  
回复(0) 喜欢(0)     评分
cn200803833
外贸新生
外贸新生
  • 用户名cn200803833
  • 粉丝3
  • 发帖数19
  • 铜币20枚
  • 威望0点
  • 社区居民
地核#
发布于:2017-11-15 16:42
回复(0) 喜欢(0)     评分
cn1511821894
外贸新生
外贸新生
  • 用户名cn1511821894
  • 粉丝6
  • 发帖数118
  • 铜币50枚
  • 威望0点
地心#
发布于:2017-11-15 20:11
回复(0) 喜欢(0)     评分
cn1520272723ixat
外贸新生
外贸新生
  • 用户名cn1520272723ixat
  • 粉丝4
  • 发帖数53
  • 铜币8枚
  • 威望0点
9重天#
发布于:2017-11-16 09:01
经典
回复(0) 喜欢(0)     评分
cn1521001786vxdp
外贸新生
外贸新生
  • 用户名cn1521001786vxdp
  • 粉丝6
  • 发帖数439
  • 铜币252枚
  • 威望0点
  • 社区居民
  • 忠实会员
10楼#
发布于:2017-11-16 11:13
回复(0) 喜欢(0)     评分
nhidi
外贸新生
外贸新生
  • 用户名nhidi
  • 粉丝11
  • 发帖数77
  • 铜币38枚
  • 威望0点
11楼#
发布于:2017-11-16 11:44
回复(0) 喜欢(0)     评分
gzliangshan
外贸新生
外贸新生
  • 用户名gzliangshan
  • 粉丝6
  • 发帖数22
  • 铜币2枚
  • 威望0点
12楼#
发布于:2017-11-16 14:25
iphone 7 case
做一头牛
回复(0) 喜欢(0)     评分
cn1514322836qdgv
初来乍到
初来乍到
  • 用户名cn1514322836qdgv
  • 粉丝6
  • 发帖数1
  • 铜币0枚
  • 威望0点
13楼#
发布于:2017-11-16 16:48
感谢分享啊!
回复(0) 喜欢(0)     评分
wzguoshunda
初来乍到
初来乍到
  • 用户名wzguoshunda
  • 粉丝0
  • 发帖数10
  • 铜币13枚
  • 威望0点
14楼#
发布于:2017-11-17 09:11
回复(0) 喜欢(0)     评分
cn1517884821dsyr
外贸学长
外贸学长
  • 用户名cn1517884821dsyr
  • 粉丝7
  • 发帖数85
  • 铜币111枚
  • 威望0点
  • 社区居民
15楼#
发布于:2017-11-17 09:19
谢谢楼主分享
回复(0) 喜欢(0)     评分
cn1520876012cuvv
外贸本科生
外贸本科生
  • 用户名cn1520876012cuvv
  • 粉丝5
  • 发帖数251
  • 铜币522枚
  • 威望0点
  • 社区居民
16楼#
发布于:2017-11-17 09:33
666666666
最深的夜 星光会继续指引路
回复(0) 喜欢(0)     评分
cn1513190260
外贸新生
外贸新生
  • 用户名cn1513190260
  • 粉丝8
  • 发帖数85
  • 铜币9枚
  • 威望0点
17楼#
发布于:2017-11-17 11:12
666666666
回复(0) 喜欢(0)     评分
yrsupply
外贸新生
外贸新生
  • 用户名yrsupply
  • 粉丝17
  • 发帖数44
  • 铜币62枚
  • 威望0点
  • 社区居民
18楼#
发布于:2017-11-17 14:24
df4s56f4d56s
回复(0) 喜欢(0)     评分
cn1518124129yuic
外贸新生
外贸新生
  • 用户名cn1518124129yuic
  • 粉丝3
  • 发帖数8
  • 铜币1枚
  • 威望0点
19楼#
发布于:2017-11-17 15:24
围观
回复(0) 喜欢(0)     评分
上一页
游客