Big Cartel首页Shop Now按钮代码及放置位置咨询

基础可用代码 #

将以下代码片段放置到你找到的包含shop now关键词的代码段同级位置即可：

<a href="/your-shop-landing-page" class="header-cta">Shop Now</a>

• 把/your-shop-landing-page替换成你店铺商品集合页的实际访问路径
• 把header-cta替换成当前主题页头区域按钮使用的通用类名，即可自动匹配现有页头样式，不需要额外编写CSS

放置位置判断标准 #

• 代码要放在页头的操作区容器内，该容器一般和logo容器、主导航容器、搜索组件、购物车图标组件保持同级，常见类名包含header-actions、header-right、nav-ctas
• 不要将代码嵌套到其他组件的子标签内部，放在操作区容器的末尾、购物车图标代码的前侧，就符合常规页头布局逻辑
• 如果你找到的shop now相关内容是被注释包裹的（格式为<!-- 代码内容 -->），直接删除前后的注释标记即可恢复原有按钮，不需要新增代码

校验步骤 #

• 保存代码后清空站点缓存、CDN缓存
• 前台刷新页头，检查按钮显示位置、样式是否和整体风格统一
• 点击按钮验证跳转路径是否正确，如有样式错位直接复用同区域其他按钮的类名即可修复

内容的提问来源于stack exchange，提问作者Cass