Extending the WordPress Admin Dashboard

Posted on 20th June 2023

Extending the WordPress Admin Dashboard

As a WordPress developer, sooner or later you will need to extend the functionality of the admin dashboard. This can be done by developing a custom plugin or by adding some code to your functions.php file.

In this article, we will show you how to extend the WordPress admin dashboard by adding a custom dashboard widget. We will also show you how to add a top-level menu item to the admin dashboard.

Adding a Custom Dashboard Widget

The first thing you need to do is to create a new file called my-dashboard-widget.php and place it in your plugin directory.

In my-dashboard-widget.php, you need to write the following code:

In the code above, we first created a new function called my_dashboard_widget_registration(). This function is responsible for registering our custom dashboard widget with WordPress.

Next, we used the wp_add_dashboard_widget() function to add a new widget to the WordPress admin dashboard. The first parameter is the widget slug, which is a unique identifier for our widget.

The second parameter is the widget title, which is the title that will be displayed on the admin dashboard.

The third parameter is the name of the function that will be responsible for displaying the widget content. In our case, the function is called my_dashboard_widget_display().

Finally, we used the add_action() function to hook our my_dashboard_widget_registration() function to the wp_dashboard_setup action hook.

The wp_dashboard_setup action hook is fired when the admin dashboard is loaded. This is the hook that we need to use in order to add our custom dashboard widget.

Next, we created the my_dashboard_widget_display() function. This is the function that is responsible for displaying the content of our dashboard widget.

In our case, we simply used the echo statement to output the string “Hello World, I’m a custom dashboard widget!”.

Now that we have added the code to our plugin, we can activate it and see the results.

When you visit the admin dashboard, you should see our custom dashboard widget in the list of available widgets:

You can now drag and drop our widget to any of the available dashboard widget areas. Once you drop the widget in its new location, you should see the following output:

As you can see, our widget is now successfully displayed on the admin dashboard.

Adding a Top-Level Menu Item

In some cases, you may need to add a top-level menu item to the admin dashboard. This can be useful if you want to create a custom admin page or if you want to group multiple admin pages under a single menu item.

In order to add a top-level menu item, you need to use the add_menu_page() function. This function accepts the following parameters:

$page_title

The text to be used as the menu item title.

$menu_title

The text to be used as the menu item label.

$capability

The user role that will be able to access the menu item.

$menu_slug

The unique identifier for the menu item.

$function

The name of the function that will be responsible for displaying the menu item content.

$icon_url

The URL of the icon to be used for the menu item.

$position

The position of the menu item in the menu.

Let’s take a look at an example:

In the code above, we first created a new function called my_menu_item_registration(). This function is responsible for registering our top-level menu item with WordPress.

Next, we used the add_menu_page() function to add a new top-level menu item to the admin dashboard. The first parameter is the page title, which is the text that will be used as the menu item title.

The second parameter is the menu title, which is the text that will be used as the menu item label.

The third parameter is the capability, which is the user role that will be able to access the menu item. In our case, we used the manage_options capability, which is available to administrators only.

The fourth parameter is the menu slug, which is the unique identifier for the menu item.

The fifth parameter is the name of the function that will be responsible for displaying the menu item content. In our case, the function is called my_menu_item_display().

The sixth parameter is the URL of the icon to be used for the menu item. In our case, we used the dashicons-admin-generic icon.

The seventh and final parameter is the position of the menu item in the menu.

Finally, we used the add_action() function to hook our my_menu_item_registration() function to the admin_menu action hook.

The admin_menu action hook is fired when the WordPress admin dashboard is loaded. This is the hook that we need to use in order to add our top-level menu item.

Next, we created the my_menu_item_display() function. This is the function that is responsible for displaying the content of our top-level menu item.

In our case, we simply used the echo statement to output the string “Hello World, I’m a custom top-level menu item!”.

Now that we have added the code to our plugin, we can activate it and see the results.

When you visit the admin dashboard, you should see our top-level menu item in the list of available menu items:

When you click on our menu item, you should see the following output:

As you can see, our top-level menu item is now successfully displayed on the admin dashboard.

Conclusion

In this article, we showed you how to extend the WordPress admin dashboard by adding a custom dashboard widget and a top-level menu item.

Adding a custom dashboard widget is a great way to add some custom functionality to the admin dashboard. In most cases, you will need to use the add_dashboard_widget() function.

If you need to add a top-level menu item to the admin dashboard, you can use the add_menu_page() function.

We hope this article helped you learn how to extend the WordPress admin dashboard.