WordPress plugin #1

52
WordPress Plugin #1 May 7th, 2015 Changwoo

Transcript of WordPress plugin #1

WordPress Plugin #1May 7th, 2015

Changwoo

TOC

1.Reference Book2.Plugin Introduction3.PHP Syntax: functions, classes4.Plugin Basics

a. plugin hello worldb. hooks

Reference Book

Professional WordPress Plugin DevelopmentBrad Williams, Ozh Richard, Justin TadlockISBN: 978-0-470-91622-3Paperback552 pagesMarch 2011

Introducing WP Plugin

Plug-in or add-in:an software to add

a specific feature toan existing software.

Everyone knows it.

Introducing WP Plugin

The famous “Hello, dolly!”

Popular Plugins

JetpackAkismetWordPress SEO by YoastWooCommerce...

How to make it?

Requirement

1.PHP 5.4+ programming skill

2.Knowledge of MySQL database server:a. You should understand WPDB structure

3.HTML, Javascript, CSS:a. You need to take care of client side

PHP Programming

WordPress is a PHP application.

You are required to understand functions and callbacks at least.

Database

Wordpress uses MySQL 5.5+

WPDB structuresSome query syntax:

DELETE INSERT SELECT UPDATEJOIN GROUP ORDERLIMIT OFFSET HAVING

Client-Side Languages

HTMLCSSJavascript

PHP Programming Concept:Function & Class

Basic: functions

function f(x) = x^2function g(x) = x+1

INPUTOUTPUTFUNCTION

Basic: functions

function f(x) = x^2function g(x) = x+1

function f($x) { return $x * $x; }function g($x) { return $x + 1; }

Basic: functions

function f($x) {return $x * $x;

}

function g($x) {return $x + 1;

}

Basic: functions

(option) type hinting is available(not for scalars: int, bool, string, ...)

function foo(array $x) {...}

foo(array()); // OKfoo(5); // ERRORfoo(NULL); // ERROR

Advanced: class

Functions are not enough.You will need more advanced programmaing techniques.

Q. Do you know what is “class”?Q. Then, what is “object”

Object vs Class

● building vs plan

vs

Object vs Class

● building vs plan

vsobjec

t

Object vs Class

● building vs plan

vsobjec

t

class

Class: a service plan

Inside a class:variablesmethods

Class: a service planclass Car {

public $name;public $max_speed;public $color;private $cost;

public function honk() { … }private function engine_ignite() {

...}}

Class: a service planclass Car {

public $name;public $max_speed;public $color;private $cost;

public function honk() { … }private function engine_ignite() {

...}}

car property

Class: a service planclass Car {

public $name;public $max_speed;public $color;private $cost;

public function honk() { … }private function engine_ignite() {

...}}

car action

Why class?

● Easily modularized● Can be extended

o DRY: Don’t Repeat Yourself

Class Inheritance

class Truck extends Car {...public function dump() {}

}

Class in Modern Programming

Class is important to modern programming, OOP.

Almost all advanced topics are closely related to classes.

next, cb func.

Callback function

Plugins extend WordPress.

- Plugins do extra tasks for core.- Core runs plugins.- So there will be a ‘protocol’.

Callback function

Imagine the protocol

- Wordpress core knows every possible situation.

- But the detail has not been known exactly

Callback function

- So plugins throw “to do list” to the core.

- Then core runs as the list says.

TO-DO LIST: callback function

Callback function

callback func.

caller:outside ofmy program

general func.

caller:inside of

my program

Hello, World! Plugin

Environment settingWe all must in the same AP.Add a line below to /etc/hosts:

<ip> wp-meetup

Check http://wp-meetup/ is valid, and you can login as guest/guest.

Check ftp://wp-meetup is valid.You can login as meetup/1.You an upload your plugin here.

Hello, World! PluginCreate your first plugin!

1. create a plugin directory “hello-world-<your-name>”2. in the directory, create main file:

hello-world.php3. Add file header and edit it!4. Upload your plugin directory to wp-meetup via FTP5. Access http://wp-meetup, login, and check out your

fresh plugin.

Hello Dolly Plugin Example

/*Plugin Name: Hello DollyPlugin URI: http://wordpress.org/plugins/hello-dolly/Description: This is not just a plugin, it symbolizes the hope and enthusiasm of an entire generation summed up in two words sung most famously by Louis Armstrong: Hello, Dolly. When activated you will randomly see a lyric from <cite>Hello, Dolly</cite> in the upper right of your admin screen on every page.Author: Matt MullenwegVersion: 1.6Author URI: http://ma.tt/*/

There are just 3 function definitions and 2 add_action() calls:

● hello_dolly_get_lyric(): get any random lyric● dolly_css(): callback. add style tag● hello_dolly(): callback of admin_notices.

● add_action( 'admin_notices', 'hello_dolly' );● add_action( 'admin_head', 'dolly_css' );

Hello Dolly’s Actions

Action and Callback

WPCore Dolly

add_action( ’admin_notices’, 'hello_dolly');

Action and Callback

● admin_notices:○ hello_dolly○ ...○ ...

WPCore Dolly

add_action( ’admin_notices’, 'hello_dolly');

Action and Callback

● admin_notices:○ hello_dolly○ …○ …

WPCore Dolly

add_action( ’admin_head’, 'dolly_css');

Action and Callback

● admin_notices:○ hello_dolly○ …○ …

● admin_head:○ dolly_css○ …○ ...

WPCore Dolly

add_action( ’admin_head’, 'dolly_css');

Action and Callback

● admin_notices:○ hello_dolly○ …○ …

● admin_head:○ dolly_css○ …○ ...

WPCore

WPCore Runs…Createing a page…

Action and Callback

● admin_notices:○ hello_dolly○ …○ …

● admin_head:○ dolly_css○ …○ ...

WPCore

Code reaches at‘admin_notices’ actions in core

Action and Callback

● admin_notices:○ hello_dolly○ …○ …

● admin_head:○ dolly_css○ …○ ...

WPCore

Registered callbacks are fired!

Action and Callback

● admin_notices:○ hello_dolly○ …○ …

● admin_head:○ dolly_css○ …○ ...

WPCore

Code reaches at‘admin_head’ actions in core

Action and Callback

● admin_notices:○ hello_dolly○ …○ …

● admin_head:○ dolly_css○ …○ ...

WPCore

Registered callbacks are fired!

Hello Dolly Modification

Add any lyrics you like.Alter styles.…

Plan Your New Plugin!

Prepare your development environment.

Plan your new plugin.

Submit your plugin to wordpress.org

Fin.

Action and Callback

Then where areadmin_noticesand admin_head

actions?

action listcodexfunction referenceflow chartaction database...