CODEWITHSUNDEEP
shopifyliquid
yanksi_
yanksi_

Reputation: 117

How to add alt to image in custom section

I have created a custom section in which I add a picture. I need to display its alt. How can i do this?

  <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 %}

Upvotes: 0

Views: 1299

Answers (1)

Onkar
Onkar

Reputation: 2584

Once you upload the image simply click on the image, and a popup appears on the popup there is a text field to add an alt tag for that image.

it looks like this image: enter image description here

To get it on img tag you can use the default image_tag

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

it shows the alt tag automatically when img tag is created or use the

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

To add manually custom tag, without backend.

if you do not use image_tag, then try something like this

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

I hope this will helps you and other as well

Upvotes: 1

Related Questions