Archived topic
GP 3.1 Alpha inline text color not working correctly
7 replies · Started by Natalie on September 15, 2021
I highlighted a section of text in my headline block and applied a text color to it. I chose one of the custom colors that I had defined.
The text didn't change color in the frontend or backend
I could see this markup in the frontend html:
<span class="has-inline-color has-np-dark-blue-color">text</span>
my custom color name is: np_dark_blue
I then tried choosing one of the 'default' colors - the 'accent' color, for my section of text
Now the frontend was correctly showing the text in that color but the backend was still the wrong color.
The markup in the html was:
<span class="has-inline-color has-accent-color">text</span>
Is it intended that you can use your custom colors in the inline text color picker?
GeneratePress 3.1.0-alpha.1
GP Premium 2.1.0-alpha.1
Thanks
Hi there,
There's currently a bug in alpha.1 where it won't show in the backend. However, it should always show in the frontend as long as your variable matches the one added to the class name.
The bug itself is fixed in alpha.2 which will be released on Friday morning (most likely).
Thanks. I'll test again in alpha.2
I'm not sure what you mean by:
" as long as your variable matches the one added to the class name"
I just chose my color from the pick list of colors (which includes the custom ones I defined)
Is there some css I need to add as well for custom colors to work with inline text ?
No, it should work by default (except in the editor right now due to the bug). Is it working on the frontend for you right now?
No it isn't working in the frontend for me
OK it has something to do with the naming of the custom color
It works for a custom color with this name:
npred
But it doesn't work for a custom color with this name:
np_dark_blue
Looking at their documentation it looks like "kebab case" is necessary: https://developer.wordpress.org/block-editor/how-to-guides/themes/theme-support/#block-color-palettes
This means lowercase characters and - instead of _. We'll add some validation to the naming convention in the next update to enforce this.
Thanks!
great! glad I could help
