Shopify二次开发之五：元字段（Metafields）

news2024/12/23 17:28:46

解释

Shopify Metafields 是一种用于存储和管理自定义数据的功能。它们允许商户在商城中的产品、订单、客户、Page等对象上添加自定义字段，以满足特定业务需求。

操作

1、添加Custom data

可以为Products、Pages添加自定义数据，比如选择了Pages，那么在任何Page模板下，可以用page.metafields.custom.metafield_name.value访问添加的特定类型的元字段内容，又比如选择了Products，那么在任何product模板下，可以用product.metafields.custom.metafield_name.value访问添加的特定数据的元字段内容，Collections同上，其它的比如Orders也有特定的用法。

就拿pages做举例

2、选择特定类型的数据

为Pages添加自定义内容的数据type，可以有普通数据type：文本、日期、布尔、json、整数等，也可以有引用数据type：product、file、collection、page等。

3、为Page配置元子段和值

选择一个页面

show all

配置元字段值

4、模板访问

在page.xxx.json，通过.value访问元字段内容

<style>
  .page_title {
    font-size: 36px;
    padding: 24px 20px;
    background: #900C3F;
    color: #EFECCA;
  }
  .metafiled-section {
    background: #900C3F;
    padding: 20px;
    border-bottom: 1px solid #CFD8DC;
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .metafiled-section .metafiled-section-title {
    font-size: 24px;
    font-weight: bold;
    line-height: 24px;
    color: #fff;
  }
  
  .metafiled-section .metafiled-section-content {
    display: flex;
    gap: 24px;
  }

  .metafiled-section .obj-content {
    border-radius: 12px;
    background: #FFFF8D;
    padding: 16px;
  }

  .metafiled-section .obj-content .code {
    display: flex;
    gap: 12px;
    font-weight: bold;
    padding: 12px 0;
  }

  .metafiled-section .obj-content ul {
    padding-bottom: 12px;
    border-bottom: 1px solid #900C3F;
  }

  .metafiled-section .obj-content ul:last-child {
    border: none;
  }
  
  .metafiled-section .obj-content ul li {
    font-weight: bold;
    padding: 6px 0;
    display: flex;
    align-items: center;
  }
  
  .metafiled-section .obj-content ul li span:nth-child(1) {
    width: 132px;
  }
  .metafiled-section .obj-content ul li span:nth-child(2) {
    flex: 1;
  }
  .metafiled-section .obj-content ul li span:nth-child(3) {
    flex: 1;
  }
  .metafiled-section .metafiled-section-content > div {
    border-radius: 12px;
    padding: 16px;
    font-weight: bold;
    background: #FFFF8D;
    flex: 1;
  }
</style>

<h1 class="page_title">{{ page.title }}</h1>

<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: single line text</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.single_line_text.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.single_line_text.value }}</span></div>
  </div>
</div>
<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: list single line text</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.list_single_line_text.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.list_single_line_text.value }}</span></div>
  </div>
  <div class="obj-content">
    {% assign list_line_text = page.metafields.custom.list_single_line_text %}
    <div class="code">
      <span>Accessing list_single_line_text :</span>
      <span>
        {% raw %}{% assign list_line_text = page.metafields.custom.list_single_line_text.value %}{% endraw %}
      </span>
    </div>
    <div class="code">
      <span>for loop :</span>
      <span>
        {% raw %}{% for line_text in list_line_text.value %}{{ line_text }}{% endfor %}{% endraw %}
      </span>
    </div>
    <ul>
      {% for line_text in list_line_text.value %}
        <li><span>{% increment idx %} :</span><span>{% raw %}{{ line_text }}{% endraw %}</span><span>{{ line_text }}</span></li>
      {% endfor %}
    </ul>
  </div>
</div>
<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: multi line text</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.multi_line_text.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.multi_line_text.value }}</span></div>
  </div>
</div>
<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: integer</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.integer.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.integer.value }}</span></div>
  </div>
</div>
<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: true of false</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.boolean.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.boolean.value }}</span></div>
  </div>
</div>
<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: json</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.json.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.json.value }}</span></div>
  </div>
</div>
<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: date</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.date.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.date.value }}</span></div>
  </div>
</div>
<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: money</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.money.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.money.value }}</span></div>    
  </div>
