[Cocoon] How to center the image caption | WordPress caption position

Although it is not limited to Cocoon themes, depending on the theme, the position of the caption placed in the image may be shifted to the left, and the position of the image may not match. deviate due to

You can use CSS to center it.

Adjust with additional CSS

First, find the CSS class name that sets the position of the image caption.

Looking at the HTML, it seems that .wp-block-image figcaption corresponds to the image caption.

centered with text-align:center

.wp-nblock-image Figcaption part can be centered by setting “text-align:center”!

The caption is now center aligned!

If you want to center not only the content part but also other captions on the site, specify only the figcaption selector and set it to text-align:center.


figcaption: Click here for figure caption elements

: Figure Caption Element – HTML: HyperText Markup Language | MDNThe HTML element or figure caption element represents a caption or legend that describes other content within the parent element.

developer.mozilla.org

summary

Image captions on your site are now centered!

It’s easy to learn, so please try it .