Extending WordPress

A (developers) guide to building your first WordPress plugin

@jon_bossenger http://jonathanbossenger.com

http://jonathanbossenger.com/extending-wordpress/

WHAT IS A WORDPRESS PLUGIN?

• One (or more) files (PHP, HTML, CSS, JavaScript)

• Extend WordPress functionality

• Simple – display 10 most recent posts

• Advanced – ticketing/eCommerce

PLUGIN BASICS

• Single file

• More complex structure

– PHP

– HTML/CSS (templates)

– JavaScript

• Plugin Header

PLUGIN HEADER/*Plugin Name: My ToolsetPlugin URI: http://URI_Of_Page_Describing_Plugin_and_UpdatesDescription: This describes my plugin in a short sentenceVersion: 1.5Author: John SmithAuthor URI: http://URI_Of_The_Plugin_AuthorLicense: GPL2License URI: https://www.gnu.org/licenses/gpl-2.0.htmlDomain Path: /languagesText Domain: my-toolset*/

TASK

• Create a lyrics plugin

• Copy and edit the plugin header from

hello.php to suit your requirements

• The plugin should be available in your plugins

list, in WP admin

PLUGIN BUILDING BLOCKS

• PHP Functions

• WordPress Action Hooks

• WordPress Filter Hooks

• Templates

• WordPress APIs (eg Options, Settings API)

• CSS/JavaScript (wp_enqueue_script)

It starts with an idea!

• At the end of each post, show a line from a

song

• Make the line stand out somehow

• (Bonus) Make it possible to edit the song lyrics

Hooks

• A pre existing event, that triggers either an

Action or a applies a Filter

• Action Hooks

• Filter Hooks

Actions

• A PHP function that is executed at a specific

point (hook)

• Create custom Actions or remove code from

an existing Action

Filters

• A function that is associated with an

existing Action

• Create custom Filters to replace code from an

existing Action.

• Filters allow you to replace or alter specific

data.

Examples

// Action Hook Examplefunction my_action_hook_function(){ // do some things here }add_action(‘some_action_hook’, ‘my_action_hook_function’);

// Filter Hook Examplefunction my_filter_hook_function($some_variable){ // do something with $some_variable here return $some_variable;}add_filter( ‘some_filter_hook’, ‘my_filter_hook_function’ );

Building our plugin

• ‘the_content’ filter hook, hooks into the ‘the_content’ filter, which is used to filter the content of the post after it is retrieved from the database and before it is printed to the screen.

• add_filter(‘the_content’, ‘my_filter_function’)

Building our plugin (cont)

• ‘wp_enqueue_scripts’ action hook, used to enqueue assets that are used on the front end (eg CSS, JavaScript)

• add_action(‘wp_enqueue_scripts’, ‘my_enqueue_scripts_function’);

• ‘wp_enqueue_style’ function, used to enqueue a style sheet file (load it on the front end)

• wp_enqueue_style( $handle, $source);

TASK

• Create a custom filter hook to add one line of text

AFTER the post content

• Create a custom action hook to load the custom CSS file

• Add some CSS styling to your one line of text (you did

wrap it in a div or p, didn’t you?)

• TIP: $plugin_url = plugin_dir_url( __FILE__ );

TASK

• Using the hello.php ‘hello_dolly_get_lyric’

function, create a function that gets one line

from the song to use in your custom

‘the_content’ filter in the previous step

• It should randomly select a lyric to display

Saving Plugin Data

• Options API

• Custom Tables

• Settings API

• Adding menus

Building our plugin (cont)

• ‘admin_menu’ action hook – used to add admin

menu items

• ‘add_options_page’ function – Add sub menu

page to the Settings menu

• add_options_page( $page_title, $menu_title,

• $capability, $menu_slug, $function);

Building our plugin (cont)

• add_option($option, $value) – add an option to the options table

• update_option($option, $value) – update an option by its key

• get_option($option, $default) – get an option value

Bonus Task

• Create a Settings menu item for your plugin

• Create a simple form that allows you to save

new song lyrics as a WP option

• Modify your plugin to use these saved lyrics

instead of ‘hello dolly’

Development Tips and Tricks

• WP_DEBUG

• DebugBar

• BugFu

• PHPStorm

Resources

• Google ;-)

• https://codex.wordpress.org

• https://developer.wordpress.org/

• https://developer.wordpress.org/plugins/

• https://codex.wordpress.org/WordPress_Coding_Standards

Resources (cont)

• https://webdevstudios.com/books/professional-

wordpress-plugin-development/

• https://github.com/hlashbrooke/WordPress-Plugin-

Template

• WPSA Slack

Questions ?