[Resolved] GenerateBlocks Highlight Text Color

[Mindy]

Hello! Is there a place to set the color for highlighted text when using GB? I am using a paragraph block within a GB container. The highlight color does not show unless I add custom css like this:

.gb-highlight {
    background-color: #f7f30c;
}

Is there a place to set the highlight color? Thank you!!

[Leo]

Hi there,

This shouldn’t be a GB issue.

Is this what you are referring to?
https://wpstackable.com/blog/text-color-and-text-highlight/

[Mindy]

Interesting! I have that plugin installed, but not activated. Thank you Leo!

[Leo]

Sorry you shouldn’t need a plugin to do something that simple.

It’s not possible with the default paragraph block but WordPress suggests using the Classic block:
https://wordpress.org/support/topic/add-color-to-individual-text-within-text-blocks-in-gutenburg/

Let me know if this helps 🙂

[Mindy]

Thank you Leo!! 🙂

[Leo]

No problem 🙂

[Mihail]

I installed the GB plugin that Tom created, but the highlights are not working correctly…
Only the color of the text changes, not its background.

settings in GB:
https://prnt.sc/1nevmtv

result:
https://prnt.sc/1new2p8

But if i add custom css background – all is ok:
https://prnt.sc/1newhtv

[David]

Hi there,

thats correct, the highlight tool only adds the text Color. It requires CSS to add a custom background color.

[Mihail]

For some reason I thought that not only the word itself would stand out, but the background as well. It’s a shame that you have to use additional code.

Hopefully in the future Tom will come up with something and make it so that it can be done using GB.

Anyway, thanks for the answer 😉

[David]

We may include a background color in the future.
We excluded it for now, as background colors don’t look great if you have long words or multiple words highlighted and they wrap to many lines on smaller screens. Not nice.

And its only a little CSS 🙂

[Author]

Posts