[Support request] How to change background color for selected widgets

[Tawna]

How to change background color for selected widgets (not the entire sidebar)

[Leo]

Hi there,

You would need to target the specific widget.

Any chance you can link us to the page in question?

You can use the private information field:
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

Let me know 🙂

[Tawna]

sent – I added it in the gray field below – can you see it?

[David]

Hi there,

you will need some CSS.
This for example:

.left-sidebar .widget:nth-of-type(2) {
    background-color: #f00;
}

The nth-of-type(2) property will target the 2nd .widget in the left-sidebar

You can repeat that CSS rule and change the 2 for anyone you like.

And if you want to use one of your Customizer GLobal Colors then you can use a var like so:

.left-sidebar .widget:nth-of-type(2) {
    background-color: var(--contrast);
}

Just swap the --contrast for your chosen global color variable name

[Tawna]

That worked perfectly – thank you

[David]

Glad to be of help!

[Author]

Posts