Introduction To Simple WordPress Plugin Development

Introduction To Simple WordPressPlugin Development

Develop the skills of planning and developing your pluginswith emphasis on hooks, callback functions and more!

About Bruce ChamoffCEO of Hot Web Ideas, Inc, hotwebideas.net, a New York

based web development firm of over 20 years with a portfolio of over 1,000 websites including Korg, JP Morgan Chase, Whirlpool, UBS

A WordPress theme and plugin developer of 9 yearsInstructor on 5 Udemy.com WordPress Development CoursesA contributor to the WordPress.org development forumsSpeaker at WordCamps.Dad with one daughter.

What Exactly Is a Plugin?It is a PHP script that extends WordPress to perform

new functions out of the box.Allows developers to change the WordPress core

without modifying any of its code.Contains a combination of PHP, HTML, CSS, and

Javascript.The PHP code of any plugin consists of a combination

of one or more WordPress hooks and one or more callback functions.

Website: WebDesignerMall.com / WordPress.org: hotwebideas / Twitter:@brucechamoffI teach WordPress Development Courses at http://udemy.com/user/brucechamoff

http://udemy.com/user/brucechamoff

Why Do We Need Plugins?*To prevent hacking the WordPress coreTo protect our code from WordPress updatesTo extend the basic WordPress installation

and allow it to perform new functionality

DON’T HACK THE CORE!Website: WebDesignerMall.com / WordPress.org: hotwebideas / Twitter:@brucechamoffI teach WordPress Development Courses at http://udemy.com/user/brucechamoff


What Is The WordPress Core?All folders and files outside of the wp-content

directory including:RootWP-includesWP-admin

We CAN edit anything under the WP-Content directory



Where is the Code for Plugins Stored?



How To Name a PluginSince plugins are PHP files, they can have any file

name with a .PHP extension, but preferably identical to its folder name.

They can be stored in a folder or directly in the wp-content /plugins directory.

Examples of plugin folders and names include:wp-content /plugins/folder-name/my-plugin.phpwp-content /plugins/my-plugin.php



Simple Plugin PlanPlanning your plugin involves 5 simple questions:

Who will use your plugin? When will your plugin run? Where will your plugin run? What will execute? How will it execute?



Plugin Architecture & Coding Structure1. File Header

2. Hook

3. Callback Function

add_filter(‘HOOK NAME’,’CALLBACK FUNCTION REFERENCE’);or add_action

function CALLBACK FUNCTION (){

All PHP content which can include WordPress API code, wp_content, get_posts.

return data, PHP variable, object, array, string literal, etc;}

These 2 must match.

More About Hooks1. There are two types of hooks: action and filter hooks.

A. Action hooks tell WordPress to perform an action.B. Filter hooks tell WordPress to change some part of the content.

2. Hooks are a necessary part of any plugin as they instruct WordPress to act on a certain feature or piece of content.

3. They tell WordPress when, where, and for whom to run the code inside the plugin.

4. Themes can also include hooks in their functions.php file.5. Interesting Fact: Drupal also uses hooks in its modules.There are hundreds of hooks listed at:

https://codex.wordpress.org/Plugin_API/Filter_Referencehttps://codex.wordpress.org/Plugin_API/Action_Reference



My Most Frequently Used HooksFilter Hooks:• the_content• admin_footer_text• body_class• login_headertitle• wp_footer• the_modified_time

Action Hooks:• admin_menu•rest_api_init•init • admin_init• admin_notices• wp_dashboard_setup• admin_bar_menu• wp_enqueue_scripts• show_user_profile• edit_user_profile• personal_options_update• edit_user_profile_update• login_form_login• widgets_init• customize_register• after_setup_theme



Hook Example: Announce New FB Page

Where: At the end of every blog post.When: N/AWho: Any public user (non-admin role)

Use: the_content



Hook Example: Greet an Admin

Where: In the WordPress back endWhen: When an admin entered the back endWho: Someone with the administrator or editor user role

