• Français
CONTACT

EDIT (jan. 2020): Divi Alt Text plugin is no longer free. You can check the new and improved Divi Alt Text plugin.

Hi all, You may be aware that since Divi 3.1, several WordPress hooks have been introduced into the Divi source code. But there's more: module management has been redesigned as well. And that's good news for developpers or power users, for it's way easier now to make changes in modules.

Hence the update of my free Divi plugin, Divi Alt Text, in charge of automatically fetching images alt texts from WordPress media library for every image related module except Gallery: Image, Fullwidth Image, Blurb, Fullwidth Header, Slider and Fullwidth Slider.

Divi Alt Text redesigned

You will find here the new code plugin for Divi Alt Text, based on the new Divi code, which is much cleaner than before. The plugin is now way smaller, thanks to the use of a well designed WordPress hook in the modules code.

Note : I removed the Gallery module from the plugin because I couldn't find a clean solution to make it work (the only way I found to get the alt text from the library was to overide the whole module's HTML rendering function, which is too long). Besides, the module gets the image title from the media library to set the alt text, so it's not empty like the other modules.

Getting image alt text from the media library

I still use the same technics to get the alt text from the image URL.

The principle is simple: We first get the image's post ID from its URL, then we get the alt text from the post meta, or the image title if the alt text is not set (which is bad!). Since last version, I added the use of relative path in image URL, starting with '/' and not 'http...', because every single URL should be relative in Wordpress.

Modules update: the filter hook

With the arrival of Divi 3.1, I started digging into the modules source files to see if and how it was improved. Great surprise, a lot of code has been factorized and simplified. And even better, there are several WordPress hooks that can be used to dynamically inject PHP.

No need to overide the whole rendering process anymore!

See the official Divi Alt Text plugin page

Meet the new and enhanced Divi Alt Text plugin!

Download official Divi Alt Text (From Divi 3.1)

