Log in

Sign in with your email address and password:

No account? Sign up here.
Forgot your password? Reset it here.
Didn't receive account confirmation email? Request a new one.

WordPress Plugin Development Tutorial – Part 3

Welcome to Part 3 of this WordPress Plugin development tutorial series. In Part 2 we learnt how to successfully create a WordPress plugin settings page (and in Part 1 how to set up a WordPress plugin)Now we need to make our plugin do what it is intended to. In this case, we want the Content Enhancer, to display user-specified HTML code at the top and bottom of our posts (we shall get onto the merge fields functionality later…let’s take baby steps first 🙂 ).

Filter & Action Hooks

Before we delve into how we will make our plugin do something useful, we need to first visit the concept of a hook. As the name suggests, a hook allows us to ‘hook’ into WordPress’s core functionality: it allows specific functions to be called during the WordPress process, giving you control over how WordPress functions and displays output.

Hooks form the primary vehicle for plugins (and themes) to interact with content inside WordPress.

A hook is simply a ‘schedule’ of a custom-defined function call. There are two types of hooks – actions and filters. Action hooks are triggered by events in WordPress, for example when a post is published, the ‘publish_post’ action is triggered. Any functions registered to this trigger, will get executed on this event (See complete action hooks reference).

Filter hooks come in when content needs to be filtered before displaying it to the user (note that no content is actually altered in the database with filter hooks). We will use a filter hook to register our main processing function for the Content Enhancer plugin. Lets go ahead and add the following to our content-enhancer.php file:

As we see from the above, we are registering our function content_enhancer_process_content($content) to the filter trigger ‘the_content’. This tells WordPress to call our user-defined function, during the post content retrieve process (but before it is actually displayed), giving us an opportunity to change the content before being displayed to the reader. Neat, right?!

Content Enhancer Plugin Output

When we now visit our blog page, we can see the custom-defined HTML has been added to the top and bottom of our blog’s content!



Our output is displayed exactly as we wanted it, hooray!

As you can see, creating  a WordPress plugin is not rocket science and anyone with basic PHP skills can create a powerful WordPress plugin. I hope you’ve learnt something in this tutorial series. The complete source code for this plugin is available here.

Be sure to check out part 4 where we will look at how to add in merge fields for our Content Enhancer (storing plugin options as arrays), and other slightly more advanced plugin development concepts.

Please leave a comment below if you’ve found this article handy or you have any questions.

Submit a Comment