Use: admin_notices



Hook Example: Greet an Admin

Where: In the WordPress user editing screenWhen: Any user clicks the Edit Profile linkWho: Any user with rights to edit his/her profile.

Use: edit_user_profile



Hook Example: Run Javascript Files

Where: Anywhere Javascript is neededWhen: Our plugin executesWho: N/A

Use: wp_enqueue_scripts



More About The Callback Function1. It is a regular PHP function.2. Besides PHP code, it can contain WordPress API code. See

Next Slide3. The function name must match the callback function’s

reference in the referring hook.4. The code for callback functions can also be written as object-

oriented code as well.5. Depending on the hook calling the function, it can accept any

number of parameters or none.



My Most Frequently Used WordPress APIs in Plugin Callback Functions

1. Options API2. Transients API3. Metadata API4. Theme Customization API (also used in themes known as the

customizer)5. Shortcode API6. Widgets API



Review:Steps For Developing Our Plugin

1. Open our text editor (Notepad++, Edit Plus, BBEdit, Notepad, etc.)

2. Add the PHP directives.3. Write our plugin header.4. Write our hook.5. Write our callback function.6. Add supporting files (images, HTML, CSS, Javascript)7. Save our plugin as a PHP script under

wp-content/plugins/folder-name/plugin-name.phpWebsite: WebDesignerMall.com / WordPress.org: hotwebideas / Twitter:@brucechamoffI teach WordPress Development Courses at http://udemy.com/user/brucechamoff


A Simple Plugin:<?php

/*Plugin Name: Add My URLDescription: Add any URL to the end of all WordPress posts and pagesVersion 1.0Author: Bruce ChamoffAuthor URL: http://www.hotwebideas.net*/

add_filter(‘the_content’, ’add_my_website’);

function add_my_website($content){

$new_content = $content . ‘<p><a href=“http://www.hotwebideas.net”>Visit My Website</a></p>’;

return $new_content;}

?>

Add Your URL To All Posts and Pages



How To Customize This Plugin1. Look at the slide titled All the code you need

or click this link.2. Open your favorite text editor and copy the

PHP code to a new file.3. Save the file as specialid_add_to_the_end.php

where specialid can be any ID you want such as hwi_add_to_the_end.php

How To Customize This Plugin (continued)

Customize the header:/*headerPlugin Name: Add My URLDescription: Add any URL to the end of all WordPress posts and

pagesVersion 1.0Author: Bruce Chamoff replace with your nameAuthor URL: http://www.hotwebideas.net replace with your URL*/

1. Change the author nameto YOUR name.

2. Change the URL to YOURURL or social media page.

How To Customize This Plugin (continued)

Customize the callback function://callback functionfunction add_my_website($content){

$new_content = $content . ‘<p><a href=“http://www.hotwebideas.net”>Visit My Website</a></p>’;

return $new_content;}

2. Change the call to action to any thing you want.

1. Change the URL to your new site or social media page.

Installing Your New PluginNow, you can upload it to your WordPress site. Follow these steps:

1. Save your plugin as a zip file.

2. Log into your WordPress admin.

3. Click on PluginsAdd New.

4. Continued on next page.

Installing Your New Plugin (Continued)

Click Upload Plugin.


Click Choose File.


Navigate to your zip file and double-click it.


Click Install Now.

Activating Your New Plugin (Continued)

Click Activate Plugin.

Activating Your New Plugin (Continued)

Congratulations! Your new plugin is activated and should now display your new URL at the end of every blog post!

Contact & Q&AContact Me For Plugin Help

Twitter @BruceChamoff WebDesignerMall.com Udemy.com

http://udemy.com/user/brucechamoff Get 50% Off My WordPress Development

courses with coupon code WORDCAMPI will answer any question…Website: WebDesignerMall.com / WordPress.org: hotwebideas / Twitter:@brucechamoffI teach WordPress Development Courses at http://udemy.com/user/brucechamoff



Internet

Introduction To Simple WordPress Plugin Development