- This topic has 11 replies, 3 voices, and was last updated 6 months, 1 week ago by
Tom.
-
AuthorPosts
-
August 27, 2020 at 5:55 am #1420271
kevin
Hey there,
I’d like to color article tags on my blog feed in different colors, like on https://coywolf.pro/ (screenshot: https://ibb.co/smtmVRq). Say, a tag like “SEO” would have a different font color (or font background) than a tag like “content marketing”.
Appreciate your help!
KevinAugust 27, 2020 at 6:10 am #1420296David
StaffCustomer SupportHi there,
it would require CSS that targets the category link based upon some unique string in the links href eg.
.cat-links a[href*='unique-string'] { color: red; }
Simply write a rule for each category
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 27, 2020 at 6:16 am #1420307kevin
Got it! And the unique string would be the tag URL?
Thanks, David.
August 27, 2020 at 7:06 am #1420372David
StaffCustomer SupportYeah for example
mysite.com/red-hats
you could use
.cat-links a[href*='hats']
But more specifically wold be ‘red-hats’
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 27, 2020 at 4:09 pm #1421125kevin
Thanks, David!
Unfortunately, it didn’t work.
I added
.cat-links a[href*='technical-seo'] { color: #ef0175; }
to
https://www.kevin-indig.com/internal-linking-the-full-guide-to-internal-link-axioms/
but the tag link below the headline is still white :).
August 28, 2020 at 3:18 am #1421549David
StaffCustomer Supportaah – that code only works on cat-links that are output in the entry meta.
For those in the Hero you would do this:.page-hero a[href*='technical-seo'] { color: #ef0175; }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 28, 2020 at 5:58 am #1421700kevin
Thaaaaat is what I’m looking for. You’re the man, David.
I’m curious: if I wanted to display tags in my blog feed on the homepage (https://www.kevin-indig.com) with that some color coding, how would the code change?
Thanks again.
August 28, 2020 at 6:57 am #1421767David
StaffCustomer SupportThats using a block plugin does it support displaying categories and tags ?
We recommend using the WP Show Posts plugin – its not Block based but its far more powerful and provides terms etc. And thats something we can help style:
https://en-gb.wordpress.org/plugins/wp-show-posts/
NOTE: Having more than one Post list with paging navigation creates issues. You’ll notice your current lists – both of them change pages when changing page number. You should only have one list with paging at the most.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 28, 2020 at 8:21 am #1421990kevin
Thank you, David. Such a great help!
August 28, 2020 at 8:34 am #1422016David
StaffCustomer SupportYou’re welcome.
Let us know if you want help with WP Show Posts – its one of Tom’s plugins – super light and powerful 🙂Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 28, 2020 at 8:55 am #1422056kevin
Thanks, David. I think it’s a good fit for my custom tag pages.
I tried it out on the homepage but what I actually need is to display posts by category with their tags under the title. Hope that makes sense :).
August 28, 2020 at 2:51 pm #1422377Tom
Lead DeveloperLead DeveloperRight now WPSP displays the terms from the queried taxonomy, so that would be tough, unfortunately.
However, you can query by category and then manually add the tags like this: https://wpshowposts.com/support/topic/show-data-below-post-title/#post-18009
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development -
AuthorPosts
- You must be logged in to reply to this topic.