</div>
<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: product</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.product.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.product.value }}</span></div>
  </div>
  <div class="obj-content">
    {% assign product_value = page.metafields.custom.product.value %}
    <div class="code">
      <span>Accessing Reference Object :</span>
      <span>
        {% raw %}{% assign product_value = page.metafields.custom.product.value %}{% endraw %}
      </span>
    </div>
    <ul>
      <li><span>title :</span><span>{% raw %}{{ product_value.title }}{% endraw %}</span><span>{{ product_value.title }}</span></li>
      <li><span>featured_image :</span><span>{% raw %}{{ product_value.featured_image }}{% endraw %}</span><span>{{ product_value.featured_image }}</span></li>
      <li><span>price :</span><span>{% raw %}{{ product_value.price | money }}{% endraw %}</span><span>{{ product_value.price | money }}</span></li>
      <li><span>url :</span><span>{% raw %}{{ product_value.url | link_to: product_value.url }}{% endraw %}</span><span>{{ product_value.url | link_to: product_value.url }}</span></li>
    </ul>
  </div>
</div>
<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: list product</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.list_product.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.list_product.value }}</span></div>
  </div>
  <div class="obj-content">
    <div class="code">
      <span>Accessing Reference Object :</span>
      <span>
        {% raw %}{% assign list_product = page.metafields.custom.list_product.value %}{% endraw %}
      </span>
    </div>
    <div class="code">
      <span>for loop :</span>
      <span>
        {% raw %}{% for product_item in list_product %} {{ product_item.attr }}{% endfor %}{% endraw %}
      </span>
    </div>
    {% assign list_product = page.metafields.custom.list_product.value %}
    {% for product_item in list_product %}
      <ul>
        <li><span>title :</span><span>{% raw %}{{ product_item.title }}{% endraw %}</span><span>{{ product_item.title }}</span></li>
        <li><span>featured_image :</span><span>{% raw %}{{ product_item.featured_image }}{% endraw %}</span><span>{{ product_item.featured_image }}</span></li>
        <li><span>price :</span><span>{% raw %}{{ product_item.price | money }}{% endraw %}</span><span>{{ product_item.price | money }}</span></li>
        <li><span>url :</span><span>{% raw %}{{ product_item.url | link_to: product_item.url }}{% endraw %}</span><span>{{ product_item.url | link_to: product_item.url }}</span></li>
      </ul>
    {% endfor %}
  </div>
</div>
<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: collection</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.collection.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.collection.value }}</span></div>
  </div>
  <div class="obj-content">
    {% assign collection = page.metafields.custom.collection.value %}
    <div class="code">
      <span>Accessing Reference Object :</span>
      <span>
        {% raw %}{% assign collection = page.metafields.custom.collection.value %}{% endraw %}
      </span>
    </div>
    <ul>
      <li><span>title :</span><span>{% raw %}{{ collection.title }}{% endraw %}</span><span>{{ collection.title }}</span></li>
      <li><span>url :</span><span>{% raw %}{{ collection.url | link_to: collection.url }}{% endraw %}</span><span>{{ collection.url | link_to: collection.url }}</span></li>
    </ul>
  </div>
</div>
<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: metaobjects</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.metaobjects.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.metaobjects.value }}</span></div>
  </div>
  <div class="obj-content">
    {% assign metaObject = page.metafields.custom.metaobjects.value %}
    <div class="code">
      <span>Accessing MetaObject :</span>
      <span>
        {% raw %}{% assign metaObject = page.metafields.custom.metaobjects.value %}{% endraw %}
      </span>
    </div>
    <ul>
      <li><span>name :</span><span>{% raw %}{{ metaObject.name }}{% endraw %}</span><span>{{ metaObject.name }}</span></li>
      <li><span>gender :</span><span>{% raw %}{{ metaObject.gender }}{% endraw %}</span><span>{{ metaObject.gender }}</span></li>
    </ul>
  </div>
</div>
<div class="metafiled-section">
  <div class="metafiled-section-title">Metafield Type: file</div>
  <div class="metafiled-section-content">
    <div class="metafiled-name">Liquid Metafield Code: <span>{% raw %}{{ page.metafields.custom.file.value }}{% endraw %}</span></div>
    <div class="metafiled-value">Metafield Value: <span>{{ page.metafields.custom.file.value }}</span></div>
  </div>
  <div class="obj-content">
    {% assign file = page.metafields.custom.file.value %}
    <div class="code">
      <span>Accessing Reference Object :</span>
      <span>
        {% raw %}{% assign file = page.metafields.custom.file.value %}{% endraw %}
      </span>
    </div>
    <ul>
      <li><span>file :</span><span>{% raw %}{{ file | image_url: width: 100 | image_tag }}{% endraw %}</span><span>
        {{ file | image_url: width: 100 | image_tag }}
      </span></li>
    </ul>
  </div>
</div>

模板渲染

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1289379.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

关系型数据库-SQLite介绍

关系型数据库-SQLite介绍

阅读更多...
使用pandas制作图表

