Creating menus and submenus in wordpress


Adding a Menu Item to an Existing Menu

WordPress features many different functions to add submenus to the existing default menus in WordPress. One of these functions is the add_options_page()function. Now explore how the add_options_page() function works to add a submenu item to the Settings menu.

   <?php add_options_page( page_title, menu_title, capability, menu_slug, function);?>

The add_options_page() function accepts the following parameters:

➤ page_title — The title of the page as shown in the tags

➤ menu_title — The name of your submenu displayed on the dashboard

➤ capability — Minimum capability required to view the submenu

➤ menu_slug — Slug name to refer to the submenu; should be a unique name

➤ function — Function to be called to display the page content for the item

Now add a submenu item to the Settings menu:

<?php
add_action('admin_menu', 'hello_world_admin_menu');

function hello_world_admin_menu() {
       add_options_page('Hello World', 'Hello World', 'administrator',
		'hello-world', 'hello_world_html_page');
}
?>

Following is a list of all available submenu functions in WordPress.

➤ add_dashboard_page — Adds a submenu to the Dashboard menu

➤ add_posts_page — Adds a submenu to the Posts menu

➤ add_media_page — Adds a submenu to the Media menu

➤ add_links_page — Adds a submenu to the Links menu

➤ add_pages_page — Adds a submenu to the Pages menu

➤ add_comments_page — Adds a submenu to the Comments page

➤ add_theme_page — Adds a submenu to the Appearance menu

➤ add_plugins_page — Adds a submenu to the Plugins menu

➤ add_users_page — Adds a submenu to the Users menu

➤ add_management_page — Adds a submenu to the Tools menu

➤ add_options_page — Adds a submenu to the Settings menu

Creating a Top-Level Menu

The first menu method for your plugin to explore in WordPress is a new top -level menu, which is added to the admin dashboard menu list. For example, Settings is a top-evel menu. A top-level menu is common practice for any plugin that needs multiple option pages. To register a top-level menu, you use the add_menu_page() function.

    <?php add_menu_page( page_title, menu_title, capability, menu_slug, function,
             icon_url, position ); ?>

The add_menu_page() function accepts the following parameters:

➤ page_title — The title of the page as shown in the tags

➤ menu_title — The name of your menu displayed on the dashboard

➤ capability — Minimum capability required to view the menu

➤ menu_slug — Slug name to refer to the menu; should be a unique name

➤ function: Function to be called to display the page content for the item

➤ icon_url — URL to a custom image to use as the Menu icon

➤ position — Location in the menu order where it should appear

Now create a new menu for your plugin to see the menu process in action. Use the admin_menu action hook to trigger your menu code. This is the appropriate hook to use whenever you create menus and submenus in your plugins.

  
 <?php
    add_action( ‘admin_menu’, ‘menuexample_create_menu’ );
    function menuexample_create_menu() {
        //create custom top-level menu
        add_menu_page( ‘My Plugin Settings Page’, ‘Menu Example Settings’,
             ‘manage_options’, __FILE__, ‘menuexample_settings_page’,
             plugins_url( ‘/images/wp-icon.png’, __FILE__ ) );
    }
    ?>

Adding a Submenu

Now that you have a new top-level menu created, create some submenus for it, which are menu items listed below your top-level menu. For example, Settings is a top-level menu whereas General,listed below Settings, is a submenu of the Settings menu. To register a submenu, use the add_submenu_page() function.

   <?php add_submenu_page( parent_slug, page_title, menu_title, capability,
              menu_slug, function ); ?>

The add_submenu_page() function accepts the following parameters:

➤ parent_slug: Slug name for the parent menu (menu_slug previously defi ned)

➤ page_title: The title of the page as shown in the tags

➤ menu_title: The name of your submenu displayed on the dashboard

➤ capability: Minimum capability required to view the submenu

➤ menu_slug: Slug name to refer to the submenu; should be a unique name

➤ function: Function to be called to display the page content for the item

<?php
add_action( ‘admin_menu’, ‘menuexample_create_menu’ );
function menuexample_create_menu() {

    //create custom top-level menu
    add_menu_page( ‘My Plugin Settings Page’, ‘Menu Example Settings’,
        ‘manage_options’, __FILE__, ‘menuexample_settings_page’,
        plugins_url( ‘/images/wp-icon.png’, __FILE__ ) );

    //create submenu items
    add_submenu_page( __FILE__, ‘About My Plugin’, ‘About’, ‘manage_options’,
        __FILE__.’_about’, menuexample_about_page );
    add_submenu_page( __FILE__, ‘Help with My Plugin’, ‘Help’, ‘manage_options’,
        __FILE__.’_help’, menuexample_help_page );
    add_submenu_page( __FILE__, ‘Uninstall My Plugin’, ‘Uninstall’, ‘manage_options’,
        __FILE__.’_uninstall’, menuexample_uninstall_page );
}
?>


The preceding code creates three submenus for your custom top-level menu: About, Help, and Uninstall, as shown in Figure. Each of these submenu items link to a different custom function that can contain any code you want to use for that submenu page.

About these ads

One Response to “Creating menus and submenus in wordpress”

  1. Farhan Fayyaz Says:

    Submenu Tree provides a method for structuring content hierarchically. For content, which has a menu link, Submenu Tree displays a list of content, which is at the same level or below the content in the menu.

    http://www.handycss.com/css-menus/creating-menu-with-sub-menu-below/


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: