Shopify Metafield 元字段添加和设置

图片[1]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

Shopify Metafield 元字段是对 Shopify 系统的一个重要补充,通过元字段我们可以向 Shopify 的产品页面,产品分类页面,订单页面,客户页面,博客页面等页面添加动态化的数据,帮助我们在 Shopify 产品描述内容之外,添加更多有利于订单转化的数据和内容。

在 Shopify 后台设置页面,打开“Metafield”,或者直接使用链接 xxx.com/admin/metafields (其中的 xxx.com 换成我们自己的网站域名) 打开页面。如下图,我们可以为产品,多属性,产品系列,客户,订单,页面,博客和博客文章添加元字段,并在这些页面展示元字段内容。

图片[2]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

最近 Shopify 在国内不太稳定,如果打不开 Shopify 官网, 或者打开速度很慢,无法注册或者登录 Shopify 账户,请使用“魔法”重试,你懂的。

图片[3]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

我们以下图亚马逊产品页面为范例,在 Shopify 产品页面实现类似的产品规格数据展示效果,来简单说明元字段的添加和设置过程,以及在使用这一功能的过程中可能出现的问题,和这一功能的局限。

需要郑重说明的一点是,以下操作流程仅仅是为了帮助大家理解元字段在 Shopify 网站中是如何工作的,扮演了一个什么样的角色,建议先完整阅读本篇内容,对元字段有更全面认识之后,再决定要不要折腾它,就我自己的网站,以及我了解的很多人的 Shopify 网站来说,可能根本就用不到这一功能。在实际应用过程中,使用元字段很容易把简单的问题复杂化,甚至错误的设置会让网站显得非常不专业。

图片[4]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

元字段的设置整体分为三个操作步骤:

  1. 添加元字段
  2. 添加元字段值
  3. 将元字段内容插入网站前台产品页面

添加 Shopify Metafield 元字段

图片[5]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

在上图页面中点击“产品”,打开下图页面,点击“添加定义”,我们开始向产品添加新的字段。

图片[6]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

元字段名称

是给我们自己看的,客户不会看到这个名称,所有,使用中文,英文,拼音命名都是可以的,只要我们看到这个名称明白这个元字段代表什么内容就可以。这里我填写“Number of Speed”, 来代表电动车的变速档位数量。

命名空间和秘钥

是该元字段的唯一识别码。不同元字段之间的元字段名称是可以重复的,但是命名空间和秘钥必须是唯一的。当我们通过编辑主题代码将元字段内容插入到网站里面的时候,填写的元字段代码部分内容就是“命名空间和秘钥”文本框中我们设置的内容。这里填写的内容用 . 进行分隔,并且只能包含字母、数字、下划线 (_) 和连字符 (-)。同样为了我们阅读或者编辑代码时能够立刻了解该“命名空间和秘钥”代表的含义,建议使用有意义的文字描述,如“bike.number_of_speed”, 而不是随意填写的如“asd.56d_s65f_sdf5”。

描述

是对该元字段含义的详细解释,是我们对该元字段的注释。选填。个人建议是尽可能用元字段名称就能说明该元字段所代表的含义或者数据。需要使用描述才能明白该元字段的含义的话,侧面说明名称设置不够合理或者理想。

向店面 API 请求公开此元字段

有时候也显示为右侧边栏的“访问选项” – 控制如何跨平台访问此字段及其保存的值。这一项控制的是第三方服务是否有权限读取元字段的数据。如果需要把数据提供给 Shopify 应用则此项勾选,这个看我们自己的实际需要。后面可以随时修改。

选择数据类型

是对元字段值的限定或者说定义。目前 Shopify 支持6种类型的数据。分别是

  • 日期和时间(日期 / 日期和时间),
  • 度量(重量 / 体积 / 外形尺寸),
  • 数字(整数 / 小数),
  • 参考(文件 / 页面 / 产品 / 产品多属性 / 产品系列)
  • 文本(单行文本 / 多行文本)
  • 其他(颜色 / JSON / 资金 / 评分 / TRUE 或 FALSE / URL)

每种数据类型对元字段值有各自的格式要求,我们也可以在 Shopify 系统已有的限定的基础上添加我们自己对元字段值的要求。在选择数据类型的时候,我们要先对该元字段有一个比较准确的认识。

例如我设置的自行车变速数(Number of speed)这个数据肯定是一个整数,“18速变速公路自行车”,不会是一个“17.9速变速公里自行车”这样的小数,也不会是日期,或者重量体积等等其他数据类型。因此这个数据类型肯定是选择“整数”的。

