Do you want to make your own WordPress plugin? Come with us from the beginning, step by step! Through time, we built plugins that many people use. Some have asked how to build their own.
It seems hard, but it is a fun and worthwhile project to make a WordPress plugin. When you want to add something new to your site or make it helpful to others, building a plugin is a great way to do it.
With light touch, you need some basic knowing about PHP, HTML, CSS, and JavaScript. Here, step by step, we show you how to make the first WordPress plugin. Follow it so that you know how to build, test, back and share your own creations with others at the end. As a result, you can improve your own site easily and show your creation to the world.
Guide to Build a Basic WordPress Plugin for Beginners
How do you create your first plugin on WordPress?
Plugins are like phone’s apps for websites. They add extra features to your WordPress site. Take help from our detailed guide to understand this concept. For your first plugin, you need to know about PHP, CSS, HTML, and JavaScript languages only. This guide will help you through each step and by the end of the tutorial, you can create a simple plugin. In this, we will only cover basic coding to not difficult newbies.
Have a local environment to test the plugin on your PC, see the guide for configuring WordPress locally on Windows or Mac. You can also try the plugin on a staging website, but be careful not to spoil your live website; that is how to solve WordPress errors. To write the code, use a simple text editor like Sublime/TextEdit/Visual Code Editor (VSCode) or use one of the best code editors for developers if desiring that. The content has been rewritten following the given guidelines and preserving the HTML elements.
Now that you have everything you need, it’s time to start. If you’re anxious to get started, use the links below for quick access to each step:
Step 1: Create a Basic WordPress Plugin
Learn how to create the main structure of your plugin and add basic functionality.
Step 2: Install and Activate Your Plugin
Check out these guidelines and learn how to install the plugin on your WordPress website and activate it.
Step 3: Test Your Plugin Locally or on a Staging Site
Next, it is wise to trial-run your plugin either using localhost or staging site port if it is operational.
Step 4: Submit Your Plugin to WordPress.org Plugin Repository
Give your plugin to the community of WordPress users around the globe by sending it to the official plugin directory.
Step 5: Use Subversion (SVN) to Upload Your Plugin
Get insights on Subversion (SVN) to be uploaded to WordPress.org. Learn how to execute this process!
Step 6: Add Artwork and Screenshots to Your Plugin on WordPress.org
Articulate your plugin in an appealing way by adding images and artwork on its page at WordPress.org.
Step 7: Update Your Plugin Regularly
Remaining the plug-in is active on the web is simple but a manual update is needed with bug fixes, security enhancements, and new options.
Step 8: Promote Your Plugin and Get Feedback
Now let’s spread the information about your new plugin! One way is to make people know about this plugin. Engage users to provide feedback or reviews.
With these steps, you’ll be well on your way to creating a successful WordPress plugin!
Step 1: Build Your First Simple WordPress Plugin
The first step in creating your WordPress plugin is to take a new folder from your desktop and move it inside documents Shut up and take it! , or create a new folder. Call the folder also innocuous names such as wp-plugin-tutorials or my-first-plugin.
Within it, create a new file via the text editor and save it as cr-plugin-tutorial.php or my-first-plugin.php. The main point here is that the file should have .php in the extension so although the name can be whatever you want it to be, don’t forget this detail.
Adding the Plugin Header
At this point, the PHP file becomes live, and you can add the plugin header. This is a special comment block that WordPress uses to collate vital elements about your plugin, among others, its name, version, description, and author details. The sample below is a clear representation of what it is supposed to look like:
/*
Plugin Name: Creationwave Plugin Tutorial
Plugin URI: https://www.creationwave.com
Description: A simple plugin that adds a follow message at the end of posts.
Version: 1.0
Author: Creationwave
Author URI: https://www.creationwave.com
License: GPL2
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cr-tutorial
Domain Path: /languages
*/Once this header is added, you can begin coding the core functionality of your plugin just below it.
Writing the Plugin Code
For this tutorial, we’re creating a basic plugin that will add a “Follow Us” message at the end of each article, encouraging users to follow your social media accounts. Copy and paste the following code below your plugin header:
<?php
function cr_follow_us($content) {
// Only display the message on single post pages
if (is_single()) {
// Your message with links to Twitter and Facebook
$content .= '<p class="follow-us">If you enjoyed this article, follow us on <a href="https://twitter.com/yourprofile" title="Follow us on Twitter" target="_blank" rel="nofollow">Twitter</a> and <a href="https://facebook.com/yourprofile" title="Follow us on Facebook" target="_blank" rel="nofollow">Facebook</a>.</p>';
}
// Return the modified content
return $content;
}
// Hook the function into WordPress
add_filter('the_content', 'cr_follow_us');
Replace the placeholders for the Twitter link and the Facebook link with your own social media URLs before you save your file.
Zipping Your Plugin Folder
After the creation of the code for the plugin is complete, the next step is to package it in a zip folder for easy installation. Direct the folder where your plugin files are kept and create a zip file of it.
- For Mac, right-click the folder and choose “Compress cr-plugin-tutorial.”
- For Windows, right-click the folder and then “Send to > Compressed (zipped) folder.”
The resulting zip archive around the plugin is what will be loaded onto your WordPress site.
Testing Your Plugin Locally
Before putting your plugin on your actual site in a live mode, you might want to consider testing it on a WordPress installation on a local machine. You can use, for example, XAMPP or MAMP to set up a local server or simply try it out on a staging site to avoid your live website being interrupted. Thus, you are in no danger of your website being down because of the errors you will notice.
Step 2: Install and Activate Your First WordPress Plugin
After you have developed your unique WordPress plugin, your next move is to install and activate it on your website. Just follow the steps given in these simple instructions.
- Access the Plugins Page
Start by logging into your WordPress admin dashboard. Once you’re there, go to the Plugins section in the left-hand menu and click on Add New. - Upload the Plugin File
On the Add Plugins page, you’ll see an option at the top to Upload Plugin. Click on this button, and a box will appear where you can upload your plugin file. - Choose Your Plugin File
Click the Choose File button to select the zip file of your plugin that you created earlier. Once selected, click on the Install Now button to begin the upload and installation process. - Activate the Plugin
After the installation is complete, you’ll see an option to Activate your new plugin. Click on this to enable the plugin on your WordPress site. - Check Your Site
Finally, visit your website to ensure everything is working as expected. If your plugin adds a specific feature (like a new paragraph at the end of posts), you should now be able to see it in action on your single post pages.
By following these steps, you’ve successfully installed and activated your custom plugin. Finally, it is time for you to experience the power it brings to your WordPress page!
Step 3: Submit Your Plugin to the WordPress.org Plugin Repository
If you wish other WordPress users to come across and run your plugin, then the best approach is to upload your plugin onto WordPress.org. Therefore, a step-by-step tutorial about how to submit your plugin for approval follows.
Create a ‘Read Me’ File for Your Plugin
But first, you would need to make a readme.txt file for your plugin. As the plugin gets uploaded, it will show on your WordPress page and a file with all additional required activities will automatically be supplied to the user.
- Launch a simple text editor (for example, Notepad or Sublime Text) and then develop a new file.
- It should be this file that is stored as readme.txt in a folder inside your plugin folder.
The WordPress trustworthiness format should be used in the readme.txt file since it is required to emphasize the WordPress pattern in the readme file syntax. Here is one of the sample templates apart from the way the official guide says:
=== Your Plugin Name ===
Contributors: creationwave
Tags: example, tutorial, plugin
Requires at least: 6.0
Tested up to: 6.2
Stable tag: 1.0
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
A simple plugin to help beginners understand how to create a WordPress plugin.
== Description ==
This plugin is part of our step-by-step guide to building a WordPress plugin.
== Installation ==
1. Upload the plugin folder to your /wp-content/plugins/ directory.
2. Go to the **Plugins** page and activate the plugin.
== Frequently Asked Questions ==
= How do I use this plugin? =
Simply activate the plugin, and it will add a new feature to your WordPress site.
= How do I uninstall the plugin? =
Deactivate and delete the plugin from the **Plugins** page.
== Screenshots ==
1. Screenshot showing the plugin in action.
2. Another screenshot illustrating the feature.
== Changelog ==
= 1.0 =
* Initial plugin release.Understanding the Readme File Format
- Plugin Name: This plugin represents itself in the WordPress plugin repository
- Contributors: Enter the name(s) of the administrator(s) for this plugin in the username field. If a user doesn’t have a WordPress.org account, they will need to create one to be added
- Requires at least: Here you will provide the minimum version of WordPress required for your plugin to work.
- Tested up to: Indicate the last version of WordPress your plugin has been tested details.
- Stable Tag: The current version number of your plug-in (e.g., 1.0). This is the stable tag you should use.
- License: Some of the WordPress plug-ins that I work with use GPL licenses, and you also can use it if you want.
- Description: Very concisely, your plugin introduction is necessary to give an idea of its functions.
- Installation & FAQ: Installation instructions in steps and answers to the most often asked questions.
- Screenshots: Add some screenshots of your plugin along with explanations if they exist.
- Changelog: Write about the changes/updates you have made in the plugin i.e. version 1.0, the plugin is in release.
The last thing you’ll do is finish the readme.txt file, and press the “Save” button to apply the changes.
Prepare for Submission
At this stage, your plugin is ready for submission. Verify if you are allowed to use a free WordPress.org account to submit your plugin.
- Assuming you have no account previously, you can still create your account by visiting the WordPress.org website.
Submit Your Plugin to WordPress.org
- After you have gotten logged into your WordPress.org account, go to the Add. Your Plugin page.
- Press on “Log In” if you have not already logged into your account.
- On the Add Plugin page, click Browse and search for the zip file of your plugin.
- Tick the relevant boxes, accept the terms and then click on Upload.
Wait for Review
After submission the WordPress.org plugin review team will review the situation with the plugin. The evaluation of a plugin includes the thorough inspection of its code for security issues, simplicity of the codes, and its compatibility with WordPress’s standards.
- If your plugin will be approved after the review, you will receive an email from the plugin team.
- The plugin is going to be directed to WordPress.org-SVN, a repository, where you can manage updates and releases, by a link sent to your email.
What is SVN?
SVN (Subversion) is a tool that allows developers to control, manage, and track changes in their code over time. It is used for the purpose of documenting every modification (adding, changing, or deleting) of files, and for the developers, they can return to the old versions if they need it. In a simpler style, it means SVN enables teams of programmers’ interactions by identifying who did what and when.
Step 4: Use Subversion (SVN) to Upload Your Plugin
Your plugin will be approved by the WordPress.org review team and you will be notified via email containing a link to the plugin’s Subversion (SVN) repository. SVN, in this way, is a system of version control that allows you to map, monitor, and send changes to the WordPress.org repository.
In order to upload your plugin, you’ll first need to have an SVN client installed on your computer. Here’s a guide to help you out step by step.
Install an SVN Client
SVN clients let you access the repository, and you can upload files to interact with them. Here is some possible solutions to choose the proper option according to your operating system:
- Windows Users: You can use SilkSVN or TortoiseSVN (both free).
- Mac Users: The Versions app and SmartSVN can be set up.
In this tutorial, we are going to use the Versions App for Mac variations of the steps to a great extent for other SVN graphical interface apps too.
- If you add new files to the trunk folder, then a question mark icon will come in front of you stating that they haven’t been added to the repository yet.
- Select these new files, go to the File menu and click Add to add them to the repository.
Commit Changes
After your files are added to the local repository, the next step is to commit these changes to the SVN repository of WordPress.org:
- Select your local repository and click the ‘Commit’ button.
- You will see a pop-up window with a list of the changes you’ve made. Add a commit message, for example, “Initial plugin upload”.
- Click ‘Commit’ to sync your changes with the WordPress repository.
Tag the Plugin Version
Once you have your plugin files in the trunk, it’s time to tag the current version:
- Copy the files from the trunk folder and paste them into a new folder under the tags directory.
- You should name this new folder according to your plugin’s version number. This will match the version number in your plugin’s header.
- When a new folder is added, SVN client will show it with a question mark icon.
- Click ‘Add’ to include the new folder in the repository.
- After adding it, click ‘Commit’ to upload the new version.
Sync Future Updates
If you need to further modify your plugin, you can do it by simply repeating the process:
- Edit your local files.
- Once you’re ready, use the ‘Commit’ button again to sync the changes.
- To do so, create a new version by adding a folder with the new version number in the tags directory, and commit the changes. Preview Your Plugin
Once the files of your plugin are uploaded to SVN, you can see your plugin in the WordPress.org plugin directory. It may take a few minutes for changes to be visible to the public, but once they are, your plugin will be available for anyone to download and install!
Step 5: Add Artwork to Your Plugin on WordPress.org
The action of putting together artwork for your plugin or plugin page on WordPress.org is very great to make it more eye-catching and unique to users. WordPress has a feature whereby a theme can be customized through uploading a banner image, icon, and screenshots, thus enhancing the listing of your plugin. These links must bear the stipulated names and also be uploaded using Subversion (SVN) just as your plugin files are. Here’s how to do it:
Prepare Your Plugin Artwork
Prior to uploading, you will need to gather the following artwork files:
- Plugin Header Banner It’s the enormous picture that will feature at the top of your plugin webpage. You have two options of sizes to choose from:
- 772 x 250 pixels
- 1544 x 500 pixelsSave the file as either a JPEG or PNG file.
- Naming convention:
- banner-772×250.jpg or banner-772×250.png
- banner-1544×500.jpg or banner-1544×500.png
- Plugin Icon This smaller icon image is used as the plugin icon in the search results pages and the listing page. It may be either:
- 125 x 125 pixels
- 250 x 250 pixelsSave the file as either a JPEG or PNG.
- Naming convention:
- icon-128×128.jpg or icon-128×128.png
- icon-256×256.jpg or icon-256×256.png
- Screenshots These images are illustrations of your plugin in action. Multiple screenshots can be uploaded, and you are supposed to name them in the order you mention them in your readme.txt file.Naming convention:
Upload the Artwork Files
When all the artwork is at the ready, you need to download it to the WordPress.org repository this way:
- Go to your subversion (SVN) client (e.g. Versions, TortoiseSVN, or SmartSVN).
- Move to the cache directory of your plugin.
- Locate or generate a directory called assets under your local directory and keep it there. The graphics files that you draw will be kept here.
- Move the artwork files (banner, icon, and screenshots) to the assets folder.
Add the Files to SVN
The next step is for you to move your artwork files into the assets folder and give them a question mark in your SVN client, which will highlight the fact that they are not yet stored in the repository.
- Move the new files in your SVN client onto your filesystem and you will see a new ‘Add’ button on the top tabs. Click it to present the files in your repository (SVN versioning).
Commit the Changes
After you have added the artwork files to the SVN:
- To make the files successfully uploaded to WordPress.org, click the button labeled “Commit”.
- You can see a small window with files being uploaded. Next, you need to add commit message such as “Adding artwork for plugin page”).
- Press the ‘Commit’ button to complete the uploading process.
Check Your Plugin Page
Although the uploading of the artwork files is an instant process, it might take some time for these changes to appear. But if they do, rush to your plugin page’s space on the WordPress.org platform, and hence you will observe that the plugin icon, banner, and screenshots are all lined as your plugin’s synonymous items of information.
Ultimate Guide to Learning WordPress Plugin Development
It creates consternation in us to find there are two kinds of WordPress plugins some of them add features, and some are used to advancing tools such as quizzes, Google reviews, countdown timers, etc. Many plugins work together, so users can customize the systems more easily. These add-ons are also available to assist core plug-ins with further features and functionality.
To acquire a clear foundation in the development of plugins in WordPress, resources and topics are available to outline patterns of inducive course progression that will suit your needs and help you.Use codes for buttons, forms, and redirects in your plugin. They will help you to build up complex functionality quickly and easily.
- Shortcodes like that for adding videos, forms, and galleries to your posts are useful here. Create flexible custom shortcodes for user-friendly web design.
- Functions.php is used for adding site-specific functionality without modifying the theme. Make sure you are using child themes, or site-specific plugins for safe changes to your site.
- Create custom post types (CPTs) and taxonomies for special content in your plugin such as events or products.
- Adopt best practices for adding styles and scripts to your plugin. Ensure smooth operation and consistent appearance.
As you learn more, you might also be interested in our article on suggesting new features for WordPress plugins.
FAQ
1. How to Create a Custom Form Plugin in WordPress?
- Create Plugin Folder: In
wp-content/plugins/, create a new folder for your plugin. - Create Plugin File: Inside the folder, create a
.phpfile for your plugin code. - Add Form HTML: Add the form’s HTML structure inside the plugin file.
- Handle Form Data: Write PHP code to process and store or email form submissions.
- Use Shortcode: Create a WordPress shortcode to display the form on pages or posts.
2. How to Create a WordPress Theme and Plugin?
- Go ahead with the steps outlined above to create a custom plugin.
- Form a theme folder in wp-content/themes/ for the custom theme.
- Include style.css to provide details and index.php to present the theme configuration.
- Add the plugin’s functionality to the theme if required such as enqueue of styles or scripts.
- Activate the theme and the plugin, test to ensure they are compatible, and then make them live.
