Categories
Uncategorized

How to build a WordPress plugin/theme Options Page

At one time or another; every WordPress developer has asked herself the same question: “To hard code or not to hard code?“.

Hardcoding is when you write something that could change directly into the code.

For example: assume you were writing a BOGO marketing plugin which would offer discounts on products which meet a specific criteria like product ID.

Well you could do something like:

$bogo_item_ids = array( 123, 231, 333, 555 );
foreach( $bogo_item_ids as $item ){
   give_discount($item);
}

But, if wanted to target different products or use this plugin on another store; you would need to hard code in the new product ids.

There is a better way: the Settings API.

How to build an option/settings page

To start building an options page, we must first add a link to our page in the backend (/wp-admin).

By utilizing the Settings API, we can get a lot done without writing a lot of code.

First, lets create page with add_menu_page().

https://developer.wordpress.org/reference/functions/add_menu_page/

Its important to note that our add_menu_page() function must be wrapped with in another function that we hook into

Categories
Uncategorized

How to create a WordPress plugin

Creating the plugin

WordPress plugins make it easy for anyone to modify a WordPress website.

First, create the folder ‘gerrg-wordpress-plugin‘.

Next create the main PHP file ‘gerrg-wordpress-plugin.php‘.

cd ~
mkdir gerrg-wordpress-plugin
touch gerrg-wordpress-plugin/gerrg-wordpress-plugin.php

Next open up the .php file you just created with your favorite code editor ( I like VS Code ).

code gerrg-wordpress-plugin/gerrg-wordpress-plugin.php

File Headers

The file header contains all the plugin information like: name, description, author and licensing.

Copy the following into your gerrg-wordpress-plugin.php file:

<?php
/**
 * Plugin Name:       Gerrg WordPress Plugin
 * Plugin URI:        http://gerrg.com/how-to-create-a-wordpress-plugin/
 * Description:       Allows the admin to implement BOGO marketing rules
 * Version:           0.5
 * Author:            Gerrg
 * Author URI:        http://gerrg.com/
 * License:           GPL v2 or later
 * License URI:       https://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain:       gerrg
 * Domain Path:       /languages
 */

defined( 'ABSPATH' ) or die( 'No script kiddies please!' );

Testing the plugin

Before we get started, lets actually make sure that our plugin is setup properly.

First we are going to add some code to the plugin which simply outputs ‘Hello’. Next we will move the folder to the wp-content/plugins directory. Finally, we will activate our plugin and check for the ‘Hello’ on our webpage.

echo ‘hello’

First add the following code to the bottom of your .php file.

...
add_action( 'wp_head', 'gerrg_say_hello' );

function gerrg_say_hello(){
    echo 'hello';
}

If you are not familiar with the WordPress Plugin API, in the code above we are simply adding an action to a hook. A action is simply a function, a hook is a SPOT in the code where that function will run.

Above we are adding our gerrg_say_hello function to the wp_head hook. The wp_head hook is triggered between the <head></head> section of the website.

Simply put, we expect to see ‘hello’ at the top of our webpage.

Activating your plugin

It’s very likely you already know how to activate a plugin. First we need to move our folder into the wp-content/plugins directory of our web server.

There is more than one way to do this and I leave it to you get accomplish this task.

mv gerrg-wordpress-plugin ~/www/wp-content/plugins/

The above code is a simple linux command for moving my plugin folder into the wp-content/plugins directory of my web server.

After moving the plugin, log into your admin section of your WordPress website. Navigate to the plugin section you should see the Gerrg Woocommerce BOGO plugin.

Plugin section featuring the plugin we just created…

Click activate and navigate the the homepage. In the top left corner of the screen you should see a simple ‘hello’.

If you see the ‘hello’ message than your plugin is ready to actually do something useful.

Congrats! You’ve created your very own plugin.