141 WordPress PK Admin Menu 0v1 Demo – A Simple Sub Menu (Video)

Part of the “How to Write a WordPress Plugin” series

This Lesson – Overview

In previous lessons we introduced plugins, built a basic working plugin template file structure, created a simple plugin class for our plugins and produced some easy demonstration plugin examples.

This lesson is part of the series covering the WordPress Administration Menus, Panels and Pages.

In this video we will demonstrate the very basics of how to make an Administration Menu by producing a plugin which will add a sub-menu and admin page to the existing WordPress Setting Menu.

Contents

Example PK Admin Menu 0v1

What follows is a simple example of the three steps necessary for the creation a plugin administration menu.

Step 1

• Step 1 in the process is to create a function that contains the menu-building code, my_plugin_menu() in this example. This contains one function, add_options_page() whose purpose is to add a sub menu page to the Settings menu.

The parameters required for the add_options_page() function are:

• a page title (My Plugin Options),
• a menu title, (My Plugin),
• the capability required for this menu (manage_options),
• a unique menu slug name to refer to this menu,
• the function to be called to output the page content for this menu item (my_plugin_menu_options()).

/**
* Add sub-level menu item under the
* Setting top-level-menu
*/
function my_plugin_menu() {
	add_options_page('My Plugin Options',  // Page title
		'My Plugin',  // Menu title
		'manage_options',  // The Capability requirements
		'my-unique-identifier',  // Unique menu slug
		array(&$this, 'my_plugin_menu_options'));  // Function call
}

Step 2

• In step 2 we need to register the above function my_plugin_menu() using the “admin_menu” action hook. Notice this is simply an add_action() interrupt function.

 
/**
* Example: PK Admin Menu 0v1
*/
add_action( 'admin_menu', array(&$this, 'my_plugin_menu'),1 );

Step 3

• With step 3 we create the HTML code for the page to be displayed when the menu item is clicked,my_plugin_menu_options() in this example.
• This output code is just standard HTML.
• One thing to note in this function,before doing anything else, you should always check to see if the user has permission to view this page, hence the first if() statement stating, if current user cannot manage options.
• We don’t actually do anything particularly useful in this example other than state this is where your options form would be placed.

 
/**
* HTML Page containing menu options
*/
function my_plugin_menu_options() {
	// Does the user have the right permissions?
	if (!current_user_can('manage_options')) {
		wp_die( 'Sorry, you do not have permission to access this page.' );
	}
	// User has permission to modify data.
	echo '<div class="wrap">';
	echo '<p>The options form would go here.</p>';
	echo '</div>';
}

This code, when inserted into our plugin class template, will add a sub-level menu item, “My Plugin”, under the WordPress Dashboard Settings top-level menu. When selected the menu item will display our options page which in this instance just contains our little message.

Notice that prior to activation our menu item does not exist! Once our plugin is activated the, My Plugin, menu item is inserted as a sub-menu item into the WordPress Setting top-menu,

and when selected displays our options page.

This is about as simple as it gets. More complicated multi-layer menus can be added, and we will cover them in a later lesson, but, lets face it, a nice simple one page user interface is all that will be required for most occasions.

Practical Exercise (pk-admin-menu-0v1)

OK, lets see how to implement this code using our class template.

Create a New Plugin

To begin we need to use our plugin class template to create a new plugin which we’ll call pk-admin-menu-0v1.

Copy the pk-plugin-class template we created previously to a new folder in the wp-content\plugins folder and rename the folder to pk-admin-menu-0v1 and the file to pk-admin-menu-0v1.PHP. Remember the plugin file name should be the same name as the folder with the PHP extension. Then open the file ready for editing.

Enter a New Plugin Name and Description

The first thing we need to do with our new plugin is enter a new plugin name and description. so that WordPress with recognize the plugin.

• Plugin Name: PK Admin Menu 0v1
• Description: PK Admin Menu Demo 0v1

Enter New Class Name

Enter a more appropriate class name by renaming all occurrences of the pk_plugin_template_class to pk_admin_menu_0v1_class. There are six changes to be made.

Enter New Instance Name

Now that we have our plugin class we need an instance of that class. So change the template instance $pk_plugin_demo to a more appropriate name, $pk_admin_menu_0v1_demo.

Enter Hook

Next, we need to hook our function into WordPress so enter the add_action() hook just after the placeholder comment,

// TODO: Enter Plugin Actions and Filters here

 
add_action('admin_menu', array(&$this, 'my_plugin_menu'),1);

Enter Sub-Level Menu Item

Now enter the sub-level menu function just after the placeholder comment,

