欢迎光临散文网 会员登陆 & 注册

Shopify二次开发-根据选择的变体更改描述

2023-04-28 17:11 作者:shopify教程  | 我要投稿

Shopify 中根据选择的变体更改描述的好处:

  1. 提高用户体验:当用户选择不同的变体时,通过更改描述,能够提供更具体的产品信息和详细的描述,帮助客户更好地了解产品,更加自信地进行购买决策。

  2. 优化商品展示:根据不同的变体更改描述,能够更好地突出产品的不同特点和优点,从而促进销售。

  3. 更好的产品展示:变体描述的更改可以提高产品的形象,使其看起来更具吸引力和专业。

  4. 减少退货率:如果客户在购买前了解了更多的产品信息,并且与产品实际符合,则减少了退货或退款的风险,从而对商家和客户都有益处。

  5. 增加产品销量:通过支持不同的变体并更改商品描述,能够吸引更多的客户,并促进更多的销售。

浏览地址https://easy-devs.myshopify.com/,密码zsx.

如何在 Shopify 中根据选择的变体更改描述

步骤1:

从 Shopify 管理面板转到设置> 客户数据> 多属性> 添加定义。

名称:产品变体描述

命名空间和密钥:productVariant.desc

+类型选择:多行文本

点击保存


步骤2:

从 Shopify 管理面板转到产品> 选择一个多属性产品> 编辑多属性> 添加变体描述文案

步骤3:

从 Shopify 管理面板转到模板> 编辑代码 

1. 添加分区文件 > 文件名metafieid-arr


2. metafieid-arr文件添加代码

{% comment %} 获取元字段内容 {% endcomment %}

[

{%- for variant in product.variants -%}

  {"id": {{ variant.id | json }}, "desc": {{ variant.metafields.productVariant.desc | strip_newlines | json }}}

  {% unless forloop.last %},{% endunless %}

{%- endfor -%}

]

3.  打开 main-product 文件 > 添加代码

在 <div class="product product--{{ section.settings.media_size }} 上方添加代码

搜索  product__description 类> 添加代码

4. 使用第三部添加的代码

在搜索 product__info-wrapper 类,在标签中添加自定义属性

data-metafield-arr='{{ metafieldArr }}'

5.  打开 global.js 文件 > 搜索 onVariantChange 文案 > 添加代码

新增 updateDesc 函数 ,使用updateDesc 函数

尽管这些主题的类名可能不同,但是代码适用于所有主题。如果有困难,我很乐意协助您找到代码的位置。如果对你有帮助,请给我们点赞投币 + 关注!。


结论

对于拥有多属性产品的店铺来说,添加变体描述是必不可少的,因为这样可以展示您想要的信息。希望我们提供的信息可以为您带来帮助。


Shopify二次开发-根据选择的变体更改描述的评论 (共 条)

分享到微博请遵守国家法律