How can I add alt text to social icons in the footer of a website?

I do not know how to add the alt text to the social icons in the footer of our site. Normally in HTML, it is just alt=“twitter” but since it is not in standard brackets it is not working.

How should I edit this code? Thank you :slightly_smiling_face:

{%- if section.settings.show_social -%}

1 Like

Hi @MNgrant ,

What theme are you using? If you go to the Snippet folder, and open the icon-twitter.liquid, you should be able to find the HTML code.

Please follow the instructions below

  1. Go to Admin page > Online store > themes > Actions > Edit code
  2. Open the icon-twitter.liquid, under the Snippet folder.

It is the Dawn Theme.

I tried this but it did not work.

Oh. I do not think you can add an alt on this one. Are you talking about a “title” attribute? Can you explain more on what are you trying to accomplish?

When you mouse over an image, you should get a description of what it is. This example shows that the image link will take you to the home page.

I see. You are pertaining to the title. You can add the title=“your title” instead of alt. Try the code below instead and replace the content of the icon-twitter under the Snippet folder

I tried the title and it is not showing. But I do think you did find the right place for the alt text as it is for accessibility not a visual element on the site.

Hi @MNgrant ,

It would be best to share your website for this matter, so I can give you the write code. I am not sure if the hover works on the SVG.

Sure it is: https://heavyglare.com/

I added all the alt tags except Linked in as I could not find it in the snippets. Thanks for helping me with this. I appreciate it.