ClassicPress Plugin Development: Create Custom Top Level Menu

This post is part of the ClassicPress Plugin Development series in which I am going to look at both best practice for developing plugins and how I approach some requirements as well as some of the functions I commonly use.

While it is most common to add an option spage for a plugin to the Settings or Security top level menu, it is possible to create a custom top level menu.

A top level menu can be created using the add_menu_page function:

add_menu_page(string $page_title, string $menu_title, string $capability, string $menu_slug, callable $function = '', string $icon_url = '', int $position = null)
Click to show/hide
$page_title (string) (Required) The text to be displayed in the title tags of the page when the menu is selected.

$menu_title (string) (Required) The text to be used for the menu.

$capability (string) (Required) The capability required for this menu to be displayed to the user.

$menu_slug (string) (Required) The slug name to refer to this menu by. Should be unique for this menu page and only include lowercase alphanumeric, dashes, and underscores characters to be compatible with sanitize_key().

$function (callable) (Optional) The function to be called to output the content for this page.
Default value: ''

$icon_url (string) (Optional) The URL to the icon to be used for this menu.

Pass a base64-encoded SVG using a data URI, which will be coloured to match the color scheme. This should begin with 'data:image/svg+xml;base64,'.
Pass the name of a Dashicons helper class to use a font icon, e.g. 'dashicons-chart-pie'.
Pass 'none' to leave div.wp-menu-image empty so an icon can be added via CSS.
Default value: ''

Below is an example of a custom top level menu from my To Twitter plugin:

add_action('admin_menu', 'azrcrv_tt_create_admin_menu');

/**
 * Add to menu.
 *
 * @since 1.0.0
 *
 */
function azrcrv_tt_create_admin_menu(){

    add_menu_page(
				__('To Twitter', 'to-twitter')
				,__('To Twitter','to-twitter')
				,'manage_options'
				,'azrcrv-tt'
				,'azrcrv_tt_display_options'
				,'dashicons-twitter'
				, 50);
				
}

The top level menu automatically has a sublevel menu of the same name added; I’ll show how to rename this in the next post of this series.

To add a custom top level menu to a network admin dashboard, change the admin_menu tag in the add_action function call to network_admin_menu.