一个值还是值列表?

然后系统要我们选择这个元字段可以填充多少个值。这个按照我们需求来选择。再打个比方,文章开头亚马逊上销售的那款电动自行车,我在设置颜色元字段的时候,可以选择一个值,然后这个值在产品页面填写为自行车的主体色 – “黑色”;也可以选择多个值,然后产品页面填写自行车上的所有颜色 – “黑色”和“红色”。

验证

在验证栏,会显示我们所选择数据类型的规则,例如上图我选择“整数”数据类型之后,规则显示为“值必须是没有小数位的数字”。也就是在后面我们为该元字段赋值的时候,必须填写整数。在系统规则的基础上,我们还可以对规则进行进一步限定,例如“整数”数据类型可以自定义“最小值”和“最大值”。还是以变速自行车为例,我限定最小值为“1”,最大值为“30”,如果后面在产品页面给这一元字段赋值时提交的数字是小数,或者数字不在“1~30”这个区间,那么 Shopify 系统就会提示错误而导致无法保存页面设置。

固定元字段定义

保存设置好的元字段定义之前,我们可以选择是否固定定义。固定定义之后,在元字段行最后面就会有一个如下图黄色钉子的图标标记。每个数据类型里面最多可以有20个固定元字段。

图片[7]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

打开新建产品页面,或者任意已经发布的产品页面页面,在页面底布就会出现我们在 Metafield 页面添加的元字段。下图中显示的只有上图已经固定的元字段。未固定的元字段会被折叠,需要点击“显示全部”按钮才会显示。如果没有下图中的“显示全部”按钮,需要我们先保存产品页面并刷新页面,就会显示出来啦。

图片[8]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

添加元字段值

我们在 Metafield 的设置页面只能添加元字段,元字段值则是要去具体页面添加。例如我们在上面添加的是产品页面的元字段,那么我们就需要在产品上传或者编辑页面给元字段赋值 – 填充具体的数据。如果我们在上面添加的是博客页面的元字段,那么我们就需要在博客页面给元字段赋值。

图片[9]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

如上图,不同数据类型的元字段,在填充具体数据时对格式要求也是不同的。我们就按照系统提示和要求填充数据就可以。如果出现比较“怪异”的情况,例如点击元字段“Production Date”(生产日期)出现的不是如上图所示的日期选择器,而是一个颜色选择器,那么就说明我们在设置该元字段的时候,数据类型选择是有问题的。

将元字段内容插入网站前台产品页面

我们在产品编辑页面添加的常规内容如产品标题,描述,价格,图片等等信息会自动显示到网站前台产品页面,而元字段内容则需要我们在 Shopify 主题编辑页面手动添加到网站前台。如下图(使用的是 Shopify 免费主题 Dawn),我想要把元字段关于产品规格描述部分的内容添加到产品页面的 “Specification” 项目下,则需要先选中要编辑的内容,然后点击“行内容”右侧的“插入动态源”小图标,在下拉选项中,就可以看到我们添加到产品页面的其中一部分的元字段了。

图片[10]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

我们按照想要的排序,把元字段插入到行内容中,然后在元字段前面添加对应的文字内容。例如我添加到上图中的元字段 “Wheel Size” 之后,在行内容中只会显示我们在这个产品后台为 “Wheel Size” 这一元字段赋的值 12“。我们还需要在该元字段前面手动输入 “Wheel Size:”, 在产品页面中才会完整显示为 Wheel Size: 12″。

图片[11]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

按照上面的书写规则,我们把需要的元字段依次添加到行内容中,则产品页面会显示出来这些数据。

元字段使用过程中可能出现的问题

那么问题来了。通过上面的方法添加到产品页面的内容,会出现下面的问题:

所有页面显示相同的元字段文字内容

在以前没有元字段功能的时候,我们在 Shopify 主题设置里面添加到产品页面的内容都是“死”的,固定不变的,所有产品页面显示的内容都是一样的。有了元字段功能就可以实现每个产品展示不同的内容,但是如果像上面我们那样操作的话,就会出现下图产品页面显示的问题:

图片[12]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

在网站所有产品页面的 Specification 都会出现我们设置的电动自行车的规格参数,而这个产品是智能手表保护壳,和自行车八竿子打不着,但是我们添加在主题设置里面的内容,无论是不是参数符合产品描述,都会显示,只有我们给元字段赋的值,每个产品都不一样。

其实这个问题的解决办法也很简单:把这部分数据直接写进 Shopify 后台的产品描述里面,就不存在这个问题了。

