How to Create a WordPress Plugin
I recommend building a WordPress plugin instead of code in your functions.php
file.
This is because the code in your functions.php
will disappear as soon as you change the theme!
Instead, you can move this code to a plugin which will allow you to change the theme without breaking your site. In this tutorial, we will cover how to create a WordPress plugin.
It is easier then you might think.
We will cover:
Let's get started!
What Are WordPress Plugins?
WordPress plugins allow you to make changes to your WordPress site in a safe way. Instead of making code changes to the theme, you can create a plugin to add or change your site.
WordPress plugins are a bit like lego bricks that you can click on to your site and give it some new features.
There are over 56 thousand plugins to choose from in the WordPress plugins directory.
Chances are if you can think of a WordPress plugin to build there is already one available. Yet, sometimes you have no choice but to build your own.
Why would you want to create a plugin?
There are two main reasons why you would want to create a plugin.
The first is that you would like to create a plugin to sell. For example, many SEO plugins are offering a premium upgrade.
WordPress developers can make good money from selling their plugins.
The second reason is to add functionality to your site without changing the theme.
It is always best to work with an example, let's look at enhancing the default search bar on your site.
Improving the Search Bar
The default search box on WordPress is a single box with a search button.
We are going to improve this by allowing the user to filter the search results by category. The result is going to look something like this:
Now you can filter the search result by selecting “Action” or “Romantic Comedy”.
First, let's look at making the change in functions.php
. Then we can look at how we can move the code to a plugin.
To edit the functions.php
file you need to open the WordPress Admin area. Then visit Appearance->Theme Editor.
For the WordPress theme Twenty Seventeen the functions.php
file is 700 lines long. You can scroll to the bottom of this file and add your code to the end.
The function we need to add looks like this:
function pagedart_advanced_search( $form ) {
$args = array(
'hide_empty'=> 1,
'orderby' => 'name',
'order' => 'ASC'
);
$categories = get_categories($args);
$form = '
<form id="search" action="' . home_url( '/' ) . '" method="get">
<input id="s" name="s" type="text" value="' . get_search_query() . '" />
<h2 class="widget-title">Filter</h2>';
foreach($categories as $category) {
$form .= '
<label for="'.$category->slug.'">
<input type="radio" id="'.$category->slug.'" name="category_name" value="'.$category->slug.'">'
.$category->name.
'</label>';
}
$form .= '
<br>
<button>Search</button>
</form>';
return $form;
}
add_filter( 'get_search_form', 'pagedart_advanced_search' );
Don't worry too much about the code. The main takeaway is that we are returning a new form to the ‘get_search_form’ request.
Save the functions.php
file and look at your site. You can now see that your categories are visible.
Our new search bar is live on the site and everything is great.
Except, what happens if one day you decide to change the theme. Completely forgetting all the changes that you made to functions.php
. As soon as you change themes all these changes are gone!
With a little extra work, you can create your plugin. The plugin will work with any theme you add and will not break your site if you decide to change the design.
Next, let's look at what makes up a WordPress plugin.
Create your first plugin
Now that we have a working search bar in the functions.php
file we can move this to a plugin.
All you need to create a plugin is a single file.
Start by creating a folder on your computer. For this example let's call this folder “search-bar-plugin”.
Now go into that folder and create a single file called search-bar-plugin.php
.
Open this file in a text editor (I recommend VSCode) and then copy this text into the file:
<?php
/*
Plugin Name: PageDart
Plugin URI: https://pagedart.com
Description: Add advanced search to your WordPress site
Version: 1.0
Author: Steve
Author URI: https://pagedart.com
License: MIT
*/
?>
You can change the name and URI links to your own.
Now save the file.
Congratulations! You have created your first plugin!
The plugin does very little. Let's add the code to change the search bar. Copy the function that we added earlier. Add this below the plugin information in the search-bar-plugin.php
file. Don't forget to remove the function from your functions.php
.
Your search-bar-plugin.php
file should now look like this:
<?php
/*
Plugin Name: PageDart
Plugin URI: https://pagedart.com
Description: Add advanced search to your WordPress site
Version: 1.0
Author: Steve
Author URI: https://pagedart.com
License: MIT
*/
function pagedart_advanced_search( $form ) {
$args = array(
'hide_empty'=> 1,
'orderby' => 'name',
'order' => 'ASC'
);
$categories = get_categories($args);
$form = '
<form id="search" action="' . home_url( '/' ) . '" method="get">
<input id="s" name="s" type="text" value="' . get_search_query() . '" />
<h2 class="widget-title">Filter</h2>';
foreach($categories as $category) {
$form .= '
<label for="'.$category->slug.'">
<input type="radio" id="'.$category->slug.'" name="category_name" value="'.$category->slug.'">'
.$category->name.
'</label>';
}
$form .= '
<br>
<button>Search</button>
</form>';
return $form;
}
add_filter( 'get_search_form', 'pagedart_advanced_search' );
?>
The plugin is ready to add to your site and the next step is to upload it to WordPress.
Before you install the plugin make sure that you do a backup of your WordPress site. I always do a backup before a plugin installation in case something goes wrong!
To add your plugin to WordPress you need to select your “search-bar-plugin” folder. Then compress it to a zip file.
Then go to your WordPress admin panel and go to Plugins->Add New.
At the top of the screen you will see an “Upload Plugin” button, click on this and you then upload the zip file.
Click on “choose file” and select the zip file you created.
You will now be able to press the “Install Now” button.
If all has gone well you can see the message “Plugin installed successfully.” with an “Activate Plugin” button.
Click the activate plugin button and you will see your plugin in the plugin list.
Congratulations!
You will now see the plugin in the list along with the information that you entered in the PHP file earlier.
That is all there is to it the plugin is now installed! You have created your first plugin and installed it on your site.
That was easy right? And the best thing is you can change the theme and the search bar stays the same!
Before we do those changes let's remove the plugin.
Remove our custom plugin
To remove the plugin we created it is the same as any other plugin. First, we need to deactivate the plugin.
Find the plugin in the list and click “Deactivate”.
The plugin page will refresh and you will see the “Delete” link. Click on this and the plugin is now removed from your site.
This will remove the plugin from your site.
Wrapping Up, How to Create a WordPress Plugin
You have learned how to create a WordPress plugin. You can now see how easy it is to do with a single file.
Instead of adding your code to functions.php
you can create a WordPress plugin. That will stop you from losing the code changes when you change the theme.