How to get alt text for images into your website if you’re using the Divi theme
EDIT: This has changed, but the same update introduced a new problem. Alt text added at the media library is now working, but so are title tags, which you may not want (when you hover over the image, the title pops up).
Remove the title tag at Advanced > Attributes.
A lot of people are adding alt text incorrectly because it’s a two stage process. It can seem like you’ve added your alt text correctly but it’s actually not working.
Alt text is important because it’s a description that search engines such as Google can use to understand what an image is about. It’s also useful for vision impaired people that are using your website.
This means it’s helpful for SEO. You can use some of your keywords in your alt text but don’t get stupid about it. It should be a natural, clear and accurate description of the image.
This video walks you through how to get your alt text working and how to test to make sure it’s working.
In case you have limited bandwidth and/or time, here’s a quick description:
How to Test if your alt text is working
If it’s not working, you’ll still see alt= but there’ll be nothing after it.
How to make the alt text work in the Divi theme
If you then add the image to your website using the image module, you must also add the alt text at the Advanced Tab, in the Image Alternative Text box.
If you don’t add your alt text into the image module itself your alt text will not work, even though it’s added at the media library.
Really helpful thank you soo much for sharing your knowledge!
Thank you Antonio!
Great thanks Cath, although I was hoping there was an automatic way of adding all tags and titles from the media library into the website images, why they have you doing it manually I just don’t know
We’re singing from the same hymn sheet Steve, it’s almost as if alt tags aren’t very important or something…
EDIT: A couple of people have recommended a plugin that apparently helps, however I don’t advocate using a plugin to do something you can easily do manually. IMO plugins should be used as sparingly as possible.
OMG where have you been all my life!?
( well at least since May when I changed to Divi)
This issue has driven me NUTS. I’ve googled the crap out of it and suddenly, today, there you are.
Off to fix about 500 images but at least now I know how!
You make me laugh Sandy.
I’m glad you found this page. Have you worked your way through your 500 images yet?
Also, I notice Western Australia is missing as a destination on your website. This needs to be rectified, not that I’m biased or anything 😉
Thanks for the video! This greatly helped! Hopefully my SEO score will nudge up a bit! Cheers!
Exactly! Straight to the top of the page for you sir!
BRILLIANT! Simple and working 🙂
Perfect!
Hi Cath, thanks for the video – I’ve watched it a couple of times and really appreciated it.
I hope this isn’t a stupid question, but I couldn’t quite figure it out… Is it only the image module that doesn’t pull the alt tags through from the media library or is there a comprehensive list somewhere of which modules do and don’t naturally use the alt tags?
Roddy as far as I know it’s only the image module. It’s the act of using a module that triggers the issue.
When you include a featured image on a blog post, for example, that’s just a standard WordPress move, so the alt tag comes through.
Thinking about it there are possibly other modules, for example the blurb module, that would also be affected because it includes an image. I’d have to double check that to be sure.
How do you add it to the logo in theme options in header? I have it on the media item itself, but not showing in inspect.
Oh what a great question. Thank you Tori, you have just sent me off on quite the journey of discovery!
TL;DR – The logo’s alt text is taken from the Site Title. Edit this at Settings > General > Site Title.
__________
How I figured this out:
I inspected the logo on my website and noticed it has alt text saying ‘Cath Wood’, yet the alt tag I added in the media library says ‘Cath Wood Traveller Adventurer Digital Professional’. I wondered if it was a) shortening the alt text, or b) just using the main words from the domain URL.
I checked a couple of client sites. One had a descriptive sentence that was a big fat clue. Sure enough, it turned out to be their Site Title.
I went back to my own site, changed the Site Title to say ‘Cath Wood Legend’ (because I was feeling pretty cocky about having worked this out), cleared my browser caches and loaded up the site again. Sure enough, the alt text of my logo was now ‘Cath Wood Legend’.
I was tempted to leave it this way but decided to be sensible and revert back to just ‘Cath Wood’. Sigh…
__________
Extra note for those following along: To upload a logo on the Divi theme go Theme Options > General > Logo > Upload. Select the logo from your media library.
I’m so dissapointed by Divi right now. It make us do more work… I don’t have to do it with other themes =( I’m so sad! Thanks for information. And do you know how to display alt text for SEO with background image? Because it does not work too.
As far as I can tell there’s no way of getting alt text to work with background images without getting into custom coding.
My understanding is that background images are a design element, and as such should not be used for SEO purposes.
(In support of this theory, notice that within the media library there’s a note under the Alt Text box saying, “Describe the purpose of the image. Leave empty if the image is purely decorative.”)
Use alt text on images that are specifically telling the story of your business. The best you can do for background images is to name them well, since that information is visible to Google.
just wanted to say thanks for the heads up as this has been frustrating me for some time 🙂
Happy to help Adam!
HI Cath
Thank you for great video pointing out where to add the alt tags in Divi! It works great for full width images, but I can’t seem to find the alt text field under Attributes for full width slider photos? Also wondering if its necessary to fill in the Image title text as would essentially be a repeat of the alt text in the media library. Does it makes sense to do one or the other or are both needed?
Pam you are correct in that sliders work differently. There is no provision to show alt text natively. Like many others I have essentially abandoned sliders because they keep showing up as bad for SEO, and I find I can achieve the same effect in other ways.
Regarding the Image Title Text, I usually don’t fill it in because if you do, it pops up when you hover your mouse over the image. Sometimes you actually want that effect, but usually I find it distracting.
Hi Cath,
Any idea how to add alt+text to an image that’s embedded in a text module in Divi? In other words, it’s inline with the text and not in a separate image module. I’m guessing it has to be hard-coded into the text tab but wondering if you know of an easier and less techie way.
Mark I just tested this by adding an image into a text module and found that it brought the alt text with it. I didn’t need to do anything special.
Have you added the alt text at the appropriate place in the media library?
Great stuff! Thank you for sharing. So easy when you know how! Great explanation.
Helpful advice! Can you solve the ALT Tag the same way? For example, ? It is used to find an alternate image (or search again) if the browser, database can’t find the original image.
It is now September 2019 and Elegant Themes has not fixed this yet!! I contacted them and they said they are aware of the issue but no ETA. Frustrating and just like others I googled for a fix and came across this post. I was hesitant about this working, but gave it a shot to 38 images! Voila, just like you said, it works! no more ALT images error when I run SEO quake diagnosis.
You have definitely gain a subscriber 😉
Happy to help!
Was wondering if you knew how to fix this when using Divi’s person module? It appears to pull the alt text from the name field, but I’d like to make mine more descriptive then that!
You’re right Jennifer, that’s exactly what it does.
I don’t have a solution. If it were me I’d probably just ditch the person module and recreate the same effect using image and text modules. The importance of descriptive alt text outweighs the convenience of a module, in my book.
Thank you so much, Cath! This is so helpful! Now I’m off to start adding ALT image text to the many images on my site! 🙂
I was also wondering if it is possible to add ALT image text to a background image in Divi? I’m trying to add ALT image text to an image I’ve used as a background in a Hero Section at the top of one of my website’s pages on Divi, but after much searching I still can’t figure out how to do this…
Many thanks in advance 🙂
As far as I can tell there’s no way of getting alt text to work with background images without getting into custom coding.
My understanding is that background images are a design element, and as such should not be used for SEO purposes.
(In support of this theory, notice that within the media library there’s a note under the Alt Text box saying, “Describe the purpose of the image. Leave empty if the image is purely decorative.”)
Use alt text on images that are specifically telling the story of your business. The best you can do for background images is to name them well, since that information is visible to Google.
Anyone know what custom code we can use to add alt text to background images? Would be very useful with my particular site….
Oh, thank you. I’ve been struggling with this for an SEO client.
Happy to help!
I have an image in my Divi Fullwidth Header as background. I just added alternative text, in my WP Media library, to the image. Since I’m not using an image module, there is no advanced tab to manually add alternative text.
Do I need to replace the image on my home page with the same image I just added the alt text to or does my home page update automatically when I change something about the image in the media library?
Hi Larry,
You don’t need to replace the image, the edits you make in the image library will carry through. You may have to clear caches to see the effect, and in any case it’s sometimes difficult to see alt tags in headers because it’s obscured by div code etc.
Thank you so much for this, Cath! I had abandoned all hope of ever knowing why my alt text wasn’t appearing until I stumbled across your post.
Hi Cath: thank so much for your helpful advice!
After adding alt text correctly. It looks like Yoast SEO can not detect these alt tags (I inspected and made sure the tags are present).
Yoast gives me a red dot saying my images have not alt texts.
Do you know the reason?
Thank you!
Dear Cath,
I love you!
Thank you extremely much! 🙂
I’ve spent the entire afternoon trying to find the solution to this issue.
You are a lifesaver!
Once again thanx a bunch!
All my images in the media library have alt tags, however when an image inserted in divi builder in anything else but an image module, those alt tages are not in th epage’s HTML. More so, all DIVI modules that can have an image in them, excluding the image module, do not have an Attributes option in the Advanced tab of the module, so no alt tag can be inserted for these images. Anyway to correct that?
The newer versions of Divi will automatically add this, but from what I’ve found, it is still for the image module only like Yohan mentioned. So instead of using a Blurb, you need to use separate modules (Image, text, button). The Blurb module has the Alt text inserted there in the Advanced tab, but it does not display right…
Hi
I got the same problem, use divi:
1. I put alt-text direct in image-gallery
2. Divi – Advanced – Attributes – Image Alternative Text, the text i typing in in Image-Gallery is there
3. But My problem – yoast SEO write: Image alt attributes: No images appear on this page. Add some!
How Can I tell yoast SEO the alt-text is there??
H. Nielsen
I don’t use Yoast so I’m not much help to you here I’m sorry.
You are my hero. Thank you so much.
Happy to be someone’s hero 🙂
Hi Cath!
Thank you for the info.
My question is about using the same image in different pages with different alt tags, I tried but if I change it in one it also changes in the other one. Do you know how to do this with Divi and/or WP Bakery?
Thank You!
Andy the only way to do this is by using the image module. Go to the advanced tab > Attributes and input your preferred alt text there.
For all other instances, WordPress will pull the alt text you inputted in the media library.
Thanks!!! it help me a lot!!!
You are the best!
Pablo
That’s great Pablo!