使用pandas制作图表

数据可视化对于数据分析的重要性不言而喻&#xff0c;一个优秀的图表有足以一眼就看出关键所在。pandas利用matplotlib实现绘图。能够提供各种各样的图表功能&#xff0c;包括: 单折线图多折线图柱状图叠加柱状图水平叠加柱状图直方图拆分直方图箱型图区域块图形散点图饼图多子…
阅读更多...
网络和Linux网络_11(数据链路层)以太网(MAC帧)协议+局域网转发+ARP协议

网络和Linux网络_11(数据链路层)以太网(MAC帧)协议+局域网转发+ARP协议

目录 1. 以太网协议 1.1 MAC地址 1.2 以太网帧格式 2. 局域网转发原理 2.1 数据碰撞和交换机 2.2 最大传输单元MTU 3. ARP协议 3.1 ARP协议格式 3.2 模拟APR协议工作过程 3.3 ARP缓存表 4. 重看TCP/IP四层模型 本篇完。 1. 以太网(MAC帧)协议 网络层的IP协议并不是…
阅读更多...
怎么下载抖音视频无水印？教你三个无水印下载抖音视频方法

怎么下载抖音视频无水印？教你三个无水印下载抖音视频方法

怎么下载抖音视频无水印&#xff1f;抖音已经成为了我们日常生活与工作的无法割舍的一部分&#xff0c;每天数以亿计的用户在进行创作分享。在这个平台上&#xff0c;用户可以通过自己的所见所想进行创作和分享记录美好瞬间。然而&#xff0c;有些用户希望能够将自己喜欢的抖音…
阅读更多...
PHP：解决一个字符串中的斜杠 / 进行 JSON 编码时，斜杠被转义为 \/

PHP：解决一个字符串中的斜杠 / 进行 JSON 编码时，斜杠被转义为 \/

一、修改前 问题代码 直接通过JSON编码&#xff0c;就会出现问题 代码 $url SO/.$fileName; echo json_encode($url); 效果 二、解决后 代码 使用 json_encode 函数的第二个参数 JSON_UNESCAPED_SLASHES 来禁止对斜杠进行转义 $url SO/.$fileName; echo json_encode…
阅读更多...
电力仪表在工厂车间设备电能管理系统的设计-安科瑞黄安南

电力仪表在工厂车间设备电能管理系统的设计-安科瑞黄安南

摘 要&#xff1a;基于车间用电设备的电能管理系统架构思路及实施方法&#xff0c;从硬件和软件方面对此方法进行了阐述。对车间旧设备改造以及新的电能管理系统提供一种思路和便捷的方法。 关键词&#xff1a;电能管理系统&#xff1b;多功能电力仪表&#xff1b;PLC&#x…
阅读更多...
【后端】JVM 远程调试

【后端】JVM 远程调试

前言 再好的代码，也还是有瑕疵的，不是代码不给力，是线上问题太牛逼太玄幻。这不刚部署就出现了问题，幸好还是测试的时候，早点发现早点解决，不给任何人带来不必要的损失，是我做人的原则，只要钱到位，任何问题都不是问题。 JVM 远程调试 不得不说 IDEA 和 宝塔配合是真…
阅读更多...
【FastApi】—— uvicorn启动程序出现端口冲突

【FastApi】—— uvicorn启动程序出现端口冲突

文章目录 &#x1f356; 前言&#x1f3b6;一、问题描述✨二、更改方案&#x1f3c0;三、运行结果&#x1f3c6;四、知识点提示 &#x1f356; 前言 【FastApi】—— uvicorn启动程序出现端口冲突 &#x1f3b6;一、问题描述 描述&#xff1a; INFO: Will watch for changes …
阅读更多...
Spring Cloud版本导致的java.lang.NoSuchFieldError: sharedInstance异常

Spring Cloud版本导致的java.lang.NoSuchFieldError: sharedInstance异常

目录 一、问题现象二、解决办法1、本次异常配置2、修改后的配置 三、原因分析 一、问题现象 2023-12-05 16:21:53.680]|[ INFO]|[80173]|[main]|[]|[]|[trationDelegate$BeanPostProcessorChecker:335]|[Bean org.springframework.cloud.client.loadbalancer.reactive.LoadBal…
阅读更多...
css 3D背景反转实现

css 3D背景反转实现

body{/* 透视 */perspective: 800px; } div{transform-style:preserve-3d;width:259px;height:396px;margin: 100px auto;position: relative; } div img{position: absolute;width:259px;height:396px;left:0;top:0;transition: all linear 2s;z-index: 0; } div img:nth-chil…
阅读更多...
使用Python内置库实现数据的加密与校验

使用Python内置库实现数据的加密与校验

更多资料获取 &#x1f4da; 个人网站&#xff1a;ipengtao.com 数据的安全性是现代应用程序中不可忽视的一个重要方面。在Python中&#xff0c;我们可以利用内置的加密和校验库来保护敏感信息。本文将深入讨论如何使用Python内置库实现数据的加密和校验&#xff0c;为开发者提…
阅读更多...
java实验：数据库应用（idea+mysql+php)设计用户注册和登录

