Add Title Attibute to images in home page and product page Debut theme

[Quondy]

Hello!

I did a Seo site scan and it pointed out I am missing images title attribute.

Please can someone help on how to add a code on the theme, I am using Debut theme to render not only the alt attribute but also the image attribute text

Currently the images are uploaded  through the simple shopify admin image upload button, it gives a place to enter an alt tag, but not a title.

Is there code that I could put on the page template that would automatically add whatever is entered as the alt tag as a title attribute for each image?

Thank you

[KieranR]

Assuming you mean product images? Not other "files" inserted in the customizer for eg.

Then find the liquid to edit usually somewhere in product template.

A pretty standard approach for img alt text in liquid looks something like this 

<img src="{{ image.src | img_url: 'compact' }}" alt="{{ image.alt | escape }}">

^ from here

If you want to add a title with the same string as alt then just do this: 

<img src="{{ image.src | img_url: 'compact' }}" alt="{{ image.alt | escape }}" title="{{ image.alt | escape }}">

You can combine strings too, so do something like product title + alt eg: 

<img src="{{ image.src | img_url: 'compact' }}" alt="{{ image.alt | escape }}" title="{{ product.title | escape }} - {{ image.alt | escape }}">

[Quondy]

Hello @KieranR,

please can you tell me in which part of the theme code to put these?

Thank you

[KieranR]

If you're meaning product images, then start in product.liquid (assuming all your /product/ pages are using that template) and read through the code to see where <img> tags are inserted. Entirely possible they are called from a section inserted within the product.liquid page, or even inserted via JS.

Exactly where in theme will depend on how your theme is coded, they are not all the same. So do my suggestion above it will require some ability to figure out liquid/HTML.

[SEOAnt-Zoey]

Hi,
I think you can use the SEOAnt ‑ Image Optimizer & Speed Shopify app,
which has an automatic image alt text setting feature,to save you more time.

You need an app to help you manage tedious and repetitive settings.
You can set the product title attribute here.

I’ve set up a 20% off link: https://share.channelwill.com/app/286645d1c63d946Svz
By installing through it, you can get 20% OFF, valid indefinitely.