60 comments on this post

  1. Very useful, thanks ! 🙂
    However, pasting into my child theme FUNCTIONS.PHP gives me this error in the editor:
    Your PHP code changes were rolled back due to an error on line 37 of file wp-content/themes/marine-savers/functions.php. Please fix and try saving again.
    Cannot redeclare update_module_alt_text() (previously declared in wp-content/plugins/divi-alt-text/divi-alt-text.php:33)

    1. Hi,
      Maybe it's not clear enough in my article, but you don't have to copy/paste the code in your child theme if you're using the plugin.
      You must choose either one of the two solutions : the plugin OR the child theme.
      Yan.

      1. aah yes, my apologies Yan ... I realised that I'd already installed your plugin earlier in the year! Thanks again. 🙂

  2. Works great for the alt tags - thank you! Would be even better if it could do the same for title tags - is that possible?

    1. Hi, you're welcome !
      But unfortunately I don't plan to fix this because it's not essential for me like alt text.
      It is Elegant Themes job to do this, and I wish they would fix this kind of basic problems instead of adding flashy useless stuff...

    2. After using this plugin, I realized I wanted the same for title tags. However, this did work great for fixing the alt tags in my Divi site.

      I ended up using "PB SEO Friendly Images Pro" plugin and it fixed both alt and title tags using whatever info was in the media gallery. I haven't tried the free version of the plugin for this purpose yet, however looking at the free plugin's description page on WordPress.com, it seems to have the options available to still do this.

      Note: To get "PB SEO Friendly Images" working with Divi, in the plugin's settings page I had to check the "override" boxes and set the alt scheme setting to %media_alt and the title scheme setting to %media_title

      1. Hi Martin,
        Thanks for the feedback, sounds like a very interesting plugin !
        What about performances ? Does it make a big difference ?

  3. I just to tried to install the plugin and got an error message that said: Unpacking the package…

    The package could not be installed. PCLZIP_ERR_BAD_FORMAT (-10) : Unable to find End of Central Dir Record signature

    Do you have any idea how to fix this?

    1. Hi Michelle,
      If you install from WordPress backend, you have to select the divi-alt-text.zip file and not divi-alt-text folder or divi-alt-text.php file, i.e. you must not uncompress it before.
      If you still have this message with the downloaded zip file, then I'm sorry but I have no clue of what could cause this.

  4. It downloaded in a zip folder and wouldn't allow me to upload the folder. All that was within the folder was the php file which was generating the error message. I tried compressing the file which resulted in a zip file and it uploaded fine.

    I have a Mac and sometimes things operate differently on it.

    Thank you for your reply and for the plug-in!

  5. This doesn't work no more? I keep getting an error :\

    Uncaught Error: Call to undefined function get_image_alt_text() in wp-content/themes/themename/functions.php:284
    Stack trace:
    #0 wp-includes/class-wp-hook.php(288): update_module_alt_text(Array, Array, 'et_pb_image')
    #1 wp-includes/plugin.php(203): WP_Hook->apply_filters(Array, Array)
    #2 wp-content/themes/Divi/includes/builder/class-et-builder-element.php(1458): apply_filters('et_pb_module_sh...', Array, Array, 'et_pb_image', '1.0.0.0', '<p> </p>')
    #3 wp-includes/shortcodes.php(319): ET_Builder_Element->_render(Array, '<p> </p>', 'et_pb_image')
    #4 [internal function]: do_shortcode_tag(Array)
    #5 wp-includes/shortcodes.php(197): preg_replace_callback('/\\[(\\[?)(et_pb_...', 'do_shortcode_ta...', '[et_pb_image sr...')
    #6 wp-content/themes/Divi/includes/builder/main-structure-elements.php(3728): do_shortcode('[et_pb_i

    1. Hi Tobias,
      Are you sure you installed the plugin correctly and that you chose the right version ?
      And that you removed the old one if you happend to install it before ?
      For Divi >= 3.1, it's version 4.
      I reinstalled it with the latest Divi and everything works fine here.
      Maybe try to empty all your caches, including Divi's modules, for this error is strange : the get_image_alt_text() function is defined in the same file as update_module_alt_text().

  6. It is a mystery why Divi does this. Hopeless for SEO. Really appreciate your efforts but tried to install your plug in today and it hung on install.....

  7. The posts displayed on the home page of my website via CPT Loop Archive Module, their thumbnail images there are without alt text, the text tags are there but without text.
    I've checked in the media library there are set alt names.

    Regards

    1. Hi,
      Sorry but this plugin only works with the mentionned Divi modules, because development was simple and didn't involve a lot of dirty overwriten code. The plugin was meant to quickly fix an essential lack in Divi, but Divi's code isn't very modular and I can't rewrite everything.
      You'll have to ask ET and the module author for this.

  8. Hi Yan,
    I have pasted the two parts of code, found in your post, into my child theme’s functions.php file, but the alt information is not fetched from Media Library.
    The DIVI module I use is the Fullwidth Slider into a Fullwidth Section and my images are added in the background fields of the slides. I see that Divi adds these images in the CSS code. Is this the reason that the alt tag is not fetched? If yes, is there any workaround?
    Regards,
    Michael

    1. Hi Michael,

      Yes, sadly it's exactly what is happening.

      In theory, CSS background images are meant to be used for decoration purpose only, and I don't know any way to set an alt text for them, which is a shame today because bandwidth allows us to use real HD photos.

      Some people use the title attribute on the container div, and have good results, SEO-wide. But I think it's useless for accessibility/screen readers.

  9. I have a Divi child theme 3.18.9 and WordPress 5.0.2 and after trying each method individually, both did not work for me. Not sure what to do.

    Is there any info I can offer you that may give insight as to why?

    Thank you for the info you have available 🙂
    Happy 2019!!

    1. Hi!
      Have you installed (and activated) the right version of the plugin?
      Version 4 is needed for Divi >3.1.
      I just made tests with WP 5.0.2 and Divi 3.19.3 and it's still working, so it should be OK with 3.18.9.
      Maybe try to empty all caches?
      Yan

  10. Hello, I'm here to thank you for helping me avoid an hour of work and to tell everybody that the plugin works even with the Divi editor plugin on another theme (although the copy-paste method in functions.php won't work).

    1. Hi Daniele, thx for your message!
      Copy-paste method works perfectly for me. Can you check if you put the code at the right place?
      Have you tried to empty all caches (especially Divi's one)?

  11. Hi, it works well with the modules defined but how can I make it work for "et_pb_text" module ?
    I'm using the divi builder fr writing articles and all the media included in the "et_pb_text" module have an empty "alt" attribute.

    I tried to put this code, but doesn't seem to work... Do you have an idea ?

    if ( $slug === 'et_pb_text' && '' === $attrs['alt'] )
    $attrs['alt'] = get_image_alt_text($attrs['src']);

    Thank's for your help !

    1. Hi Madeleine,
      You don't need to change or add any code for this, because WordPress handles alt text very well when you include media into a text module.
      Just fill the image alt text in the media library after upload on the right panel, and that's it 🙂
      That's the whole purpose of this plugin actually... Divi should handle alt texts like WP, via media library.

      1. It works well, indeed ...
        In fact, I updated all "alt" attributes throught the media library after writing the article and, unfortunately, there is no update of the generated code of the article when a media related to the article article changes ... So that was the problem!

        Thank's for your quick answer !

        1. It's strange.. Every post showing the modified images should be updated.

          Are you using a cache plugin? This could explain the issue.
          If so, just empty the cache to be sure that everything is regenerated.

  12. Worked just fine via the functions file, I do agree that Divi should take this on board and fix stuff, rather than keep adding flashy bits.

    ET will either grow to something amazing, or they are just waiting for the right buy out offer.

    1. Hi Karl,
      Yes, I'm curious to see what will be Divi 4.0, but I've already switched to Suki with Elementor, anyway 😉

    1. Hi Deepak,
      It works perfectly on 3.22.7, you should check again.
      There must be something else conflicting, or old cache fragments...?

  13. Hi thank you for your code, something really strange happend today, honestly I didn't made any changes and I have disabled every critical plugin(except yoast), but the alt is showing correctly only on gallery items and not into the others, I tried to remove your code and the alt on galleries is still showing, so I thing that something is conflictting with your code but honestly I cannot figure out. any suggestions?

  14. sorry I read now that your code is disabled for the gallery module, so this is expected and what really happens is that I have the alt text on my images set to the title of the image and not to the value in my media alt metabox. really strange

    1. Hi Vassilis,

      You('re right, my plugin doesn't interact with galleries, so I can't help you with that. Maybe a cache flush could fix this if alt text was set by another plugin?

      Regarding image title instead of alt text... The plugin uses image title if alt text is not set in media library, but if alt text is set, image title should be ignored. Are you sure you didn't manually fill image alt text in your image modules?

  15. I found the problem, you have inserted the condition && '' === $attrs['alt'] into your code, maybe this is because you want to prevent that your plugin overwrites the divi attributes tab settings. But unfortunately this give us some issue, cause I don't know exatcly when, maybe during a divi update, the attributes of divi tabs results always filled, so changing the alt into the media backend doesn't updates the alt attributes. Removing the && statement fixed the issue.

    1. Yes it's essential that the code doesn't overide module settings because a lot of Divi users use them.
      But you seem to know what you're doing, so have fun 😉
      As a matter of fact, maybe you should delete all alt texts in modules (manually or with a smart SQL query if too many), as they might interfere one day or another.

  16. Marche super bien ce petit plugin ! Il faut le mettre sur le repository !!

    Merci beaucoup !

    1. Bonjour Jérôme,
      Merci pour ton message !
      C'est effectivement un projet... un peu au ralenti aujourd'hui 😉

  17. Unfortunately, neither option worked for me? Tried adding codeo functions.php in my child theme. No change.

    Then deleted the code and tried the plugin, also no joy.

    Parent theme is Version: 3.26.6

    Tried deleting cache etc, still not updating alt text for images used in modules 🙁

    Ideas?

    1. Hi, I can help but you have to be more specific.
      Please elaborate "neither option worked"...
      Is there no alt text at all when you inspect code?
      Is there an error message? Is module alt text set?
      Send me URL in private if you will.

  18. HI Yan,

    Would it be possible to also get this working for the EXTRA theme from Elegant?

    Thanks in advance,
    _Sandy

    1. Hi Sandy,
      I don't know Extra at all, so I can't tell you if it can work.
      As Extra uses the Divi Builder, I'd say that the code could be adapted, but I don't know if hooks are available in Extra.
      If not, modules PHP files should be modified, and that's a heavier and dirtier process.

  19. Thanks Yan,

    This is awesome!
    After reaching out to the Divi team to fix this issue with Alt Text on images, they directed me to this page. I've also gone back to them and suggested that this code should be added as an enhancement into Divi as standard within the code. If it is added in Core, then literally all Divi sites across the web will instantly have a better ranking with SEO.

    Thanks!

    1. Hi Ben, thx for your message!
      Yeah it's a shame they don't include this as native behaviour.
      I've sent them many messages for the few past years, including the patch itself, but they haven't even replied.
      I've given up with ET 🙁

  20. I have an idea how to enhance this script: I think it could be helpful to check, if there is text in DIVIs own alternative text field. And if yes, use that text. Then you have the ability to use also different texts. This makes especially sense, when you use the same image several times in different contexts.

Leave a Reply

Your IP address will not be logged.
You can fill in your name or nickname if you are human ;-)