How To Show The Caption Text Below The Divi Image Module Tutorial by Pee Aye Creative

How To Show The Divi Image Module Caption Text Below The Image

In this tutorial I will show you how to add caption text to the existing Divi Image module and style it with our FREE new plugin!

Join subscribers on our YouTube channel and enjoy other Divi video tutorials!

adding caption text to an image in the WordPress media library
Divi Image Helper Free Plugin by Pee Aye Creative 4
how to show the image caption in Divi
image caption text design settings in the Divi Image Helper plugin

Last updated Nov 29, 2022 @ 11:53 pm

Subscribe

Each month we send out a roundup email newsletter with the latest tutorials, product updates, helpful resources, and any other industry or personal news. Occasionally we send an extra separate email here and there if we just can’t wait! So that’s what you will get if you subscribe, and you can always unsubscribe at any time if you just can’t take it anymore 🙂

Blog Post Optin

Please share this post!

Nelson Lee Miller (aka The Divi Teacher)

Nelson is the owner of Pee-Aye Creative in the beautiful state of Pennsylvania. He loves helping small businesses, exploring outdoors, building websites with Divi, and teaching others.

Leave A Response!

By commenting you agree to our Blog & YouTube Comments Policy

30 Comments

  1. Tonny Kluften

    Hi, thanks.
    It would be great if it were possible to add the caption text on the image itself, and with a background or the text to stand out when its placed on the image.

    Reply
  2. Fabiane Diniz

    Dont Work!

    Reply
  3. divi pro

    hi nelson how are you

    Reply
  4. Franz Schekolin

    The Caption text isn’t showing on mobile, just on desktop. Any solutions?

    Reply
  5. Miquel Amat

    Hello. I am not able to reduce the caption letter spacing to less than 1px. Is there any option to do that?

    Reply
    • Miquel Amat

      sorry, problem already solved, I don’t know what happened yesterday…

      on the other hand it would be very interesting to be able to see the caption in the visual editor

      Reply
    • Nelson Lee Miller (aka The Divi Teacher)

      I am not sure what you mean, there is no issue like this for us. Maybe you have a preset. You can share more info with a video to our support team.

      Reply
  6. Eva Frisk

    Hi, I followed your instructions and have done it twice but I can´t see the caption on frontend. The new setting are there and I have written a caption but no luck…

    Reply
    • Nelson Lee Miller (aka The Divi Teacher)

      I am not sure about this, but we did find some issues with iOS that we fixed. Can you download the latest version from your account and try again? If it continues send us an email!

      Reply
  7. Thomas Olsen

    Hey Nelson,

    thank you so much for offering a free plugin!
    I just want to let you know, that the plugin doesn’t work for me either. Neither the aspect ratio functionality nor the subtitles. As there have been some similar posts recently, there might be an unsolved issue. I didn’t want to complain on a free plugin – just a kind info… 😉

    All the best from Germany
    Thomas

    Reply
  8. Ray Katz

    I absolutely love this plugin. Is there a way to adjust the spacing between the caption and the image? Maybe just with CSS? I can’t figure out the selector for the caption itself…

    Reply
    • Nelson Lee Miller (aka The Divi Teacher)

      I’m so glad you love it, could you leave us a review on the product page? That would be awesome! Yes you can easily adjust the spacing between the text and the image in the design settings. Just go to the Design tab and open the Caption Text design settings and adjust the margin or padding.

      Reply
  9. Sigrun Gudbrandsdottir

    Love this, thank you!

    Is there any way I can set the caption text to be visible only on mouse over?

    And would you consider making a similar plugin for the gallery-module? That’s where I really miss showing text on individual images / being in control of the design.

    Regards form Denmark.

    Reply
    • Hemant Gaba

      Hi Sigrun!

      Please go to Image module settings > Advanced > CSS ID and class > CSS class, and add the class pa-image in it.

      Then add the CSS code:

      .pa-image .pac_dih__image_details .pac_dih__caption{
      opacity: 0;
      }

      .pa-image:hover .pac_dih__image_details .pac_dih__caption{
      opacity: 1 !important;
      }

      Also, we have provided design control to the caption in Image settings > Design > Image caption text.

      Let me know how it goes!

      Reply
  10. Chris Nesbitt

    Hi Nelson, and thanks for the plugin. Unfortunately, it doesn’t seem to work for background images. I’m using a Fullwidth header module, with the background image assigned as the featured image. None of the plugin settings appear in this case. Ideas?

    Reply
      • Beatriz fernandez

        Hi! I love your work and im learning a lot with you. Now iim working on a blog and I would like to know if there is some option for the captions of the blog module so i can customize the caption of the images of the post. The default is quite ugly/boring. Thanks in advance!

      • Hemant Gaba

        Hi Beatriz!

        I’m afraid it is not possible right now. However, we will consider the feature for our future products or guides. Thank you!

  11. Diane Duncan

    Hi,
    It’s not working for me.

    Reply
    • Hemant Gaba

      Hi Diane!

      Can you please share the URL of the page so that I can check further?

      Reply
  12. Fred BENOT

    Hi,
    Thank you for your solution. How do you do for featured images in posts ?

    Reply
  13. Jay Andrew

    Great plugin, thanks for sharing. That’s it, no extra BUT…. hahaha like many of the comments. It worked first time everytime and very kind of you to offer it up for no charge.

    Reply

Submit a Comment

Your email address will not be published.

Other Freebies

0

Your Cart