WordPress Dashboard Widget – Add Your Own Custom Widget

I got to playing last nigh with WordPress (again). My wife uses the WordSpew Plugin on her site for her and her sister to talk back and forth on the dashboard.

They run a Twilight Fan site and the 2 of them post articles to the site. So they use WordSpew to communicate. I got it working on the dashboard by simply adding the code to the dashboard file (wp-admin/index.php) and adding the code to import the css into the wp-admin/admin-header.php file.

On top of that I also told it to only display on the dashboard for my wife and her sister.

So, this turned into a hassle whenever she upgraded her WordPress it would of course wipe this out because he files get replaced with upgrades.

So I decided to try and find a way to add a widget to the admin dashboard. My good friend Google helped me out and landed me at wpbeginner.com with an article titled How to Add Custom Dashboard Widgets in WordPress.

The code below will go into your themes function.php file and is very useful. Once discovered this I have a ton of thoughts on what can be done here.

What this ultimately will do is allow my wife to upgrade her site at will without me having to go reconstruct the “chat” box for her and her sister every time.

But it is pretty simple, here is the basic code that the article above posted -

    add_action('wp_dashboard_setup', 'my_custom_dashboard_widgets');

    function my_custom_dashboard_widgets() {
    global $wp_meta_boxes;

    wp_add_dashboard_widget('custom_help_widget', 'Theme Support', 'custom_dashboard_help');
    }

    function custom_dashboard_help() {
    echo '

Welcome to Custom Blog Theme! Need help? Contact the developer here. For WordPress Tutorials visit: WPBeginner

';
    }

Ok, let’s look at each piece so you know what is going on.

Line 1 – Basically telling WordPress to add your function to the dashboard

Line 3 – This is the actual function that you are adding to your dashboard. The name of this function needs to match what you have in line 1 or vise versa. This function is lines 3-7.

Line 6 – this is actually adding the widget. If you notice it is part of the function from line 3.
‘custom_help_widget’ is a div that will be created for your content. Name it what ever you want.
‘Theme Support’ – This is the title that will appear at the top of the widget.
‘custom_dashboard_help’ – name of the function that is being inserted.

Line 9 – this is the function with the code that will appear in your widget. It can contain what ever you want. The name of this function is what appears in line 6.

Below is the code I used to add the WordSpew code into a widget on my wife’s dashboard. You will see that I set it so that only user ID’s 1 and 2 will see this. I have this inserting all the code necessary to get the WordSpew pluggin working…css and all.

add_action('wp_dashboard_setup', 'admin_wordspew');

	function admin_wordspew() {

	global $wp_meta_boxes;
    wp_add_dashboard_widget('jeni_lisa_chat', 'Jeni And Lisa\'s Chat', 'Jeni_Lisa_Chat');
}

	function Jeni_Lisa_Chat() {
	global $current_user;
	get_currentuserinfo();

    global $jal_version;
      $jal_wp_url = get_bloginfo('wpurl') . "/";
		echo '
		

		
		';

if ( $current_user->ID == 1 OR $current_user->ID == 2) {
jal_get_shoutbox();
}

}

Works great and I think I will be using this for a lot of stuff.

Other possible ideas would include something like adding the latest headline from your favorite blogs using WordPress’s built in RSS fetcher.

As much time as I spend on my WordPress Dashboard, it wouldn’t be a bad idea to start creating the dashboard so that all the information that I usually go out and get, is right there for me.

Next I will be building a plugin to achieve this same thing. We’ll see how well that goes or how long it takes me to get around to it.