Adding icons for custom post in WordPress

Have you ever wished for adding custom icons to your custom type posts? If your answer is yes, then you need not to be worried about it anymore. With the help of this article you will be able to learn the method for the addition of icons and type of custom posts in your WordPress.
A term “Dashicons” is in the use of WordPress version 3.8 in which icon fonts are used. Such as font, icon looks great on any screen or in any device. If you want to add in your posts the custom icons, you can even purchase these icons.

How to add Custom Post Type icons using a plugin

The first and foremost thing is the installation and activation of the plugin “CPT Custom Icon”. After activation, you just need to go to the ‘Settings’, then to the settings of “CPT Custom Icon” where you have a list of custom post. Now, click on “Choose icon” and then select any of the fonts available in the menu.

In order to set an icon for a custom post type as shown in the screen shot above, you need to set up a “Custom Post Type” first. The easiest way to do that is described in the next section.

How to add icons using Custom Post Type UI Plugin

For beginners in custom post, we highly recommend them to use the plugin “Custom Post Type UI” in order to create or manage the type of custom post and taxonomies.

The addition of those icons which are created by using the “CPT UI” plugin is so simple. The Dashicon is by default supported by it, just select that icon which you want in your post to use after visiting the website of Dashicons.
You can see the class of icons after watching the large version of the icon. You are required to edit the type of custom post and copy CSS class if you are looking for the addition in “CPT UI”. Now, you are just required to click the link on ‘Advance Options’ and then sroll your cursor down to “Menu Icon”. When you are done with pasting the class of CSS, save the changes.
You can create an image icon by simply clicking on Media -> Add New and you can upload it. Afterwards, when the image has been uploaded just let “Edit link” and copy the file of “image URL”. In the settings of CPT UI just paste this URL.

How we can Manually Add Icon to a Custom Post Type

You have an option to add the icons of the menu, if a post is created that is customized by you after placing the code in the plugin (site-specific) file of functions.php. For the selection of icon and to copy the CSS class, just visit the website of Dashicons. When you are done with it, add it in the custom post code as given below:

 // Register Custom Post Type
function custom_post_type() {

	$labels = array(
		'name'                => _x( 'products', 'Post Type General Name', 'text_domain' ),
		'singular_name'       => _x( 'Product', 'Post Type Singular Name', 'text_domain' ),
		'menu_name'           => __( 'Products', 'text_domain' ),
		'parent_item_colon'   => __( 'Parent Item:', 'text_domain' ),
		'all_items'           => __( 'All Items', 'text_domain' ),
		'view_item'           => __( 'View Item', 'text_domain' ),
		'add_new_item'        => __( 'Add New Item', 'text_domain' ),
		'add_new'             => __( 'Add New', 'text_domain' ),
		'edit_item'           => __( 'Edit Item', 'text_domain' ),
		'update_item'         => __( 'Update Item', 'text_domain' ),
		'search_items'        => __( 'Search Item', 'text_domain' ),
		'not_found'           => __( 'Not found', 'text_domain' ),
		'not_found_in_trash'  => __( 'Not found in Trash', 'text_domain' ),
	);
	$args = array(
		'label'               => __( 'Products', 'text_domain' ),
		'description'         => __( 'Post Type Description', 'text_domain' ),
		'labels'              => $labels,
		'supports'            => array( ),
		'taxonomies'          => array( 'category', 'post_tag' ),
		'hierarchical'        => false,
		'public'              => true,
		'show_ui'             => true,
		'show_in_menu'        => true,
		'show_in_nav_menus'   => true,
		'show_in_admin_bar'   => true,
		'menu_position'       => 5,
		'menu_icon'           => 'dashicons-cart',
		'can_export'          => true,
		'has_archive'         => true,
		'exclude_from_search' => false,
		'publicly_queryable'  => true,
		'capability_type'     => 'page',
	);
	register_post_type( 'Products', $args );
}

// Hook into the 'init' action
add_action( 'init', 'custom_post_type', 0 ); 

With the help of this article you should be able to learn about the addition of icons in your custom post in WordPress.