如果一定要用元字段解决这个问题的话,那么我们也可以把所有元字段的“数据类型”选择为“单行文本”或者“多行文本”,然后在产品页面为元字段赋值的时候,直接填写为完整行:“Wheel size: 12””, 而不是只填写一个具体的值:“12””,这样就可以做到,不同产品页面显示不同的规格参数了。

元字段的调用会受到数据类型的限制

再有一个问题是,元字段的调用会受到数据类型的限制。

例如我想要的操作中,我一共在产品后台添加了8个以固定元字段,和3个未固定元字段。但是在主题编辑页码添加元字段内容到 “Specification” 行内容时,只能调用其中7个元字段。我一直以为是我设置元字段的时候设置错误,后来求助谷歌发现不少人也有这样的问题,最后反复测试才发现,原来调用元字段的时候,会受到数据类型的限制。

例如,我想把 Manual Download 这个元字段添加到“Specification”行内容里面是不行的,因为 Manual Download 的数据类型是“文件”,文件被当做“媒体”处理,所以只能插入到页面中图片或者视频的位置,如下图,右侧文件图标的位置原本是放置图片的,我们选择元字段的时候只支持数据类型为“文件”的元字段。

图片[13]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

这一点我不太清楚为什么要做这样的限制,还是说当时设计这个功能的时候没有考虑这么多。

使用元字段制作亚马逊A+页面

目前,就我个人的元字段功能使用体验来说,它可以帮助我们做出来亚马逊那种 A+ 页面的效果,但是还无法帮我实现我想要的 Landing Page 的效果。Shopify 一直在进化,我们现在已经可以在产品信息块内部,随意调整产品标题,描述,价格,购买按钮等等内容的上下左右位置,那以后有可能会突破所有限制,我们可以在页面中随意设置布局和内容,就像在空白纸张上随意作画一样设计网站页面。

不过就现在的功能,我们可以在产品信息下方随意添加文字,图片,视频等等内容。这些随意添加的板块 Section,我把它叫做“容器”, 我们在给这些容器添加内容的时候,Shopify 系统给了我们两个选择:一个是“连接动态源”,把动态源添加到容器中之后,调用的就是我们在产品后台编辑页面添加的元字段内容,这样我们就可以达到同一个容器,在不同的页面显示不同的内容的效果;另外一个是“选择图片”,是把某一张具体的图片添加到容器中,通过这种方式添加图片到容器中之后,在所有页面该容器位置显示的内容都是一样的。

图片[14]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

根据上面的解释。我们可以直接为产品添加多个内容类型为文件或者文本的元字段。如下图,我添加了6个文件元字段,在 Shopify 产品页面实现类似亚马逊 A+ 页面的效果。

图片[15]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

设置好上面的元字段之后,在每个产品的后台编辑页面,上传提前制作好的图片,或者文字内容。

图片[16]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

然后再产品页面的样式自定义主题设置页面,我们在产品信息下方按照需求添加多个幻灯片或者文本作为“容器”,然后为这些“容器”添加具体内容时,选择“连接动态源”,调用我们已经在产品编辑后台页面添加好的元字段数据。

图片[17]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

然后就做出来如下图的产品页面的效果了。

图片[18]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

虽然这样做出来的效果比使用专业的着陆页制作插件做出来的灵活度自由度没有那么的高,但是应该也能满足不少人的需求了。而且是 Shopify 系统自带功能,完全免费啊。

提个醒,如果要在产品页面插入很多图片的话,记得在上传图片之前先对图片进行无损压缩处理,发布产品页面之后,也记得用网页测速工具测试下页面打开速度。毕竟,订单转化的第一步是客户可以顺利打开我们的产品页面,页面都打不开的话,做的再漂亮也没有什么用处。

目前我用到的 Shopify 元字段功能就是制作一些上图这样的页面,元字段的功能还是挺强大的,尤其是对于懂代码会自己在 Shopify 主题代码编辑中随意调用元字段内容的朋友来说。不过对于大部分独立站卖家朋友,能理解什么是元字段,能合理设置就已经足够了。

关于 Shopify 元字段的使用,大家也可以谷歌搜索 Shopify Metafield 来获得更多内容。后面如果我有碰到其他比较有用的用法的话,再更新分享吧,也欢迎大伙儿留言分享你是如何使用元字段的。

图片[19]-Shopify Metafield 元字段添加和设置 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C
© 版权声明
THE END
喜欢就支持一下吧
点赞14 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容