java实验：数据库应用（idea+mysql+php)设计用户注册和登录

设计用户注册和登录界面&#xff0c;实现用户注册和登录操作。 设计用户注册/登录界面;使用工具在MySQL中创建user表&#xff0c;包括学号、姓名、密码、专业、班级&#xff1b;实现注册操作&#xff1a;在user表中插入一条新纪录&#xff0c;但学号不能重复&#xff1b;实现登…
阅读更多...
通用plantuml 时序图(Sequence Diagram)模板头

通用plantuml 时序图(Sequence Diagram)模板头

通用plantuml文件 startuml participant Admin order 0 #87CEFA // 参与者、顺序、颜色 participant Student order 1 #87CEFA participant Teacher order 2 #87CEFA participant TestPlayer order 3 #87CEFA participant Class order 4 #87CEFA participant Subject order …
阅读更多...
群晖Docker搭建HomeAssistant，结合内网穿透实现远程访问智能家居控制中心

群晖Docker搭建HomeAssistant，结合内网穿透实现远程访问智能家居控制中心

使用群晖Docker搭建HomeAssistant并实现异地公网访问 文章目录 使用群晖Docker搭建HomeAssistant并实现异地公网访问一、下载HomeAssistant镜像二、内网穿透HomeAssistant&#xff0c;实现异地控制智能家居三、使用固定域名访问HomeAssistant HomeAssistant是一个可以控制 苹果…
阅读更多...
Redis部署-集群

Redis部署-集群

目录 集群 数据分片算法 哈希求余 一致性哈希算法 哈希槽分区算法 redis集群搭建 1.创建目录和配置. 2.将上述redis节点.构建成集群 3.使用客户端连接集群 集群模式下的故障转移流程 1.故障判定 2.故障迁移 集群扩容 集群 广义上的集群,只要是多个机器,构成了分布…
阅读更多...
HarmonyOS架构及关键技术整理

HarmonyOS架构及关键技术整理

技术解析&#xff1a;鸿蒙系统的底层优势 鸿蒙系统采用了先进的微内核设计&#xff0c;这是一种全新的系统架构&#xff0c;能够更好地适应现代智能设备的多样性和互联性。微内核通过最小化系统的核心功能&#xff0c;提高了系统的安全性和可定制性。此外&#xff0c;鸿蒙系统…
阅读更多...
Day51力扣打卡

Day51力扣打卡

打卡记录 Plus and Multiply&#xff08;模拟&#xff09; 链接 要满足 a x b ∗ y n a^x b * y n axb∗yn 的关系&#xff0c;可以枚举满足 b ∗ y n − a x b * y n - a ^ x b∗yn−ax 的可余条件。 t int(input()) for _ in range(t):n, a, b map(int, input().…
阅读更多...
Demystifying DeFi MEV Activities in Flashbots Bundle

Demystifying DeFi MEV Activities in Flashbots Bundle

目录 笔记后续的研究方向摘要引言贡献 Demystifying DeFi MEV Activities in Flashbots Bundle CCS 2023 笔记 本文介绍了对 Flashbots 捆绑包中的去中心化金融 &#xff08;DeFi&#xff09; 矿工可提取价值 &#xff08;MEV&#xff09; 活动的研究。作者开发了ActLifter&am…
阅读更多...
无效的源发行版：18

无效的源发行版：18

启动项目出现报错&#xff1a;无效的源发行版&#xff1a;18 大概率是项目的jdk版本不一致造成的 我的项目是Gradle构建&#xff0c;主要检查这几方面 ①Gradle配置的JVM ②build.gradle文件的java版本 sourceCompatibility : 编译Java文件的jdk版本&#xff0c;涉及到具体…
阅读更多...
【WPF.NET开发】创建简单WPF应用

【WPF.NET开发】创建简单WPF应用

本文内容 先决条件什么是 WPF&#xff1f;配置 IDE创建项目设计用户界面 (UI)调试并测试应用程序 通过本文你将熟悉在使用 Visual Studio 开发应用程序时可使用的许多工具、对话框和设计器。 你将创建“Hello, World”应用程序、设计 UI、添加代码并调试错误。在此期间&#…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023