Flavor up your WordPress website by adding Category specific icons to each and every category. Now just wonder how your website would look if all the categories are embedded with some really wonderful and flair icons.

It is not necessary that you assign icons to all the categories rather than add icons to some specific categories so that they appear different from other unassigned categories.

Thinking of How to : Add Icons to Category in WordPress

Adding icons to specific categories would help users identify which content they are going through. The icon assigned to a category will turn up all over your website and would deliver an awesome look to your WordPress website.

Now how’s this possible in your website, the easy and efficient way in WordPress is always the use of WordPress plugins.

Recommended Reading:

How to Assign Icons to Categories using WordPress Plugins

There are many plugins to overcome this job in WordPress, lets have a look.

1. Category Icons

Category Icons

This is the no.1 plugin regarding the option of adding icons to categories. This plugin allows you to associate a very different image to all the categories.

With this plugin you can modify your website with a unique look and a bit different from other websites.

Salient Features

  • Displays icons in front of category specific posts.
  • Loaded with Category icon widgets.
  • Exhibits icons in the sidebar of your website.
  • Easy to configure from settings menu.
  • Yields the natural HTML code of img tag.
  • Displays icons in the RSS Feeds.

How to use Category Icons to add icons to categories

Step 1:

The basic step Login to your WordPress account and go to plugins section.

Step 2:

Look out for the plugin and Install the plugin in your website.

Note: Beginners guide to Install a plugin automatically and Manually

Step 3:

Visit Settings >> Category Icons and configure the settings.

2. Category & Page Icons

Category and Page Icons

One of the easy way to add icons to sidebar of the categories is using this plugin. This is a very flexible plugin loaded with some very nice features.

With the help of this plugin you can add icons to the sidebar of your blog/website in the respective categories and pages.

3. Categories Images

This is also a very nice and effective plugin in the field of adding images to categories.

#Check this Out : How to Write Content in WordPress Without Typing

How to Manually Add Icons to Categories

Any blogger or webmaster who wants to create a custom type can play a little bit around the code and make their hands dirty.

The code is very simple as its only a CSS (  ) styling.

The only thing you have to do is to look out for the URL address of your favorite icon and go to style sheet which is available in your theme on your Dashboard.

1. Go to Appearance >> Edit CSS

2. In the section place the code which is mentioned below and just save it.

.category-WP Ideas {background: url (http://www.example.com/wp-contents/uploads/wp-ideas.jpg) no-repeat top right;

}

In this you only need some categories and add background images using the stylesheet code

3. Add custom icons to different categories using the CSS file named ‘custom.css’ or any other.

.custom .wp .wp-ideas-icons {height:40px; width:40px; float:right; margin:1.0em;

}

              .custom .wp .wp-ideas-icons.FIRST-unique-class-here {

background: url(‘images/category-wpimage-small.png’)  no-repeat top right;

              .custom .wp .wp-ideas-icons.SECOND-unique-class-here {

background: url(‘images/category-wpimage1-small.png’)  no-repeat top right;

}

4. There is also a PHP code where you can add images to the background of different categories to appear wherever you want the image to appear.

The following code outputs category images named after cat_ID along with alt attribute set it to cat_name, you can use any other variable also.

phpforeach((get_the_category()) as $category) {

    echo ‘<img src=”http://example.com/images/’ . $category->cat_ID . ‘.jpg” alt=”‘ . $category->cat_name . ‘” />’;

}

?>

Now in this just replace the ‘example.com/images’ with the original path of the image either to a folder or a website in proper jpg format.

5. Now if you want to show the first category only:

php

$category = get_the_category();

echo $category

[0]->cat_name;

?>

6. Now if you want to make the first category link to the category page use the following code:

php$category = get_the_category();

if($category[0]){

echo ‘<a href=”‘.get_category_link($category[0]->term_id ).'”>’.$category[0]->cat_name.'</a>’;

}

?>

The above codes are the basic codes which are implemented in WordPress.org codex.

So apply the following codes in your WordPress website and add icons to all specific categories which you want.

If you are bit confused in coding then the evergreen way in WordPress is to use the WordPress Plugins to implement all you want to show in your blog.

So that’s all for now in this category, If you have any firing question then Don’t be shy, Do share with us.