[Resolved] Theme: Newsroom, News Feed page, colour categories

[Manuela]

Hello,

in the example theme the categories are highlighted in colour. Since the categories are displayed in white font, it is also more pleasant for the readers if they are highlighted in colour.

How do I get one colour per category?

Thanks for the support. 😀 Manuela

[David]

Hi there,

the demo uses some custom CSS to styles its terms, which unfortunately requires a little bit of work to change over.
if you’re happy to walk through with me, ill tell you how to change it.

1. Go to Customizer > Additional CSS and delete the Following code:

body:not(.single):not(.blog):not(.search-results) .post-term-item {
	padding: 5px 10px;
}
body.blog .post-term-item,
body.search-results .post-term-item
{
	padding: 10px 20px;
}
body:not(.single):not(.blog):not(.search-results) .post-term-item {
	border-radius: 3px;
}
body:not(.single) .post-term-item.term-business {
	background-color: var(--business);
}
body:not(.single) .post-term-item.term-community {
	background-color: var(--community);
}
body:not(.single) .post-term-item.term-education {
	background-color: var(--education);
}
body:not(.single) .post-term-item.term-entertainment {
	background-color: var(--entertainment);
}
body:not(.single) .post-term-item.term-lifestyle {
	background-color: var(--lifestyle);
}
body:not(.single) .post-term-item.term-technology {
	background-color: var(--technology);
}
body:not(.single) .post-term-item.term-travel {
	background-color: var(--travel);
}

2. Go to Customizer > Colors and add a New Global Color and call it: term-color and set the default color you would like.

3. In Customizer > Additional CSS add this CSS:

body:not(.single) .post-term-item {
    background-color: var(--term-color);
}

If that works then all the terms should now be your new term color ?
If so, let me know and we can do the color swapping bit 🙂

[Manuela]

Hello David

Again I have learned something new.

Thank you, your answer helped me.

I just changed the category labels in the code and put a matching colour as a term.

Voila, it worked. Thank you.😀

[David]

Glad to hear that!!

[Peter]

Hi
If I ad a new category and put it in the menu, how do I give it a background color og ny choice?

[Ying]

Hi Peter,

Can you open a new topic and link us to your site?

Please point out which menu item you were referring to as well.

Let me know!

[Peter]

Yes, I’ll do that.

[Author]

Posts