Creating a WordPress plugin from scratch involves several steps. Here’s a complete guide to help you build your first plugin:
Step 1: Setup the Plugin Folder and File
- Navigate to the
wp-content/pluginsdirectory of your WordPress installation. - Create a new folder for your plugin. For example:
my-first-plugin. - Inside this folder, create a main PHP file. For example:
my-first-plugin.php.
Step 2: Add Plugin Header Information
Add the following code to the top of your my-first-plugin.php file. This provides WordPress with details about your plugin.
<?php
/**
* Plugin Name: My First Plugin
* Plugin URI: https://example.com/
* Description: A simple plugin to demonstrate WordPress plugin development.
* Version: 1.0
* Author: Your Name
* Author URI: https://example.com/
* License: GPL2
*/
This is essential for WordPress to recognize your plugin.
Step 3: Activate the Plugin
- Log in to your WordPress admin panel.
- Go to Plugins > Installed Plugins.
- Find “My First Plugin” in the list and click Activate.
Step 4: Add Basic Functionality
For demonstration, let’s add functionality to display a message at the end of every post.
Code:
// Add content at the end of the post
function my_plugin_add_content($content) {
if (is_single()) {
$content .= '<p style="color: blue;">Thank you for reading this post! - My First Plugin</p>';
}
return $content;
}
add_filter('the_content', 'my_plugin_add_content');
Step 5: Add a Shortcode
Let’s create a shortcode [my_plugin_shortcode] to display a custom message anywhere.
Code:
// Create a shortcode
function my_plugin_shortcode() {
return '<p>This is a message from My First Plugin!</p>';
}
add_shortcode('my_plugin_shortcode', 'my_plugin_shortcode');
Now, you can use [my_plugin_shortcode] in posts, pages, or widgets.
Step 6: Create a Custom Admin Page
Let’s add a settings page in the WordPress admin dashboard.
Code:
// Add a custom admin menu
function my_plugin_add_admin_menu() {
add_menu_page(
'My First Plugin Settings', // Page title
'My Plugin', // Menu title
'manage_options', // Capability
'my-plugin-settings', // Menu slug
'my_plugin_settings_page', // Callback function
'dashicons-admin-generic', // Icon
90 // Position
);
}
add_action('admin_menu', 'my_plugin_add_admin_menu');
// Create the settings page
function my_plugin_settings_page() {
echo '<h1>My First Plugin Settings</h1>';
echo '<p>Here you can manage settings for My First Plugin.</p>';
}
Step 7: Enqueue Styles and Scripts
If your plugin requires custom CSS or JavaScript, enqueue them properly.
Code:
// Enqueue custom styles and scripts
function my_plugin_enqueue_scripts() {
wp_enqueue_style('my-plugin-style', plugin_dir_url(__FILE__) . 'css/style.css');
wp_enqueue_script('my-plugin-script', plugin_dir_url(__FILE__) . 'js/script.js', array('jquery'), null, true);
}
add_action('wp_enqueue_scripts', 'my_plugin_enqueue_scripts');
Step 8: Use Hooks and Filters
WordPress provides hooks (actions and filters) to integrate custom functionality. Use them to extend WordPress features.
For example, using the admin_notices action to display an admin notice:
Code:
// Display an admin notice
function my_plugin_admin_notice() {
echo '<div class="notice notice-success is-dismissible">
<p>My First Plugin has been activated successfully!</p>
</div>';
}
add_action('admin_notices', 'my_plugin_admin_notice');
Step 9: Make It Translatable
Add internationalization support so your plugin can be translated into other languages.
Code:
// Load plugin text domain
function my_plugin_load_textdomain() {
load_plugin_textdomain('my-first-plugin', false, dirname(plugin_basename(__FILE__)) . '/languages/');
}
add_action('plugins_loaded', 'my_plugin_load_textdomain');
- Create a
languagesfolder. - Use tools like Poedit to create
.poand.motranslation files.
Step 10: Test and Debug
- Test in different themes: Ensure your plugin works with various WordPress themes.
- Debug: Enable debugging in
wp-config.phpby settingWP_DEBUGtotrue.
Folder Structure Example
my-first-plugin/
├── css/
│ └── style.css
├── js/
│ └── script.js
├── languages/
│ └── my-first-plugin-en_US.mo
│ └── my-first-plugin-en_US.po
└── my-first-plugin.php
Final Steps
- Follow WordPress coding standards.
- Add proper comments to your code.
- Test your plugin thoroughly.
Congratulations! You’ve created a basic WordPress plugin from scratch. Let me know if you need help with specific features!