Shopify 主题优化

第 112 期提升 Shopify 店铺信任度：免插件添加安全支付图标

更新于 Dec 2, 2024

通过 YouTube 观看本期 Shopify 教程

增强版主题已添加此功能，可以直接迁移到增强版，拥有全部功能

在 Shopify店铺上添加信任图片或图标，是一个很常见的需求。

然而很多人不懂代码，本期视频教程将为你演示如何在主题中添加信任图片，并且支持后期更改图片。

如何生成图标

工具链接（操作方法见视频讲述）

截图工具下载链接（应评论要求）

获取图片之后，可卸载插件。

以下操作可在原在线主题上直接操作，也可在备份主题上先操作一遍，确保无误再到原在线主题上操作。全部操作完成，再重新发布原来的在线主题。

复制粘贴，是人就会

@app

{
  "type": "trust__badge",
  "name": "安全图标",
  "settings": [
    {
      "type": "image_picker",
      "id": "trust_image",
      "info": "[使用参考](https://shopify2006.com/how-to-add-trust-icons-to-your-shopify-store-without-using-an-app/)",
      "label": "Image"
    }
  ]
},

case block.type

{%- when 'trust__badge' -%}
  <div style="max-width: 320px; margin: 0 auto;">
    <img loading="lazy" src="{{ block.settings.trust_image | img_url: '640x640' }}" style="max-width: 100%;" alt="{{ block.settings.trust_image.alt }}">
  </div>

支付图标

除了添加安全图标，也可以添加图片展示支持的付款方式（前提是店铺的确支持），示例图片：

Shopify Footer 底部付款方式图标