I have created a WordPress plugin to create a widget area to display category names (total nmbr of post) and description.Now I want to show the category image just after the category name and after the image I want to show category description. Although category names and description display successfully I just want the complete code of how to add feature image to category and how that will display in my category description widget area.

For Reference here is my complete Category Description Widget Area code.

Plugin Name: My Category Description Widget Plugin
Plugin URI: http://mkrdip.me/category-posts-widget
Description: Adds a widget that shows all categories along with their description.
Author: Muhammad Jahangir
Version: 1.0
Author URI: http://facebook.com/jahangirKhattakPk
class categories_description extends WP_Widget
    function __construct()
        $widget_ops = array( 
            'classname' => 'categoryDescription widget',
            'description' => 'Show all categories with their description.',
        parent::__construct( 'categories_description', 'My Category Description', $widget_ops );
    // end __construct()

    public function form( $instance ) {
        $title = ! empty( $instance['title'] ) ? $instance['title'] : __( 'New title', 'text_domain' );
        <label for="<?php echo esc_attr( $this->get_field_id( 'title' ) ); ?>"><?php _e( esc_attr( 'Title:' ) ); ?></label> 
        <input class="widefat" id="<?php echo esc_attr( $this->get_field_id( 'title' ) ); ?>" name="<?php echo esc_attr( $this->get_field_name( 'title' ) ); ?>" type="text" value="<?php echo esc_attr( $title ); ?>">
    // End form function

// Updating widget replacing old instances with new
public function update( $new_instance, $old_instance ) {
    $instance = array();
    $instance['title'] = ( ! empty( $new_instance['title'] ) ) ? strip_tags( $new_instance['title'] ) : '';
    return $instance;
// End update function
    function widget($args,$instance){
           echo $args['before_widget'];
            if ( ! empty( $instance['title'] ) )

        <div class="categoriesDescription bgWhite">
                <div class="container innerContainer">
                    <h2 class="widgetTitle"><?php echo apply_filters( 'widget_title', $instance['title'] ); } ?></h2>
                        <?php $categories = get_categories();
                        foreach ($categories as $cat)

                                $cat_name = $cat->name;
                                $CategoryID = get_cat_ID( $cat_name );
                                $totalPosts = $cat->count;
                                $currentcatname = $cat_name;


                              <div class="category-image">


                                <div class="singleCategory col-lg-4">
                                    <a href="<?php echo get_category_link( $cat ); ?>" class="uppercase categoryTitle">
                                        <?php echo $cat_name; ?></a>
                                        <span class="numberOfPosts">
                                            echo '( '.$totalPosts.' )'; 
                                <div class="CategoryImg"><?php echo $cat->term_icon; ?>
                                    // here I want to show category feature image...
                                <div class="my-image">

                                <header class="archive-header <?php if ($category_image==true) echo 'category-image'; ?>">


                                <p class="CategoryDescription"><?php echo $cat->description; ?></p>
                                <p><?php echo $CategoryID; ?></p>
                            } ?>
                    <div class="clearfix"></div>

    // End widget function
//end categories_description class
    add_action('widgets_init', function() {
  • By default, featured images are not available for categories. You will need a plugin to implement it or write your own code... maybe inside your own plugin. – Capiedge Jun 6 '16 at 13:55

In general there is no such thing as a "featured image" for categories or other types of terms. The easiest thing to do is to integrate with existing plugins and themes that support this kind of functionality and/or supply an easy to use filter that for site owners to be able to customize where to get the information from.


I'd say register a custom post type, eg. cat_image, so the images can be uploaded to a post using the existing featured image metabox.

You could sync the data using wp_insert_post matching the widget ID to the custom post slug..?

// to match widget to an existing custom post
// similar to get_post but can use slug (if no post parents)
$slug = $instance['id']; // not sure on this?
$post = get_page_by_path($slug,OBJECT,'cat_image');

if (!$post) {
    // create fresh post from widget instance data
    $args = array('post_type' => 'cat_image'); // ...and all the rest
    $post = wp_insert_post($args);

$thumbnail_id = get_post_meta( $post->ID, '_thumbnail_id', true );  
$postthumbnailhtml = _wp_post_thumbnail_html( $thumbnail_id, $post->ID );

This will give you the upload element linked to the post ID... (plus you may need to make sure you have wp_enqueue_media enqueued on the widget page if it's not already?)

Anyway that is one suggestion, you would still have to build a form element around it the HTML metabox and see what happens... have not had time to test it out yet, hopefully the output is easy enough to access and insert as an attachment to the linked custom post.

  • this is so partial it is unlikely to be useful to anyone that hasn't done something like this before. – Mark Kaplun Feb 23 '18 at 7:36

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.