Creating a Custom Dashboard Widget in WordPress

In WordPress, Dashboard (wp-admin) is the first screen you see when you log into the administration area of your blog.

The WordPress Dashboard allows you to control all of the behind-the-scene details of managing your site. Once you find your way around the dashboard, you’ll realize it’s really easy to use and navigate.

The Dashboard Screen presents information in blocks called widgets. By default, WordPress delivers five widgets on this page: At a Glance, Activity, Quick Draft, WordPress News, and Welcome.

In this blog, we will add a Custom Dashboard Widget and show some the posts which are been published.

So, for doing that we need to follow 3 steps:

• Registering the dashboard widget in WordPress.
• Creating a function which handles the content display.
• Calling a function to display the posts.

So lets start with the first step :

STEP 1. Registering dashboard widget in WordPress :

For registering the dashboard widget we use built in function ‘wp_add_dashboard_widget‘  :

 wp_add_dashboard_widget(
		'wk_dashboard_add_widget',
		'Custom Dashboard Widget',
		'wk_dashboard_widget_function'
	);

add_action( 'wp_dashboard_setup', 'wk_dashboard_add_widget' );

STEP 2. Creating a function which handles the content display :

In this step we will fetch the posts that we will display on our dashboard widget. As the callback option required a valid function to handle the widget’s content, let’s add a function for this named in previous step as ‘wk_dashboard_widget_function‘.

function wk_dashboard_widget_function() {
	
	global $post;
	$args = array( 'numberposts' => -1 );
	$myposts = get_posts( $args );
	display_post($myposts);
}

STEP 3. Calling a function to display the posts :

The last step include the setting up the posts on the widget. for that we will add the following code :

function display_post( $posts ) {
	?>
	<table class="wk-table">
		<tr class="wk-tr">
			<th class="wk-th" ><h2>Title</h2></th>
			<th class="wk-th" ><h2>Author</h2></th>
		</tr>
	<?php
	foreach( $posts as $post ){
		?>
		<tr class="wk-tr">
			<td class="wk-td"><a href="<?php get_permalink( $post->ID ) ?>"><?php echo get_the_title( $post->ID ); ?></a></td>		
			<td class="wk-td"><?php echo get_the_author_meta( 'display_name', $post->post_author ); ?></td>		
		</tr>
		<?php
	}
	echo "</table>";
}

After following all the above steps, now when we visit our dashboard we will find a new widget titled as ‘Custom Dashboard Widget’ listing different posts that are been published as shown in below :

Hope this blog will help you to create your custom dashboard widget in a better way to make the the dashboard area more attractive and you can enhance dashboard widgets by creating some nice styles or applying some Javascript functionality. Try this and if you have any query then just comment below.

Thanks for reading 🙂