How to Make a WordPress Plugin in 2025

To make a WordPress plugin in 2025 requires only 3 files, the plugin PHP file, the style.css file and the script.js file.

You can also read this on medium.com.

What we’ll create in this post is a super simple WordPress plugin that will provide us a short code to use on the website. This short code will display ‘Hello World’ on our website.

FAQ

You can see the end result here:

Make a WordPress Plugin - plugin example

Let me show you exactly how to make a WordPress plugin!

How to Create a WordPress Plugin in 2025

In order for us to create a ZIP that imports into WordPress without issue, we need to create the following folder structure.

Folder Structure

Generated using ASCII Tree Generator:

hello-world-plugin/
├─ css/
├─ js/
Make a WordPress Plugin - initial folder structure

Plugin PHP File

After that, create a hello-world-plugin.php file in the root of this folder. This will be the file that WordPress uses to install the plugin and also display the plugin settings/info in the WordPress Admin panel.

Open this new hello-world-plugin.php file and enter the following code:

<?php
/*
Plugin Name: Hello World Shortcode
Description: A simple plugin that adds a shortcode to display 'hello-world!'
Version: 1.0
Author: Your Name
*/

// Prevent direct access to this file
if (!defined('ABSPATH')) {
    exit;
}

// Enqueue CSS and JS
function hw_enqueue_scripts() {
    wp_enqueue_style('hello-world-style', plugins_url('css/style.css', __FILE__));
    wp_enqueue_script('hello-world-script', plugins_url('js/script.js', __FILE__), array('jquery'), '1.0', true);
}
add_action('wp_enqueue_scripts', 'hw_enqueue_scripts');

// Register shortcode
function hello_world_shortcode() {
    return '<div class="hello-world-container">hello-world!</div>';
}
add_shortcode('hello-world', 'hello_world_shortcode'); 

The code above might look complex if you’ve never used PHP before, but it’s really quite simple. At the top you have your plugin info commented out. We also put in some safety to prevent direct access to the hello-world-plugin.php file.

Next, we add a style.css and a script.js file. These will be created shortly, and they’re used to actually create and style the plugin functionality onto our WordPress website.

We can now register the short code to return our div element, and add the ‘hello-world’ short code to the plugin.

On line 17, you can adjust the ‘1.0’ value along with the value at the top of the file in the commented section to update the version number of your plugin.

Now that we have that file, we can move onto the script.js file.

JavaScript Functionality

Inside the js folder we created earlier, create a file named script.js. Inside this file, add the following code:

jQuery(document).ready(function($) {
    $('.hello-world-container').hover(
        function() {
            $(this).css('background-color', '#e0e0e0');
        },
        function() {
            $(this).css('background-color', '#f0f0f0');
        }
    );
}); 

This is a super basic example script to show you how this file can be used. You can see, all it does is update the background color if the container ‘hellow-world-container’ is currently being hovered.

You could do this purely in CSS, but I left it in to give you an example.

Now, we need to add some basic CSS to style the plugin on our WordPress site.

CSS Styling

Inside the css folder, create a file called style.css and add the following:

.hello-world-container {
    padding: 20px;
    margin: 10px 0;
    background-color: #f0f0f0;
    border-radius: 5px;
    text-align: center;
    font-size: 18px;
    color: #333;
} 

This simply adds some super basic formatting and decoration to our plugin so that it doesn’t look like complete rubbish on our site. You can see again, that we are targeting the .hello-world.container that was configured in the script.js file.

Final Folder Structure

After all those changes, your plugin folder should look like this:

hello-world-plugin/
├─ hello-world-plugin.php
├─ css/
│ ├─ style.css
├─ js/
├─ script.js

ZIP The Plugin

After you’ve confirmed your folder structure is the same as mine, select the css folder, js folder and the hello-world-plugin.php file, right-click and ZIP them. I’ve put together a little GIF below to show you how to do this. It’s worth noting that you should name the ZIP file something appropriate, I went with “hello-world-plugin”:

How to Install a WordPress Plugin

Once you have this ZIP file, head over to your WordPress admin panel -> Plugins -> Add New Plugin -> Upload Plugin -> Choose File and finally select the ZIP we previously created.

The plugin will now install into your WordPress site, and the only thing left to do is activate the plugin and to test it works.

Testing The WordPress Plugin

After all of that, you should now have your plugin installed and Activated inside WordPress.

To use it, go to anypart of your website and add the shortcode block.

Inside the short code, add [hello-world] and you’ll see the plugin come to life!

Conclusion

I’ve also made a short video on this that you can view on TikTok or Instagram

Just to wrap up and say it again, this is a very simple demo plugin to show you how to get started. If you want to learn how to build more complex WordPress plugins, I would recommend YouTube, or AI assisted tools such as Cursor.

Enjoy! 🎉

email popup image
Mark Harwood
NEVER miss a blog post again! Subscribe for email notifications whenever a new post is live!
Subscribe
NEVER miss a blog post again! Subscribe for email notifications whenever a new post is live!
Fill Out This Form, And I Will Be In Touch Shortly
Contact form image
I'll Be In Touch Soon