X

How to Add WordPress Post Types to the Dashboard ‘At a glance’ Widget

Snippets by IsItWP

Are you looking for a way to add WordPress port types to the dashboard ‘At a glance’ widget? While there’s probably a plugin for this, we have created a quick code snippet that you can use to add WordPress post types to the dashboard ‘At a glance’ widget.

The WordPress dashboard includes a handy widget that displays some brief information about your site at a glance – rather creatively, it’s titled ‘At a Glance’. By default, it shows you the number of posts, pages, and comments on your site allowing you to click through to edit each of those sections if you have the right permissions.

When building a plugin with a custom post type, it’s often a good idea to add your post type to the widget as it makes things more accessible and generally more user friendly for everyone. Using the snippet below you can add any number of custom post types to this widget. All you need to do is replace the $post_types array with an array of the post types that you want to add to the widget. You’ll see that the snippet includes a security check so that only users with permission to edit each post type will be able to click through and do so.

Once you have added the post types to the widget, they’ll have a circle icon next to them by default. But, you can easily replace that with any of the dashicons available in MP6 and WordPress 3.8+. All this takes is some simple CSS. The CSS provided here will replace the circle with the same icon that the Posts post type uses. You can replace the content attribute there with one of the icons from this set – just select your icon and copy the relevant CSS from the link provided.

Instructions:

All you have to do is add this code to your theme’s functions.php file or in a site-specific plugin:

add_filter( 'dashboard_glance_items', 'custom_glance_items', 10, 1 );

function custom_glance_items( $items = array() ) {

    $post_types = array( 'post_type_1', 'post_type_2' );
    
    foreach( $post_types as $type ) {

        if( ! post_type_exists( $type ) ) continue;

        $num_posts = wp_count_posts( $type );
        
        if( $num_posts ) {
      
            $published = intval( $num_posts->publish );
            $post_type = get_post_type_object( $type );
            
            $text = _n( '%s ' . $post_type->labels->singular_name, '%s ' . $post_type->labels->name, $published, 'your_textdomain' );
            $text = sprintf( $text, number_format_i18n( $published ) );
            
            if ( current_user_can( $post_type->cap->edit_posts ) ) {
                $items[] = sprintf( '<a class="%1$s-count" href="edit.php?post_type=%1$s">%2$s</a>', $type, $text ) . "\n";
            } else {
                $items[] = sprintf( &apos;&lt;span class=&quot;%1$s-count&quot;&gt;%2$s&lt;/span&gt;&apos;, $type, $text ) . &quot;\n&quot;;
            }
        }
    }
    
    return $items;
}

Add the following code to your CSS file.

#dashboard_right_now a.post_type-count:before,
#dashboard_right_now span.post_type-count:before {
  content: "\f109";
}

Note: If this is your first time adding code snippets in WordPress, then please refer to our guide on how to properly copy / paste code snippets in WordPress, so you don’t accidentally break your site.

If you liked this code snippet, please consider checking out our other articles on the site like: 10 best WordPress table plugins to organize data and how to create a popup form in WordPress.

Comments   Leave a Reply

  1. the icon no work…

  2. the icon no work…

  3. the icon no work…

  4. the icon no work…

  5. the icon no work…

  6. the icon no work…

  7. the icon no work…

  8. the icon no work…

  9. the icon no work…

  10. the icon no work…

  11. the icon no work…

  12. the icon no work…

  13. the icon no work…

  14. the icon no work…

  15. the icon no work…

  16. the icon no work…

  17. the icon no work…

  18. the icon no work…

  19. the icon no work…

  20. the icon no work…

  21. the icon no work…

  22. the icon no work…

  23. the icon no work…

  24. the icon no work…

  25. Excellent snippet 🙂

    One suggestion for improvement. You can
    make the text displayed in the ‘at a glance’ widget link to the page
    where the custom post types are displayed; just like normal posts or
    pages.

    Simply change (first occurence):

    $items[] = sprintf( ‘%2$s’, $type, $text ) . “n”;

    To this:
    $items[] = sprintf( ‘%2$s’, $type, ‘<a href=”‘ . admin_url() . ‘edit.php?post_type=’ . $type . ‘”>’ . $text . ‘‘ ) . “n”;

    It will even work within the foreach loop; still allowing you to define the custom post types in the first variable of the function.

    Thanks man!!

    1. I think you forgot to close your tag…

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

WordPress Launch Checklist

The Ultimate WordPress Launch Checklist

We've compiled all the essential checklist items for your next WordPress website launch into one handy ebook.
Yes, Send Me the Free eBook!