WordPress is a CMS known for its ease of use, versatility and ability to be extended with the use of Plugins. You can create your own plugins to add functionality to your WordPress websites without editing the core files of WordPress.
This article will guide you through the entire process of creating a WordPress plugin from scratch. We shall discuss what you need to build the plugin, the steps you must take and the tools you might use to build WordPress plugins from scratch.
Let’s get started with how to create a WordPress plugin from scratch.
Prerequisites
1. Proficiency with the PHP programming language
2. Knowledge of WordPress plugin architecture and development guidelines
3. Knowledge of JavaScript, CSS, and HTML
4. Understanding of the WordPress system for action and filter hooks
5. Knowledge of WordPress APIs and database architecture
6. A development environment for your plugin’s development, I recommend having this on your computer to save costs and avoid errors that might break up your live WordPress website.
7. A staging environment for your plugin’s development can be local or on a remote server. It’s essential to have a test environment to guarantee that your plugin works as intended and presents no problems on live websites.
8. Optionally, knowledge of version control programs like Git
9. Optionally, the ability to submit plugins to the WordPress.org repository using Subversion (SVN). A solid grasp of SVN is necessary for seamless plugin submissions because WordPress uses it as the version control system for the plugin repository.
Step 1: Plan Your Plugin
Before you start coding, you need to understand what you want to achieve with your plugin. What problem does it solve, and what features do you want to include? This planning stage is crucial as it sets the foundation for the rest of the process. To help you get started, here are some questions you should ask yourself:
- What problem does your plugin solve?
- Who is your target audience?
- What features do you want to include in your plugin?
- What kind of data will your plugin be storing and retrieving?
- What dependencies or plugins shall your plugin require additional resources or functionality from other plugins?
As an example in this tutorial, I plan to build a small WordPress plugin that will display a banner on all pages of the website. I will pretend that InstaWP is carrying out a promotion and take advantage of that to build a plugin that can show a promotion message on all pages of a WordPress website. “Hot Deal. Get 50% off InstaWP Premium. Click here” is the promotion message the plugin will be positioned in the fixed position at the top of the WordPress website. The message will appear in red colour on a white background to stand out.
The above image demonstrates the outcome of the plugin, am going to build for demonstration purposes while breaking down How To Create a WordPress Plugin.
Step 2: Choose a Unique Name for Your Plugin
The next step is to choose a unique name for your plugin. It should be memorable, easy to spell and not already used by another plugin, as the WordPress repository guidelines recommend. You can use a plugin name generator to help you find a suitable name. A Search Engine friendly name is ideal as it will help your plugin to be discoverable by users who might need it.
Personally, I head over to https://wordpress.org/plugins and punch in the desired name. If no plugin is returned with a similar name as I have searched, I go with it. No need to complicate things.
Step 3: Create a Folder for Your Plugin
The next step is to create a folder/folder for your plugin. This folder is where every file about your plugin will be stored.
You can name the folder anything you like, but it should be related to the name of your plugin. This folder will store all the files for your plugin, so it is essential to keep it organised. Commonly the folder names follow the pattern of an acronym, a hyphen in the middle, and finally, the full name. So, for example, the folder name for the plugin “my sample plugin ” might be “msp-my-sample-plugin.”
Follow the steps below to create a folder for my sample plugin in 4 simple steps!
- Set up a WordPress environment on your computer by using LocalWP.
- Navigate to the WordPress folder on your computer.
- While in the WordPress folder, navigate to the “wp-content” folder and then open the “plugins” folder.
- Create a folder and name it “msp-my-sample-plugin”.
Step 4: How To Create a WordPress Plugin File
The first file you need to create in the “msp-my-sample-plugin” folder is the plugin file. WordPress will identify this plugin and use it based on the information you write there. Thiss file must contain information about your plugin, including but not limited to the plugin name, description, author, and version number. The plugin file name can be anything you want but it’s recommended to be named similarly to the plugin folder. The plugin file must be a PHP file because WordPress plugins are developed using the PHP programming language. For example, if the plugin folder name is “msp-my-sample-plugin”, your plugin file can be named “msp-my-sample-plugin.php”. WordPress repository guidelines recommend this to maintain a clear distinction between your plugin and other plugins.
Step 5: Add the Plugin Information
Once you have created your plugin file, now is the right time to add information about the plugin. WordPress will recognise this information and display it in the WordPress plugin repository and the WordPress dashboard. The information should be located at the beginning of the entry file of the plugin file. They’re specified as comments in the entry file like in the example below.
Alt text: The figure above shows an example of the information about your plugin.
Let me break down some of this information.
Plugin Name: This is the human-friendly name of your plugin. It’s important to make it specific, memorable and unique.
Plugin URI: This should be the link to download your plugin.
Description: This describes the solution your plugin offers. It should be precise and Search Engine friendly.
Version: Users need to know the version of your plugin. You need to specify it when building your plugin and whenever you update it.
Author: Specify the name of the plugin developer. Can be a name of an individual or organisation.
Author URI: Specify the link that would take the users to the developer’s website. Sometimes users want to reach you for support and opportunities.
License: Specify the name of the License that governs your plugin.
License URI: Specify the link to the license you specified above.
WordPress has got a comprehensive guide about this click here to learn more.
Step 6: Create the Functionality
Consider adding the code that will make the plugin work. Using PHP programming language, WordPress actions, and hooks will help you create the needed functionality.
Alt text: The picture demonstrates functionality code in the plugin file.
In the code above, I created a PHP function called show_banner. Then added some CSS and HTML that would help me accomplish the goal.
Finally, I used the WordPress add_action hook called wp_head to attach this show_banner function to WordPress.
The code you write will depend on the functionality you want your plugin to offer.
Step 7: Register Activation and Deactivation Hooks
Do you want something to happen when your plugin gets activated and deactivated? The recommended solution is to implement the activation and deactivation hooks.
In my case, I want to know when my plugin is activated and when it’s deactivated, so that I can estimate the number of WordPress websites using my plugin against those that are deactivated.
So I could implement an activation hook to make an API request whenever the plugin is activated and deactivated. (1) The code in the activation hook will make a call to my external API and submit the information about the plugin activation.
(2) Whereas the code in the deactivation hook will make a call to my external API and submit information about the plugin deactivation.
The use cases, for activation and deactivation hooks, are endless. To learn more about WordPress actions and hooks with sample code click here.
Step 8: Test Your Plugin
Before you release your plugin, you need to thoroughly test it. It would be best if you tried it on different versions of WordPress and on different themes to ensure that it works as expected. You should also test it with other plugins to ensure that it does not cause any conflicts.
Talking of testing the plugin, InstaWP is my go-to for a test/staging environment because it’s FREE, instant and reliable. InstaWP enables me to spin up any version of WordPress in less than two minutes to have an environment that will be accessible to others so that they see what am working on in real-time.
How to set up a staging environment on InstaWP for FREE.
- Head over to instawp.com
- Get a FREE account or log in. It takes less than a minute.
- Set up a WordPress site in your instawp.com account. Let me show you how to set up a WordPress website on InstaWP in 3 steps.
- Once you login successfully, Click Sites on the menu.
- Then click +New site button in the middle of the Sites web page. Alternatively click Add New + button at the top right of the Sites web page.
Choose the desired settings for your site. The choices you have include Selecting configuration, WordPress version, and Plugin version. Then confirm by clicking Create Site at the lower right.
That’s it. Next up pick the login information and log in to your new WordPress site. Personally, I click the magic link because why not?
- Once logged in to the WordPress dashboard, you will need to upload the plugin files that you created from your local computer to this staging website.
To do this, go to “Plugins” click “Add Plugin” then click “Upload Plugin” and select the zip file of the plugin from your developer computer. Once done you will see your plugins under “Installed Plugins”. Make sure you activate the plugin and then visit the site.
If you want to change anything or add something to your plugin, InstaWP code editor has got you covered. Some people would prefer to use the plugin editor that comes in WordPress but guess what, any bug you make in code will get you locked out.
How to open the code editor in InstaWP
- Click sites to display a list of all the sites you have in your InstaWP account.
- Hover over the title of the website you want to open in the code editor.
- Click Code Editor at the bottom right on the pop-up window.
- To save changes, you should click the File menu on the Code Editor and click Save, in order to save the changes you make to the code.
Step 9: Release Your Plugin
Once you have tested your plugin and are confident it works as expected, you can release it. You can submit it on the WordPress plugin repository or upload it on your website. When submitting your plugin to the WordPress repository, follow their guidelines and submit your plugin for review. If it is approved, it will be available for anyone to download and use.
If you release your plugin on your website, you can make the plugin file available for download. You should also provide documentation and support for your plugin and regular updates to fix bugs and add new features. For information on how to submit your plugin to WordPress, click here
Conclusion.
Creating a WordPress plugin can be a fun and rewarding experience. It allows you to extend the functionality of WordPress and add unique features to your website. Following the steps outlined in this article, you can create a plugin from scratch and make it available to others. Just remember to plan your plugin, test it thoroughly, and provide documentation and support for users.
Let’s recap the steps we’ve done.
- Plan Your Plugin
- Choose a Unique Name for Your Plugin
- Create a Folder for Your Plugin
- Create a Plugin File
- Add the Plugin Information
- Register Activation and Deactivation Hooks
- Test Your Plugin on the live InstaWP Staging site.
- Release Your Plugin
Now you can create that plugin you always wanted to build.