如何在自定义部分中将 alt 添加到图像答案

【问题标题】：How to add alt to image in custom section如何在自定义部分中将 alt 添加到图像
【发布时间】：2023-02-02 12:37:58
【问题描述】：

我创建了一个自定义部分，我在其中添加了一张图片。我需要显示它的替代品。我怎样才能做到这一点？

  <img src="{{ section.settings.img_section_image | img_url: '960x645'}}">

{% schema %}
{
  "name": "Img section",
  "settings": [
    {
      "id": "img_section_image",
      "type": "image_picker",
      "label": "Add image"
    },
  ],
  "presets": [
    {
      "name": "Img sections"
    }
  ]
}
{% endschema %}

【问题讨论】：

标签： shopify liquid

【解决方案1】：

上传图片后，只需单击图片，弹出窗口中就会出现一个弹出窗口，其中有一个文本字段可以为该图片添加 alt 标签。

它看起来像这样的图像：

要在 img 标签上获取它，您可以使用默认的 image_tag

{{ section.settings.img_section_image | image_url: width: 200 | image_tag }}

它在创建 img 标签时自动显示 alt 标签或使用

{{ section.settings.img_section_image| image_url: width: 200 | image_tag: alt: 'My image's alt text' }}

无需后端即可手动添加自定义标签。

如果你不使用image_tag，那么试试这样的

<img src="{{ section.settings.img_section_image | img_url: '960x645'}}" alt="{{section.settings.img_section_image.alt}}">

我希望这对您和其他人也有帮助

【讨论】：