Docs

[bibianasilveira]

Hi,
my website is http://bergamotadesign.com/, I’m running X theme version 4.6.0 with a child theme setup.

What I want to do, and haven’t found here info on, is to establish a category color that will affect link color for that category posts only. Is it possible?

Ty

[Darshana]

Hi there,

Thanks for writing in! Because this requires a template change, I’d advise that you setup a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

Then add the following code into your child theme’s functions.php file.

  function x_integrity_entry_meta() {

    //
    // Author.
    //

    $author = sprintf( '<span><i class="x-icon-pencil" data-x-icon=""></i> %s</span>',
      get_the_author()
    );

    //
    // Date.
    //

    $date = sprintf( '<span><time class="entry-date" datetime="%1$s"><i class="x-icon-calendar" data-x-icon=""></i> %2$s</time></span>',
      esc_attr( get_the_date( 'c' ) ),
      esc_html( get_the_date() )
    );

    //
    // Categories.
    //

    if ( get_post_type() == 'x-portfolio' ) {
      if ( has_term( '', 'portfolio-category', NULL ) ) {
        $categories        = get_the_terms( get_the_ID(), 'portfolio-category' );
        $separator         = ', ';
        $categories_output = '';
        foreach ( $categories as $category ) {
          $categories_output .= '<a href="'
                              . get_term_link( $category->slug, 'portfolio-category' )
                              . '" title="'
                              . esc_attr( sprintf( __( "View all posts in: &ldquo;%s&rdquo;", '__x__' ), $category->name ) )
                              . '"><i class="x-icon-bookmark" data-x-icon=""></i> '
                              . $category->name
                              . '</a>'
                              . $separator;
        }

        $categories_list = sprintf( '<span>%s</span>',
          trim( $categories_output, $separator )
        );
      } else {
        $categories_list = '';
      }
    } else {
      $categories        = get_the_category();
      $separator         = ', ';
      $categories_output = '';
      foreach ( $categories as $category ) {
        $categories_output .= '<a href="'
                            . get_category_link( $category->term_id )
                            . '" title="'
                            . esc_attr( sprintf( __( "View all posts in: &ldquo;%s&rdquo;", '__x__' ), $category->name ) )
                            . '."class='."$category->slug".'><i class="x-icon-bookmark" data-x-icon=""></i> '
                            . $category->name
                            . '</a>'
                            . $separator;
      }

      $categories_list = sprintf( '<span>%s</span>',
        trim( $categories_output, $separator )
      );
    }

    //
    // Comments link.
    //

    if ( comments_open() ) {

      $title  = apply_filters( 'x_entry_meta_comments_title', get_the_title() );
      $link   = apply_filters( 'x_entry_meta_comments_link', get_comments_link() );
      $number = apply_filters( 'x_entry_meta_comments_number', get_comments_number() );

	  $text = ( 0 === $number ) ? 'Leave a Comment' : sprintf( _n( '%s Comment', '%s Comments', $number, '__x__' ), $number );

$comments = sprintf( '<span><a href="%1$s" title="%2$s" class="meta-comments"><i class="x-icon-comments" data-x-icon=""></i> %3$s</a></span>',
        esc_url( $link ),
        esc_attr( sprintf( __( 'Leave a comment on: &ldquo;%s&rdquo;', '__x__' ), $title ) ),
        $text
      );

    } else {

      $comments = '';

    }

    //
    // Output.
    //

    if ( x_does_not_need_entry_meta() ) {
      return;
    } else {
      printf( '<p class="p-meta">%1$s%2$s%3$s%4$s</p>',
        $author,
        $date,
        $categories_list,
        $comments
      );
    }

  }

Now you can add you own CSS using the category slug which you can find it from here (http://your-domain.com/wp-admin/edit-tags.php?taxonomy=category).

For example, you can add the following CSS rules into your Customizer, Custom > CSS area.

.category-slug {
    color: #008000;
}
.conversas-entre-a-e-b {
    color: #336699;
}

Hope that’s clear.

[bibianasilveira]

Thanks, it worked specifically for the category meta links, now I want it to go for all links in posts belonging to that category, is that possible?

[Christopher]

Hi there,

Please add this code as well :

.category-slug  a{
    color: #008000;
}

Hope that helps.

[bibianasilveira]

didn’t work… not sure if it’s because of something in my custom code. tried removing custom link color, didn’t work as well. in next message, marked private, is the custom css

[bibianasilveira]

This reply has been marked as private.

[Joao]

Hi There,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– FTP credentials

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks

Joao

[bibianasilveira]

This reply has been marked as private.

[Darshana]

Hi there,

Please copy all your custom CSS rules under Customizer, Custom > CSS area into an online tool like CSS Lint (http://csslint.net/) and check for errors.

When you have errors, you CSS won’t parse correctly until you fix them. Most common issues are missing closing brackets etc.

Hope that helps.

[Author]

Posts