WP - Category Count

The Finished Project

Have you seen this before?

and you want it to look way better? Here's how.

The PHP script below must be copied into your function.php file.

How It's Done

PHP

   function add_span_category_count($links) {
      $links = str_replace('</a> (', '</a> <span class="category-count text-right">', $links);
      $links = str_replace(')', '</span>', $links);
      return $links;
   }
   add_filter('wp_list_categories', 'add_span_category_count');

               

CSS

   // Category Count Settings
   li.cat-item a {
      display: inline-block;
      text-align: left;
      position: relative;
      transition: all 240ms ease-in-out;
   }
   li.cat-item a:hover, 
   li.cat-item a:focus {
      color: #FFFFFF;
      transform: translateX(-5px);
   }   
   span.category-count {
      position: absolute;
      right: 10px;
      background-color: #CCC3B8;
      border-radius: 10px;
      padding: 2px 10px;
      font-size: 10px;
      min-width: 26px;
      text-align: center;
   }