Hello,
How can I customize how the category labels appear on block 1. Currently is white text with a black background. I would like to change these colours and also the font size and type.
Thanks!
Hello,
Unfortunately the category tag can only be changed with css.
Please use this code to change the category tags color:
.td-post-category, .td-meta-info-container .td-post-category{
background-color:Red
}
Thank you!
Hello,
Thanks but this isn’t the change am trying to make – the code you provided changed the category tag for all the blocks.
What am trying to do is to change only the appearance of category tag of Block 1.
Image here–>https://ibb.co/goTEOb
Thanks!
Hi,
That can be done by including the block name in the code, like this
– https://www.screencast.com/t/IrffUZWmZ
This will affect only blocks of this type (block 1). By default the category tags hover color is the theme accent color, but you could change that as well for this particular block if you need to
– https://www.screencast.com/t/HDGKW0hzH
This is the code for the default category tags
.td_block_1 .td-post-category {
color: yellow;
background-color: blue;
}
This is for the hover color if you require it as well
.td_block_1 .td-post-category:hover {
color: green;
background-color: brown;
}
Thanks
Thanks Simion, this works.
But i would like to modify it further. Block 1 has two post sizes – one big one and the other ones are smaller.
I would like to change the category tag css for only the smaller ones.
Then the module type has to be included in the code, like this
– https://www.screencast.com/t/OKaIdM8Kc
.td_block_1 .td_module_6 .td-post-category {
color: yellow;
background-color: blue;
}
.td_block_1 .td_module_6 .td-post-category:hover {
color: green;
background-color: brown;
}
Is it possible to assign different colors to different categories (regardless of what block/module). What would the css be to do that please?
@gpldev So you want to customize the category tag by actual category name, instead of module or block. That would be possible but somewhat difficult, the code would have to take into account the category name. Try something like this where in the same block, each tag is customized by category name
– https://www.screencast.com/t/ajIMHgY1kMuH
You can modify the code to be more precise if needed, this will affect all the website (every instance of the category tag).
This is the code used in the example if you would like to use it (use your own category names in it)
.td-post-category[href*=""]{
background-color: yellow;
}
Thanks
thanks for that, I’ll see if my developer can help me with that. I’d like to ask a few very general questions about this theme that might help me get moving forward.
There is a home page demo that I like. It looks like the way the pages are built, I can edit the top part with the tag editor. But how do I change what category shows up in the big grid image? How do I specify what shows there…am I just stuck with the way it is? I’m pretty confused on the way it works. Is there a tutorial that would show me how to customize one of the homepage demo pages? Including the block and modules?? Blocks and modules..is there a place to define what goes in those somewhere. Thank you for any input.
Nevermind, the video was really helpful!
Thanks,
Simion,
thank you very, very much for your code.
I didn’t know about substring-matching attribute selectors in CSS.
