Building a WordPress Plugin from scratch

Home / Tutorials / Core / Building a WordPress Plugin from scratch

Building a WordPress Plugin from scratch

This tutorial is a guided tour on how to create a WordPress Plugin from scratch. If you are used to using plugins but not creating them, this post will teach you the basics of how a plugin is constructed.

What is a Plugin?

Firstly, what exactly is a Plugin? According to Codex ( the official WordPress online manual )

Plugins are ways to extend and add to the functionality that already exists in WordPress.”

So what does this mean? Plugins are essentially methods to add more or enhance the capabilities to WordPress sites and applications. In this tutorial, I am going to walk you through the creation of a very basic plugin.

How to create a Plugin?

This post won’t explain how to use PHP or go into detail about the WordPress architecture but will cover the basics to develop your first plugin.

Plugins reside in a folder called Plugins in the wp-content folder of any WordPress installation. These plugins can be single PHP files to folders with 100’s of files and subfolders. The first step to creating a plugin is creating a file. For this tutorial, we are going to create a plugin adding an image to the bottom of each post and we will call it “Post Banner”.

In the plugin folder, create a folder called <strong>post-banner</strong> and within it create a file called <strong>post-banner.php</strong>. Within this file we are going to add the Plugin Header a.k.a Plugin Information. Here will add the plugin a name and optionally add other other information about the plugin. See an example of a plugin header below.

 

Each line tells a bit of information about the plugin.

Plugin Name – Gives the plugin the searchable title in the Plugin Administrative Section

Plugin URI – A link to where someone can find more information about the plugin such as support, detailed description, instructions or how to download.

Description – An excerpt of that describes the plugin and what it does once installed.

Version – This is a way of monitoring which release of the plugin this is. As you make changes to your plugin, you can change the version and create what is called a changelog to describe the changes made in each version.

Author – The name of the person or company that is creating the plugin

Author URI – The url to learn more about the author

License – This defines the usage of the plugin. WordPress is licensed under GPL and it is recommended that plugins especially those that are going to be added to the repository be licensed under GPL.

To learn more about GPL licensing click here

Now, let’s update our plugin file with our information

Once complete, let’s go to the plugin administrative panel, check out our new plugin and activate it.

Creating a shortcode

According to the Codex, shortcodes  “have been introduced for creating macros to be used in a post’s content.“. These shortcodes can be used for multiple purposes in posts and in our tutorial, we will use it to display a banner. Our shortcode will be the following [post_banner] and to add an image, it will look like this [post_banner image_url=”http://mypluginlab.com/image.jpg”]. So, let’s begin by opening up our plugin file adding the following

The first paramater in this function is the tag that we will use to call our shortcode in our post. The second paramater is the callback function that will make the shortcode work. Below our previous snippet, add the call back function as shown below

The first parameter of the function is an array of the attributes used in the shortcode for example image in [post_banner image_url=”http://mypluginlab.com/image.jpg”]. The second parameter is the post content.

Now, we will improve the function to make it work.

Full Code

Shortcode Used in Post
Shortcode Used in Post

Resources to learn more

In a WordPress post try your new shortcode out with an image url.

Shortcode Preview
Shortcode Preview

Resources to learn more

If all is working well, here’s a test for you. Try linking your banner image and post it in the comments.

Recommended Posts
Contact Us

We're not around right now. But you can send us an email and we'll get back to you, asap.

Not readable? Change text. captcha txt

Start typing and press Enter to search