Styling Titles

Hi Scotm,

There are a few ways you can handle such a task. If you want to add icons to the left of page titles you can do so in the exact way you would add icons to the navigation (through the use of CSS pseudo classes). For example,

.entry-title:before {
        content: "\e0f8";
  }

But if you wanted to add different icons to posts with different categories (for example) you would need to write a custom function within your functions.php file.

You would still use the css pseudo class :before to place your icon before the title. This is a very rough mock up of a function to achieve what I think you are after (this also assumes each pots has one category). (remember this goes in your functions.php file)

function addSvgIconsToTitles() {
   $categorie = wp_get_post_categories();
   if ( $category == 'Blog' ) {
    echo '<style>
      .entry-title:before {
         content: "\e0f8";
      }
    </style>';
   }
   else if ( $category == 'Education' ) {
    echo '<style>
      .entry-title:before {
         content: "\e0f9";
      }
    </style>';
   }
   else if ( $category == 'Video Games' ) {
    echo '<style>
      .entry-title:before {
         content: "\e0f6";
      }
    </style>';
   }
}
add_action("wp_head","addSvgIconsToTitles");

Essentially this will check which category you post falls under, and then append an icon based on that decision.

Remember this is just a rough mock up of a function that may work for you. Your post title classes may be different, and you may need to tweak the function for your specific needs.

There are also a few other variations for achieving this, such as javascript or jQuery solutions but they are a bit more involved.

If you need further, more specific help you can get in contact with me through my site and I will provide some support through e-mail. That way I can get some basic info from you that may help with trouble shooting.

Thanks!
Evan