Leo
(@leohsiang)
Hi there,
Looks like you are using GB’s image block so the figcaption is added as a headline block.
That means you should be able to use the headline block options:
https://www.screencast.com/t/uAKeHreu8UY
Shouldn’t need any CSS.
Let me know if this helps 🙂
Hello,
Thanks for helping but sorry, I’m really confused.
1/ First, why is the font so small on this caption (looks like it is 8 pixels or something) when I can see on the headline block options you mention it is 17.
2/ Same here on this other image. And as asked in my initial post, when looking in the source code, why is the font-size is striken?
3/ As pointed out in my initial post, how can I make it work with the CSS? I want to set the size in my CSS once and for all so that it applies to all images. I don’t want to have to manually set the size for each image, but as described with my screenshot, the CSS works for the color but not the size?
Thank you for clarifying this for me if you can for I’m confused. Does it come from a conflict from GeneratePress or something with the CSS? (I’m not a coder so please forgive me if I’m talking nonsense)
3/ I’m not using
Hi @masterhealerwp,
The font-size you set in the Block Settings isn’t adding the CSS needed or at least it’s not appearing in the front end. Can you try clearing all caching mechanisms you have?
Try regenerating GB CSS as well in GenerateBlocks settings.
Hi @fernandoazarcon2
I did what yo usay.
Why do this text and that text using the <figcaption> tag have a different size on this page?
I’m still confused about this.
Thanks
ying
(@yingscarlett)
As Fernando said it seems a cache issue, it’s now using 17px as its font size:
https://www.screencast.com/t/JmWnQitdeP
Hello,
Well, I cleared and deleted my cache and look, for this page, the font-size is still strikethrough.
Here is what my CSS looks like:
figcaption
{
color: #575760;
font-size:1em;
}
Hi there,
if you’re using the core Image Block you need to use:
.wp-block-image figcaption {
color: #575760;
font-size:1em;
}
Hi @diggeddy,
Sorry, I tried this:
.wp-block-image figcaption {
color: orange;
font-size:0.3em;
}
And also this:
.gb-headline figcaption {
color: orange;
font-size:0.3em;
}
But nothing change. Here is again the link to the page.
ying
(@yingscarlett)
Your CSS is working.
But I thought you were trying to make the font bigger. Then why set it to 0.3em which will turn out to be 5.1px?
https://www.screencast.com/t/OKryvT1v
Yes, you’re right. This is just a test.
Everything seems to be fine.
Hi again,
How can put the caption below the YT videos in italics on this page?
I tried several things in my CSS. AS of today, I have this listed:
.figcaption wp-element-caption {
font-size:0.8em;
font-style:italics;
}
Leo
(@leohsiang)
Try this instead:
.wp-block-embed figcaption {
font-size: 0.8em;
font-style: italic;
}
Make sure to clear your caching plugin.
