Custom Image caption formatting not working on block editor

  • Hello!
    I hope you’re doing well.

    The new posts that I’m creating in wordpress using BLOCK EDITOR are not formatting my image captions in the same way that it has been for all my previous posts (which were using classic editor).
    For instance, in [ redundant link removed ] post, when I switched to block editor, it changed the formatting of the image caption (I.e., it’s not showing as gray, italicized, centered, smaller font size).
    Even now, if I create a post using the classic editor, the image caption formatting is showing properly… so basically, can you please provide the custom CSS coding That I need to add to [Wordpress.com > Appearance > Customize > Custom CSS] in order to get the image caption to show properly when using block editor?

    Also, the posts currently in my drafts are also not formatting the image captions properly when I preview them. All of these draft posts are using block editor.

    Hopefully you can see the code editor for those on the website, otherwise I can send it!

    Here’s the custom CSS coding for image captions that’s currently in [Wordpress.com > Appearance > Customize > Custom CSS] … which is obviously only working for classic editor. 

    }

.wpb_single_image .vc_figure-caption {
    text-align: center;
    font-size: 13px;
    font-family: karla;
    font-style: italic;
    color: #888282;
}

.wp-caption p.wp-caption-text {
    font-size: 13px;
    margin-top: 5px;
    font-family: karla;
   color: #888282;
}

    Thank you

    • This topic was modified 5 years, 1 month ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Developing with WordPress topic

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

  • It’s a known bug in the editor which will hopefully be fixed in the next version (5.4) which is due to be released in March.

    In the meantime add this to your css:

    .wp-block-image .aligncenter figcaption {
  text-align: center;
  font-size: 13px;
  font-family: karla;
  font-style: italic;
  color: #888282;
}
    Thread Starter eaboutboul

    (@eaboutboul)

    Thank you so much for that!

    It seemed to have solved the problem for the post that I had already published using classic editor and had subsequently edited and converted into block editor.

    However, for all of my draft posts which I created using block editor, when I preview the posts, it only shows the correct image caption formatting for like 2 out of every 40 images. I’m not sure why it’s not correctly applying that Custom CSS to all of the images.
    Would you kindly propose a solution for this?

    Thank you,

    Thread Starter eaboutboul

    (@eaboutboul)

    Hello!

    Do you have any recommended solutions for the follow-up issue that you could kindly share with me?

    Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Custom Image caption formatting not working on block editor’ is closed to new replies.