[Resolved] Feature suggestion: custom classes in GP Header

[dmendana]

My suggestion: when you define a custom header for a certain page, add a field in content settings or advanced settings to define custom classes for the whole header in that page.

Rationale: I’m using GP Header to put photos in the background of the header. Background photos make text less readable: GP Header allows changing the text color so that you can adapt to the photo behind, but for good readability color alone is not enough. So I’m complementing color with text shadow, separating letters from their background. Since GP Header doesn’t provide text shadow, I’m doing it in CSS.

The problem is that I need two schemes for text shadow: one for light backgrounds and another for dark backgrounds. And I have no way of telling the CSS what kind of background each header has.

If I could define a custom class for each header, the same that I define custom colors and backgrounds, I could fully adapt the CSS to each different background image. Please consider the idea, since now I’d need to either associate CSS to page ids (bad), have low readability on the header (worse) or limit myself to either light or dark backgrounds (sad).

Thanks!

[Roberto Enrique]

If you’re using Simple CSS plugin: https://wordpress.org/plugins/simple-css/ you can add those CSS rules directly on that page so they’ll be loaded only there.

Apart of that, what’s the problem with targeting the headers using the page ID? That’s what they’re for after all.

You can also use custom classes for your text, like .dark-shadow and .light-shadow and use that instead in your text blocks or titles.

[dmendana]

Thanks for your suggestions. Using page IDs in CSS is not very scalable and creates a risk point (if you change the background in a page, you have to remember to change the settings in that page AND in the CSS). Regarding the classes for the text, it’s a good idea, although in my design I have the problem that the menu is transparent, right in the center of the header, and I’d like it to have the same color and text shadow scheme as the header content; and the logo too (I change between dark and light versions to make it stand against the background and give it a drop shadow).

The simple CSS plugin is interesting, I’ll take a look.

[Tom]

The Simple CSS metabox is built for stuff like this, but it’s not a bad idea having a custom classes field in the Page Header just like Sections.

Thanks for the suggestion 🙂

[Author]

Posts