Shopify技术实现：从元字段字符串列表中随机取值展示至前端

• 确认元字段结构
  先确保你的「quotes」元字段选对了类型：如果是后台直接添加的列表型，选「列表（字符串）」；如果是用多行文本存的，要保证每个字符串单独占一行。

• 在主题模板中添加随机逻辑
  根据你元字段的类型，在需要展示的页面模板（首页index.liquid、商品页product.liquid、集合页collection.liquid等）里插入对应的Liquid代码：

  若元字段是「列表（字符串）」类型：

  {% assign quotes_list = shop.metafields.custom.quotes %}
  {% if quotes_list.size > 0 %}
    {% assign random_quote = quotes_list | sample %}
    <!-- 替换成你页面中实际的文本字段标签 -->
    <div class="random-quote">{{ random_quote }}</div>
  {% endif %}
  

  若元字段是「多行文本」类型：

  {% assign quotes_text = shop.metafields.custom.quotes.value %}
  {% assign quotes_list = quotes_text | split: '\n' | compact %}
  {% if quotes_list.size > 0 %}
    {% assign random_quote = quotes_list | sample %}
    <!-- 替换成你页面中实际的文本字段标签 -->
    <div class="random-quote">{{ random_quote }}</div>
  {% endif %}
  

  注意：如果你的元字段不是存在店铺（shop）对象下，而是绑定在产品/集合上，要把shop.metafields.custom.quotes改成对应对象，比如产品页用product.metafields.custom.quotes。

• 适配页面样式
  将代码里的<div class="random-quote">...</div>替换成你页面中原本的文本字段HTML结构，再通过CSS调整字体、位置等样式，确保和页面风格统一。

• 测试验证
  保存模板后刷新各个页面，检查每次加载是否会随机显示不同的字符串；如果元字段为空，页面也不会出现异常内容。

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