Magnific popup alt attribute in image popup

Topic summary

A developer is attempting to add an alt attribute to images generated by the Magnific Popup library within Shopify’s “Minimal” vintage theme. The existing code in theme.js includes a line intended to extract the alt attribute from the original image (c.el.find("img").attr("alt")), but it’s not rendering properly in the popup.

Troubleshooting attempts:

  • Test 1: Hardcoding j.alt="MyAlt" works
  • Tests 2-5: Various attempts to extract the alt attribute from the source element return “undefined” or “[object Object]”
  • Test 6: Trying to use the image src as the alt value

Current status:
The issue remains unresolved. The developer can manually set alt text, but cannot dynamically pull it from the original image element. The problem appears to be with accessing the correct DOM element or attribute within the Magnific Popup’s getImage function.

Summarized with AI on November 21. AI used: claude-sonnet-4-5-20250929.

Hello,

I have been trying to add alt attribute to img tag generated by Magnific popup tool. But I don’t manage to make it work.

Currently, I choosed vintage “minimal” theme : In file theme.js, a piece of Magnific popup code doesn’t work : getImage function doesn’t render alt attribute.

: function (c, d) {...}, following code is written by no alt : 

,c.el&&c.el.find("img").length&&(j.alt=c.el.find("img").attr("alt"))

--> no alt anyway 

Test 1 : I tried to add
j.alt="MyAlt", --> working 

Test 2 : I tried to add
j.alt=c.el --> alt="[object Object]"

Test 3 : I tried to add
j.alt=c.el.find("img") --> alt="[object Object]"

Test 4 :
j.alt=c.el.find("img").attr("alt") --> alt="undefined"

Test 5 :
j.alt=c.el.find("img").attr("src") --> alt="undefined"

Test 6 :
j.alt=c.src --> alt="//cdn.shopify.com/s/files/1/0111/3663/0884/products/etuiprotectionkobo-35.jpg?v=1668278998"

More details here

Thanks for you help