WordPress Plugin Development: When And How

Plugins represent an essential and major component of any WordPress site. As of early October 2019, there are a whopping 54,775 plugins in the WordPress repository. Plenty to last you a lifetime! As a developer, you’ll eventually have to write one yourself, whether it be for a client, your company or personal usage. However, WordPress plugin development isn’t an easy thing to do or else you wouldn’t have an entire handbook dedicated to it, right? ๐Ÿ˜‰ If you’re just starting out with, you’re at the right place! The goal of this article is to help you understand when to create a plugin. On top of that, I’ll show you how to start coding your first plugin, too!

Plugins explained

Before we move on though, let me first explain what a plugin exactly is. In simple terms, it’s a bundle of code that extends WordPress’ core functionality. They’re written in PHP and may include other assets such as images, CSS, and JavaScript. This also means that your plugin may feature an interface on the backend or even on the front end. ๐Ÿ‘€ Next to that, a plugin’s primary way to interact with your website is through WordPress hooks. As an example, imagine a user signing up on your site. This would trigger a hook which a plugin could act on, e.g. sending out a welcome email to the new user.

Now that we’ve got that out of the way, it’s time to discuss what actually belongs in a plugin.

When to create a plugin

Plugins are always juxtaposed with WordPress themes and that’s for a good reason: they both serve the purpose of extending WordPress. Therefore, understanding how both tools differ in their functionality will allow you to more easily understand when to use what… So what is the difference? Oh, if only I kn- Just kidding! ๐Ÿ˜ฌ

It’s simple really: a theme is mostly concerned with the front-end visuals (e.g. templates) of a website while a plugin is mostly responsible for the logic (e.g. sending out emails). A beautiful analogy is that of a car. ๐Ÿš— Its exterior would represent the WordPress theme while the engine and other functionalities such as the AC would be the plugin.

By keeping the visuals and the logic of a site separate, a website can change its WordPress theme as often as it wants and still behave the same. However, if changing a theme gets rid of some functionality that you were hoping to use in another theme, guess what! It should have been included in a plugin. ๐Ÿ”Œ

Et voilร ! That’s the most simple guideline you need to know to get started with plugins! If in doubt though, ask bouncer cat. ๐Ÿˆ

Cat bouncer meme with an overweight cat sitting in front of a door. The text on the meme says "Sorry Mate, can't let that code in". which refers to WordPress plugin development.
Deciding what to include in a plugin…

Blurring the lines

Well, as usual there’s always an exception to the rule. Did you pay attention earlier and notice that I said mostly in both cases? There are definitely times when a plugin can be responsible for the visuals, whether it be for a single component or an entire page.

For example, the former would concern widgets and shortcodes which you can place throughout your website. And on the other extreme, the most obvious offenders to this rule would be page builders like Elementor and Beaver Builder. I mean, look at them! ๐Ÿคฃ However, the point I’m trying to get across isn’t that you should never include visual elements in your plugin.

Actually, there’s nothing wrong with using components like widgets that only make up a fraction of any given page. However, going beyond that you will quickly realize that in terms of design, the plugin you’re using isn’t always compatible with your theme. Let’s hope it’s easy to customize if that’s the case… ๐Ÿ˜ฌ

How To Create A Plugin

Alright! It’s time to get a bit technical… ๐Ÿ˜Ž Writing a plugin can be as easy as you’d like it to be, but also way more difficult and convoluted if needed. Although, in this section I won’t be showing you how to create the next page builder or booking system, because that would be ridiculous. Instead, I’ll show you how to generate a shortcode that will render some piece of text. Easy peasy!

GIF of a man typing on a computer with his feet. This GIF refers to WordPress plugin development.
You might require some foot dexterity… ๐Ÿฆถ

Creating the most basic plugin doesn’t take much work. All that is needed is a plugin header comment, which contains information about… say it with me… your plugin! Although, before we get to that, we first need to create a plugin folder where all our files can live. So head over to your website folder and access wp-content/plugins. Here, you got to create your directory and name it after your plugin. How about the-shortcodinator? (Get to da choppa! ๐Ÿš)

Defining plugin information

Inside the folder, create a PHP file named exactly as the directory. In our case, the-shortcodinator.php. This step is important, because it will tell WordPress which file to look at first. And it’s in this file where we can write the plugin header comment, i.e. metadata about the plugin.

<?php
/**
 * Plugin Name: The Shortcodinator 
 */

Plugin Name is the only required field for your header. However, there are a bunch of other headers worth considering, such as Plugin URI, Description and Author. If you’ve previously created a WordPress theme, this will all look very familiar to you. ๐Ÿ˜‰ After completing this step, your plugin should now be visible in the plugin section of your site’s admin panel.

Creating the shortcode

As I mentioned earlier, the most common way a plugin can interact with WordPress is through hooks. However, in the case of shortcodes, this isn’t necessary.

function the_shortcodinator_generate_text() {
  return "<p>I will be back</p>";
}

add_shortcode("the-shortcodinator-says", "the_shortcodinator_generate_text" );

To add a shortcode, we need to use the add_shortcode function which takes two arguments: the tag (i.e. name) of your shortcode and a callback function. In my case, I’ve named the shortcode the-shortcodinator-says, which will trigger a function called the_shortcodinator_generate_text. In turn, the function will return, NOT ๐Ÿšซ echo or print, some text.

Furthermore, in order to avoid any name clashes with other plugin functions, it’s best practice to prefix your functions with a unique identifier, such as the plugin name. So instead of writing generate_text(), we name it the_shortcodinator_generate_text().

And there we go! Insert your shortcode on a page with [the-shortcodinator-says] and the piece of text will appear. If would like to insert the shortcode in a PHP template, you can do so via the do_shortcode() function.

Security

Woah there cowboy! Before I let you venture on with your own WordPress plugin development, let’s take a step back and talk about WordPress plugin security. Yes, this isn’t a very sexy ๐Ÿคข topic to talk about. But hey, better safe than sorry.

If you’ve followed the same steps so far as seen in this article, you’ll be able to access your plugin in your browser with the URL wordpress-site.com/wp-content/plugins/the-shortcodinator/. We DO NOT want that! ๐Ÿ˜จ This let’s any malicious actor get easy access to our beloved WordPress plugin directly.

We have two ways to prevent this. The first one being an empty index.php file in the root of your plugin folder.

<?php
// Silence is golden

By having this, anyone visiting this link will be greeted by a blank page. A nice and dirty ๐Ÿ˜ trick which is actually used quite a lot in WordPress, if you pay attention.

However, this still won’t prevent someone from accessing a file. If the hacker is as clever as we are, he’ll know that there’s a file named after the plugin folder. In other words, he could access the following link: wordpress-site.com/wp-content/plugins/the-shortcodinator/the-shortcodinator.php. To prevent this, we have to add some code to our file.

// the-shortcodinator.php

if ( ! defined("ABSPATH") ) {
  die("Get off my property!");
}

With this piece of code were telling that if the variable ABSPATH is not defined, die! ๐Ÿ’€ Exit the bloody script! For those of you who aren’t aware of ABSPATH, it’s essentially a variable defined by WordPress during run time. However, by accessing the plugin directly and not through WordPress, it isn’t defined. Hence, the plugin script will stop after reading these 3 lines of code.

And there you go! Now no one can hack into your plugin!

Scooby-Doo scene where Fred unveils who is behind a ghost. The text on the meme says "And I would've gotten away with it if it weren't for you meddling developers!", which refers to WordPress plugin development security.

Did you find what you came for? Want me to cover something else? Let me know in the comments below! Share, if you liked this post!

Leave a Comment

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