WordPress.org

Support

Support » Themes and Templates » [Resolved] Styling Category Links on Posts

[Resolved] Styling Category Links on Posts

  • dbryanmusic
    Member

    @dbryanmusic

    Hello,

    I would like to style each category link in the header meta differently – ie yellow on hover for the category Music and pink on hover for the category Festivals.

    I think I’ve narrowed it down to the theme-functions here:

    // Translators: 1: Date 2: Author 3: Categories 4: Comments
    		printf( wp_kses( __( '<div class="header-meta">%1$s%2$s<span class="post-categories">%3$s</span>%4$s</div>', 'quark' ), array(
    			'div' => array (
    				'class' => array() ),
    			'span' => array(
    				'class' => array() ) ) ),
    			$date,
    			$author,
    			$categories_list,
    			( is_search() ? '' : $comments )
    		);

    And that I somehow need to add this to the wrapping the category link:

    class="<?php $category = get_the_category(); echo $category[0]->cat_name; ?>"

    But I can’t quite figure out how to do it. Am I on the right track? How can I style the category links on a post page differently?

Viewing 2 replies - 1 through 2 (of 2 total)
  • Theme Author Anthony Hortin
    Participant

    @ahortin

    You could use CSS Attribute Selectors to do this. For example, if you had Categories ‘Music’ and ‘Festivals’, you could use the following css to change the hover colour for those particular Categories

    .post-categories a[title*="Music"]:hover {
        background-color: #eaff00;
    }
    .post-categories a[title*="Festivals"]:hover {
        background-color: #ea00ff;
    }
    dbryanmusic
    Member

    @dbryanmusic

    So simple, thank you.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘[Resolved] Styling Category Links on Posts’ is closed to new replies.