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. the icon no work…

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!