// TODO: Enter Action and Filter Methods here

 
/**
* Add sub-level menu item under the
* Setting top-level-menu
*/
function my_plugin_menu() { 
	add_options_page('My Plugin Options',  
		'My Plugin',  
		'manage_options',  
		'my-unique-identifier',  
		array(&$this, 'my_plugin_menu_options')); 
}
 

Enter Html Page Options

and finally enter the function which will actually display the HTML code containing our menu options next.

 
/**
* HTML Page containing menu options
*/
function my_plugin_menu_options() {
	// Does the user have the right permissions?
	if (!current_user_can('manage_options')) {
		wp_die( 'Sorry, you do not have permission to access this page.' );
	}
	// User has permission to modify data.
	echo '<div class="wrap">';
	echo '<p>The options form would go here.</p>';
	echo '</div>';
}

Save the File

With the code entered, lets save the file, and see what happens in WordPress.

Test the Menu – Login to WordPress

Login to WordPress as the administrator and navigate to:

• Dashboard > Plugins > Installed Plugins

to check that our plugin has been recognised but is inactive. Activate the plugin.

Open the Settings menu item, and their at the bottom of the Setting menu is our menu item, My Plugin.

Select the, My Plugin, menu item and our almost blank, PK Demo Plugin, page is show along with our note, “The options form would go here”, displayed.

Well, everything worked as planed, so it time to clean things up and deactivate the plugin ready for the next lesson. With the plugin deactivated, notice that the, My Plugin, menu item is removed from the Settings menu.

Conclusion – Summary

Hopefully this tutorial gave you a good insight into how simple an administration menu can be. I dare say it looks a little daunting at first, but just follow the three steps outlined in the introduction to Administration menus and you should be fine.

I will be expanding on this lesson by adding more complex admin interfaces, saving our data to the WordPress database and taking our Text to Hyperlink tutorial a stage further in the next lessons on Admin menus.

Well, that’s all for this tutorial on Administration menus, see you in the next lesson.

Lesson Code – (pk-admin-menu-0v1)

 
<?php
/*
Plugin Name: PK Admin Menu 0v1
Plugin URI: http://kingsolutions.org.uk/wordpress/wordpress/how-to-write-a-wp-plugin/
Description: PK Admin Menu Demo 0v1
Version: 0.1
Author: Philip King
Author URI: http://kingsolutions.org.uk/wordpress/
Licence: Licence GPL2
*/
/*  Copyright 2011  Philip King  (contact: http://kingsolutions.org.uk/wordpress/)

	This program is free software; you can redistribute it and/or modify
	it under the terms of the GNU General Public License, version 2, as 
	published by the Free Software Foundation.

	This program is distributed in the hope that it will be useful,
	but WITHOUT ANY WARRANTY; without even the implied warranty of
	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
	GNU General Public License for more details.

	You should have received a copy of the GNU General Public License
	along with this program; if not, write to the Free Software
	Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA  02110-1301  USA
*/
/**
* The Plugin Class
*/
if (!class_exists("pk_admin_menu_0v1_class")) {
	class pk_admin_menu_0v1_class {
		// TODO: Variable declarations go here

		// TODO: Constructor
		function __construct() {
			  // TODO: Enter Plugin Actions and Filters here

			  add_action('admin_menu', array(&$this, 'my_plugin_menu'),1);

		} // End constructor

		// Core functions go here
		// TODO: Enter Action and Filter Methods here
		/**
		 * Add sub-level menu item under the
		 * Setting top-level-menu
		 */
		function my_plugin_menu() {
			  add_options_page('My Plugin Options', 
				     'My Plugin', 
				     'manage_options', 
				     'my-unique-identifier', 
				     array(&$this, 'my_plugin_menu_options'));
		}
		/**
		 * HTML Page containing menu options
		 */
		function my_plugin_menu_options() {
			  // Does the user have the right permissions?
			  if (!current_user_can('manage_options')) {
				     wp_die( __('Sorry, you do not have permission to access this page.'));
			  }
			  // User has permission to modify data.
			  echo '<div class="wrap">';
			  echo '<p>The options form would go here.</p>';
			  echo '</div>';
		}
		// TODO: Enter Helper Methods here
	} // End pk_admin_menu_0v1_class
} // End if (!class_exists("pk_admin_menu_0v1_class"))

/**
* Instantiate (create an instance of) the class
*/
if (class_exists("pk_admin_menu_0v1_class")) {
	// TODO: Enter New Instance Name
	$pk_admin_menu_0v1_demo = new pk_admin_menu_0v1_class();
} // End instantiate class
?>

Links Used in This Article