- This topic has 19 replies, 3 voices, and was last updated 1 year, 3 months ago by David.
December 7, 2016 at 3:38 pm #252502Balázs
I have a dominant color on my site (under development) that I use in a lot of places, various section backgrounds, buttons, etc. For now I manually type them in/select through GeneratePress color selector (for section background, etc), but I already know this must not be the right way to do it.
Is it possible to somehow define a global color and then use it by name everywhere? For instance if I would like to change it later on, I wouldn’t have to go through all the places I’ve set it.
Or in general, what would be the best way to handle this, so I have my color somehow defined in only ONE place?
BalázsDecember 7, 2016 at 8:10 pm #252554TomLead DeveloperLead Developer
Currently this isn’t possible, but I see the point in having a Customizer option for setting the primary color.
However, making it available in Sections etc.. most likely wouldn’t be possible.
If you’re worried about that, I would use the custom classes field in Sections instead. Give you sections specific classes, then use CSS to give those classes your primary colors.
This way if those colors change, you just need to adjust the CSS for each class instead of going through each section.
Let me know if that makes sense or not 🙂December 8, 2016 at 2:05 pm #252830Balázs
Yes, I was already thinking about that as a possible option.
My question is more like an opinion request, not necessarily a feature request.
So let’s say I make some class where I set the background color and use that for the sections. What about other places, like buttons, etc, where I also want to use that color? Or in the header, where I set the colors through the customizer? This is already 3 places where I set the same value. I’m a C++ programmer, and having to set the same value more than just once already feels not right.
So I’m thinking along the lines of a global CSS define of some sort, and I’d just reference that. Is this possible in any way in general? (Note: I’m a near-total beginner of HTML/CSS, so bear with me if the stuff I ask makes no sense 🙂December 8, 2016 at 7:54 pm #252872TomLead DeveloperLead Developer
Unfortunately there’s not really such thing as a global variable in CSS – at least not in this sense.
Your buttons and section classes would all be in the same area, so that wouldn’t be too difficult to switch out the colors (only a few values to change).
The header is in the Customizer, but again only one setting.
Not ideal, somewhat repetition needed – however changing 3 or 4 values to change the primary color of your entire website isn’t so bad 🙂December 8, 2016 at 11:02 pm #252896Lyle
Not sure how much of an issue/trouble it would be to change/enhance the Color picker now used to include the ability to choose and save up to, say, 4 to 8 colors. The Elementor color picker was recently updated to include this very time-saving feature as was the Beaver Builder a while back. From a lay perspective, the Elementor one looks almost identical to the GP one 🙂
Perhaps an added feature to GP Premium only at some point?
Tutorials and tips for GeneratePress, WP Show Posts, WordPress and ElementorDecember 8, 2016 at 11:56 pm #252919TomLead DeveloperLead DeveloperDecember 9, 2016 at 4:27 am #252969Balázs
OK, thanks for your thoughts.
The palette option is a good idea.
Anyway, it seems I’m not the only one having thought of the variable idea: https://www.w3.org/TR/css-variables/. Support is on the way too: http://caniuse.com/#feat=css-variables.
It’s still strange though that this didn’t exist in CSS from the get-go.December 9, 2016 at 10:29 am #253049TomLead DeveloperLead Developer
I’m sure it will happen one day – although we’ll always have to deal with the internet explorers of the world not supporting it 🙂April 1, 2017 at 1:59 am #300230Paul
Is this option to set default colors in the palette likely to happen.
PaulApril 1, 2017 at 8:17 am #300306TomLead DeveloperLead Developer
There’s a filter for that: https://docs.generatepress.com/article/generate_default_color_palettes/April 1, 2017 at 8:40 am #300323Paul
Fantastic – many thanks Tom.April 1, 2017 at 8:42 am #300325TomLead DeveloperLead DeveloperJanuary 19, 2021 at 1:54 am #1624620Gerard
I’ve been using GeneratePress for a while and I use that filter to set my customizer palette. We are on 2021 now, and CSS variables are a real thing. Do you think it would be possible to use them for the customizer?
This should include some panel where we can set a color palette (something similar as what Elementor Page Builder does) and then be able to assign those colors as if they were a variable. By this I mean that if we change the color in the palette, it would change for every option that used that color. For example:
Extra Color #1
Extra Color #2
So that if we set green to the Primary Color and then we use the primary color for different styles in the customizer, If then we change that Primary Color from, lets say, green to blue, every GP customizer element that was using that color would change to blue.January 19, 2021 at 4:15 am #1624788DavidStaffCustomer SupportJanuary 19, 2021 at 4:18 am #1624792Gerard
Hi David, is there a topic about this feature somewhere in this forum that I can follow-up?
- You must be logged in to reply to this topic.