This tutorial is for extreme beginners who are not familiar with WordPress plugin development. If you have some knowledge on developing WordPress plugin you should check our other advanced tutorial on it.

First you should understand what WordPress plugin is and why you need to develop a plugin?

In simple word plugin is set of code to extend WordPress default functionality. Think about a custom feature like you need to send an email to the admin whenever a new post is published. WordPress doesn’t have default option for it. So, either you need to find out a suitable plugin for it from WordPress plugin repository or you need to develop yourself. It’s always good practice to do a search in WordPress plugin repository before investing your time on developing it. It could save your valuable time as there are already lots of plugin available in the repository.

For more startup materials you can check WordPress codex http://codex.wordpress.org/Writing_a_Plugin

Here we will create a simple plugin to take text input and show it at front end.

First you need to choose a unique name for your plugin. For example I will use ‘Wpc Hello World’ for this tutorial.

Now create a PHP file and name it according to your plugin name. Here I will name it as ‘wpc-hello-world.php’. It will be your main plugin file. You should always try to make your plugin files name and functions name as unique as possible. Otherwise it may conflict with other plugins, themes or WordPress functions. It’s good practice to add prefix like first few digit of your name or company name to your file name and function name.

Now you need to put standard plugin header information into the top of your main PHP file. WordPress will recognize your plugin by this header information and add it to the plugin management screen. This header is important and without it your plugin will never be activated and will never run.Here is the standard header information format

<?php
	/*
		Plugin Name: WPC Hello World
		Plugin URI: www.wpcue.com
		Description: A simple hello world plugin for beginners.
		Version: 1.0
		Author: Wpcue
		Author URI: www.wpcue.com
		License: GPL2
	*/
?>

Now, create a directory according to your plugin name at WordPress plugins directory and put your main PHP file into the directory. I will name it as ‘wpc-hello-world’. Here is a screenshot of the plugin directory of my localhost.

WPC Hello World directory structure

Go to admin panel plugins management screen and you will see your newly created plugin. It should look like the following screenshot.

Plugins management screen

Now we will add a menu tab for our newly created plugin. First create another PHP file for managing menu page content. I will name it as ‘wpc-hw-admin.php’. Then put the following code into your main plugin file (wpc-hello-world.php).

<?php
	function wpcHelloWorldMenu(){
        add_menu_page( 'A hello world plugin for beginners', 'HelloWorld', 'manage_options', 'wpchw', 'wpchwAdmin' );
    }
 
    add_action('admin_menu','wpcHelloWorldMenu');
 
    function wpchwAdmin(){
        include_once('wpc-hw-admin.php');
    }
?>

Now, activate your plugin from plugin management screen and you will see the menu tab like the following screenshot.

Plugin menu tab

Let’s discuss what I did here. First, I create a custom function for the menu then I call WordPress function ‘add_menu_page’ to create the menu tab. WordPress doesn’t recognize custom function automatically. So, I need to hook-up my function with WordPress. For that I use ‘add_action’ function, which will hook my custom function with WordPress ‘admin_menu’ action. So, whenever WordPress run menu action my custom function will also run. To know more about Hooks, Actions and Filters check this link http://codex.wordpress.org/Plugin_API

Now, I am describing briefly about the parameters used for ‘add_menu_page’ function.

  • First parameter is for the page title.
  • Second parameter is for the menu tab name.
  • Third parameter is for the minimum capability need to access the plugin. Capability is a broad topics and it’s not possible to cover it here in details. You can check WordPress codex to know more about it here http://codex.wordpress.org/Roles_and_Capabilities.In simple word to access your plugin a user need to have the specified capability. If you use ‘manage_options’ capability then only an administrator user can access your plugin. If you want to allow your plugin for all users then use ‘read’ capability.
  • Fourth parameter is used for menu slug.
  • Last parameter is a function name which is used to show page content.

Put the following code into your admin file ‘wpc-hw-admin.php’.

<?php
    global $chk;
    if(isset($_POST['wpc-hw-submit'])){
        global $chk;
        if( get_option('hellow-world') != trim($_POST['hellow-world'])){
            $chk = update_option( 'hellow-world', trim($_POST['hellow-world']));
        }
    }
?>
<div class="wrap">
  <h2>WPC Hello World</h2>
  <?php if(isset($_POST['wpc-hw-submit']) && $chk):?>
  <div id="message" class="updated below-h2">
    <p>Content updated successfully</p>
  </div>
  <?php endif;?>
  <div class="metabox-holder">
    <div class="postbox">
      <h3><strong>Hello World Option</strong></h3>
      <form method="post" action="">
        <table class="form-table">
          <tr>
            <td><input type="text" name="hellow-world" value="<?php if(get_option('hellow-world')){echo get_option('hellow-world');}?>" style="width:350px;" placeholder="Enter some text here" /></td>
          </tr>
          <tr>
            <td style="padding-top:10px;  padding-bottom:10px;"><input type="submit" name="wpc-hw-submit" value="Save changes" class="button-primary" /></td>
          </tr>
        </table>
      </form>
    </div>
  </div>
</div>

Click the menu tab ‘HelloWorld’. It should look like the following screenshot.

WPC Hello World Admin page

Now I will create a simple function and shortcode to show the text in a page or post. Add the following code into main plugin PHP file (wpc-hello-world.php).

<?php
	function wpcShowText(){
		echo get_option('hellow-world');
	}
	 
	function wpcGetText() {
		return get_option('hellow-world');
	}
	 
	add_shortcode('wpc-text', 'wpcGetText');
?>

You can use the shortcode [wpc-text] in page or post to show your hello world text. Also you can use function wpcGetText() at your PHP template file.

Leave a Comment

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>