👀宝子们！今天来给大家分享Shopify的面包屑功能😎

 💥【什么是面包屑🧐】


宝子们，Shopify的面包屑功能就像店铺里的小导航员🧭。比如说从首页逛到“服装”区，再到“连衣裙”子区，面包屑导航会显示“首页 > 服装 > 连衣裙”，这样咱就清楚自己在店铺里的位置啦，超方便的😘

 




 💥【面包屑作用】

宝子们，Shopify电商平台上的面包屑导航作用可大啦😎

 

💥提升用户体验✨

在Shopify店铺里，面包屑导航能清楚展示咱的浏览路径，像从首页到产品分类再到具体产品页。这样我们想回上层页面就很方便，不会在一堆商品里迷路啦🤗

 

 💖利于搜索引擎优化（SEO）📈

对于Shopify来说，面包屑导航能让搜索引擎更好地理解店铺结构哦。比如“男装 > 衬衫”这样的结构，当搜“衬衫”时，相关页面就更容易被找到，排名也可能更靠前呢👏

 

 💕提高网站转化率👍

可以提高网站的转化率，一个商品只有两个类目，一个是大类目，一个就是我们出现商品的一个T恤的类目的时候就只有这两个关键词，但是如果把它做了一个多级类目的导航的时候，消费者搜索多级类目导航的时候都触发了我的关键词，搜索引擎就能通过大数据将我的产品更精准地推送给消费者，这时候他就可以提高我们产品的一个转化率了。


 💥【如何在Shopify中正确使用面包屑】

宝子们，知道面包屑的作用后，来看看在Shopify里怎么正确使用吧🧐


以默认主题Dawn为例，在产品页顶部会显示面包屑导航，但有时只有一级导航Home，二级集合页导航不见了😕


其实这是Shopify的一种逻辑机制，有两种面包屑导航显示方式呢👇

 【图一】第一种情况


当直接从首页点击产品时，没经过集合页就进入产品页，url里没有集合页字样。产品和集合页是从属关系，一个产品可能对应多个集合，这时Shopify就不会显示集合页这个二级导航啦。

【图一】



 【图二】第二种情况


当从集合页点击产品进入产品页时，url里会显示归属的集合页，这样面包屑就能显示二级集合页导航啦。

【图二】



**问题来了！！！为什么有些网站点击集合页产品的时候也没有显示二级集合页导航？别急，让我们用以下几步设置一下吧**
 



 💥【代码实现】


那我们来实现一下在集合页传入参数显示集合页二级面包屑吧（以Dawn主题为例）👇

 


1. 点击主题的...，然后找到“Edit code”，进入主题编辑页面。



2. 搜索card - product，找到snippets -> card.product.liquid，其他主题可以试试搜索priduct - grid - item.liquid或者product - item.liquid。

 


 3. 点击代码区域!!!按ctrl + f，弹出搜索框，输入`card_product.url`，然后使用`crad_product.url|within:collection`，点击Replace All替换，最后别忘了按右上角的保存按钮哈。





4. 撒花🎉，这样在集合页点击进入产品页时，面包屑就能显示集合页二级导航啦。


 💥【结尾】

宝子们，本期教程就到这儿啦。Shopify面包屑导航还有很多玩法，像自定义集合页二级导航、二三级集合页的四级导航、面包屑导航的结构化标记（SEO必要）呢，让我们一起期待😘



我是有四年Shopify开发经验的阿尧，有100 + 完整项目经验，帮多个大厂建站和做SEO代码优化、速度优化哦。感谢宝子们的观看与支持🥰




#Shopify #面包屑功能 #电商运营 #Shopify店铺