Posted on Sunday 23rd of December 2007 at 17:22 in Tutorials

How to write a Wordpress plugin: episode 1 - getting started

Wordpress is amazing, let's get that out of the way. While I don't use it for this website I do use it for a couple of other things and it's just an incredible project - but what makes it incredible? It's the variety and depth of plugins that are available. So I'm going to be writing a series of tutorials on "how to make a Wordpress plugin". Welcome to episode one.

Wordpress plugins are the single best way of integrating new functionality into a Wordpress install. You write the plugin, upload it to your site and activate it. If you grow tired of it, you de-activate it - it really is that simple. There are hundreds of great plugins already available but it's always handy to know how to write one yourself, so here we go.

Episode 1: Making a very simple plugin and getting it recognised
The first step is to actually create your plugin and get it recognised within Wordpress before trying to include any functionality. So in this episode we're going to create a very basic plugin that doesn't actually do anything and install it.

#1 - Headers are important
Wordpress needs quite a strict setup in the head of the PHP file to identify the attributes of your plugin, so I'll show you how mine looks: /* Plugin Name: Seopher.com Demonstration Plugin Plugin URI: http://www.seopher.com Description: This is just a demonstration plugin to show how you build one Author: Steven York of Seopher.com Version: 0.1 Author URI: http://www.seopher.com */ "Plugin Name", "Author" and "Description" are rather self explanatory. "Plugin URI" is a direct link to the project page for this plugin, where users can visit for updates, support etc. The version is a number you wish to assign to the release, so version it however you like. "Author URI" is your website. In this instance the "Author URI" and "Plugin URI" are the same because this is only a demonstration plugin rather than a dedicated project.

#2 - Plugin content
I then wrote a function to initialise the plugin, this is called later to write some content onto the specific plugin configuration page (under "Options", where you see all the other plugin config pages). All this function does at the moment is return some HTML as a token gesture to show that we've actually got something working. The "wrap" div is significant because that is a Wordpress wide constant, placing all your content into a suitably styled container. function initDemoPlugin() { ?> <div class="wrap"> <h2>Seopher.com demonstration plugin</h2> This is just some sample content to show that we've got control over the content of this page. Rawr! </div> <?php } #3 - Add the plugin to the submenu
This step involves writing a function to add the plugin into the "Options" sub-menu so that when it is activated you have somewhere to visit to configure the settings. See the code below: function addPluginToSubmenu() { add_submenu_page('options-general.php', 'Seopher demo plugin page', 'Seopher demo plugin', 10, __FILE__, 'initDemoPlugin'); } add_action('admin_menu', 'addPluginToSubmenu'); All we're doing is tying into the "add_submenu_page" function, where we're passing several parameters. Firstly we're specifying the parent page (in this case options-general.php) that the sub-menu page will sit under. The second parameter is the page title for the new page (as seen in the browser's title bar). The third param is what appears in the sub-menu navigation. The next parameter is the priority of this function which can just be left at 10 for now. The final param is the function that is called to populate the page, in this case it's the function we created in step #2.

Finally we use the Wordpress function "add_action" to call the function we've just written, simple!

#4 - Upload the PHP file
So if you compile all the code we've shown so far (or download my version here) into a PHP file, you can then upload it to the Wordpress install. Upload the PHP file to "/wp-content/plugins/" and you're done.

#5 - Activate the plugin!
Log into your Wordpress install and visit the "Plugins" tab and you should see something similar to the picture below:



That's your plugin! Click "activate" on the right hand side and it's now active!

#6 - Visit the config
Click "Options" and you should see our plugin added to the sub-menu as per the screenshot below:



Clicking on that takes you to our plugin configuration page. All this page does is output the return of our initDemoPlugin() function that we wrote in #2. So clicking on "Seopher demo plugin" takes us to this page:



So there you have it, 6 steps to creating a dummy Wordpress plugin. In episode two I'll start going through how we start integrating functionality into the plugin and we can start making something useful. I hope this was useful, check back soon for updates.

 

Enjoy this article? Why not subscribe to the full RSS feed?