HOW TO DEVELOP A simple WORDPRESS PLUGIN

HOW TO DEVELOP A simple WORDPRESS PLUGIN

November 23, 2019

In this article, you will understand how to develop a simple WordPress plugin

Please try to understand the steps plugin code link given at end of the article

STEP 1: CREATE A FOLDER IN WORDPRESS PLUGINS DIRECTORY

WordPress Plugin Directory path:

wp-content > plugins > basic-wordpress-plugin

We have created ‘basic-wordpress-plugin’ folder in plugins directory

STEP 2: CREATE A PHP FILE IN ‘BASIC-WORDPRESS-PLUGIN’ FOLDER ‘BASIC-WORDPRESS-PLUGIN.PHP’

Write comments in this file

<?php
/*
Plugin Name: Basic WordPress Plugin
Description: Basic wordpress plugin Description
Version: 1
*/

if (!defined('ABSPATH')) { exit;}

Theses comments are important in wordpress. WordPress reads these comments

Plugin Name: It defines name of plugin

Description: It defines description of  plugin

Version: It defines current version of  plugin

There are some other comments also available, you can read at wordpress.org

The next line used to stop direct accessing the plugin by URL

STEP 3: DEFINE CONSTANTS WHICH WE USE IN PLUGIN

if (!defined("BWP_VERSION_CURRENT")) define("BWP_VERSION_CURRENT", '1');
if (!defined("BWP_URL")) define("BWP_URL", plugin_dir_url(__FILE__));
if (!defined("BWP_PLUGIN_DIR")) define("BWP_PLUGIN_DIR", plugin_dir_path(__FILE__));
if (!defined("BWP_PLUGIN_NM")) define("BWP_PLUGIN_NM", 'Basic WordPress Plugin');
if (!defined("BWP_PLUGIN_FILE")) define("BWP_PLUGIN_FILE", __FILE__);
if (!defined("BWP_TD")) define("BWP_TD", 'bwp_td');

we simply define constants which need in the plugin, you can create more constants according to the requirement

STEP 4: CREATE A CLASS RELATED TO YOUR PLUGIN NAME

  • Create a class with the name ‘Basic_Wordpress_Plugin ‘
  • Create a construct function in class
  • Create two more functions bwp_activate, bwp_deactivate
  • bwp_activate: This function for plugin activate hook
  • bwp_deactivate: This function for plugin deactivate hook
  • Create two WordPress pre-defined functions under construct
  • register_activation_hook(BWP_PLUGIN_FILE, array($this, ‘bwp_activate’)) : Plugin Activation hook with function name, BWP_PLUGIN_FILE(constant used for file path), array : containing function name
  • register_deactivation_hook(BWP_PLUGIN_FILE, array($this, ‘bwp_deactivate’)): Plugin Activation hook with function name
Class Basic_Wordpress_Plugin
{

    public function __construct()
    {
        // Installation and uninstallation hooks
        register_activation_hook(BWP_PLUGIN_FILE, array($this, 'bwp_activate'));
        register_deactivation_hook(BWP_PLUGIN_FILE, array($this, 'bwp_deactivate'));
    }

    public function bwp_activate()
    {

    }

    public function bwp_deactivate()
    {
    }

} 
$Basic_Wordpress_Plugin_OBJ = new Basic_Wordpress_Plugin();

STEP 4: NOW CALL JS AND CSS IN PLUGIN

  • Create two functions under Class
  • Create js file in plugins > basic-wordpress-plugin >assets > js > bwp.js
  • Create css file in plugins > basic-wordpress-plugin >assets > css > bwp.css
  • wp_enqueue_script(“jquery”) : Call jquery file
function bwp_backend_plugin_js_scripts()
    {
        wp_enqueue_script("jquery");
        wp_enqueue_script("bwp.js", BWP_URL . "assets/js/bwp.js");
    }

    function bwp_backend_plugin_css_scripts()
    {
        wp_enqueue_style("bwp.css", BWP_URL . "assets/css/bwp.css");
    }

Call two more pre defined function under construct

    add_action("admin_init", array($this, 'bwp_backend_plugin_js_scripts'));
    add_action("admin_init", array($this, 'bwp_backend_plugin_css_scripts'));

STEP 5: NOW CREATE MENU FOR A PLUGIN UNDER WORDPRESS ADMIN MENU

  • add_submenu_page: function used to create a submenus under the menus in wordpress
  • parameter 1 ‘options-general.php’: used to create submenu under settings in admin menu
  • parameter 2 ‘BWP_PLUGIN_NM’ : its a title tag of page we defined constant plugin name for title
  • parameter 3 ‘__(‘Basic WordPress Plugin’, BWP_TD)’ : its the Name of submenu which appears under settings admin menu
  • parameter 4 ‘manage_options’ :  option permission. which user can access
  • parameter 5 ‘manage_options’ :  option permission. which user can access
  • parameter 6 ‘bwp_slug’ : its plugin slug
  • parameter 7 array($this, ‘bwp_admin_page’)) : This parameter contains a function name which called on clicking this menu.
  • At end we create a one more function ‘bwp_admin_page’ , Its callled when clicked on plugin menu. its used to create view
public function bwp_setup_admin_menu()
 {
 add_submenu_page('options-general.php',
 BWP_PLUGIN_NM, // title
 __('Basic WordPress Plugin', BWP_TD), //name in menu
 'manage_options', // Submenu under settings
 'bwp_slug', // slug of page
 array($this, 'bwp_admin_page')); //function

 }

 public function bwp_admin_page()
 { 
 echo <div>Basic WordPress Plugin</div> 
 }

Call above function under construct with hook ‘admin_menu’ it creates a menu in wordpress admin menu

add_action('admin_menu', array($this, 'bwp_setup_admin_menu'));

Avada Programmer

Hello! We are a group of skilled developers and programmers.

Hello! We are a group of skilled developers and programmers.

We have experience in working with different platforms, systems, and devices to create products that are compatible and accessible.