WP SITES

Log in

Different Color For Each Category Link In Genesis Post Meta

—

by

Brad Dalton

This solution enables you to style each category link in the post meta with a different color using CSS.

Here’s a very simple example:

entry-categories

You can also use this code to style ordered and unordered list items differently.

Here’s the code:

Register for full access

Related Tutorials

Comments

6 responses to “Different Color For Each Category Link In Genesis Post Meta”

  1. j d Avatar
    j d

    Great tutorial, any idea how I can style category widget with the same code? Tackle the sidebar widget to show the same colors.

    Thank you.

    1. Brad Dalton Avatar
      Brad Dalton

      You can do that using pure CSS. No need for PHP.

  2. Tatiana Avatar
    Tatiana

    1. Yes.

    2. I realize that this is probably a simple CSS ‘Google and find it yourself’ question, but would you please provide an example so that I know where to start?

    1. Brad Dalton Avatar
      Brad Dalton

      1. Try the post_terms shortcode.
      2. The code which generates the links for post_terms doesn’t generate a unique class for each link so you would need to filter or rewrite the code for the post_terms shortcode with a modification to do so. I suggest using the $term->slug for each class.

      Several hours to do this in my opinion because of the limitations with the get_the_term_list function. Also see genesis > lib > shortcodes > post.php line 553.

      Another option is to use the term_links filter

  3. Tatiana Avatar
    Tatiana

    Would this be possible to modify to show custom taxonomy instead (i.e. genres, titles, etc)? Also, I vaguely remember reading somewhere being able to use css to reference specific categories by name instead of using :nth-child . Am I delirious from *finally* finding a solution to this should-be-simple issue, or is that possible as well?

    I’m interested in modifying this for use on a fiction site and styling the different genres and child categories by color (i.e. main category ‘fantasy’ as teal, as well as the specific titles underneath it. Category ‘romance’ in red, etc.) It would be easier to target the specific categories by name, rather than the first link being red, second orange, etc.

    Thanks!

    1. Brad Dalton Avatar
      Brad Dalton

      1. You mean replace tags with links to taxonomy archives?

      2. Yes

Leave a Reply

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.