Developing Plugins For WordPress

DEVELOPING PLUGINS FOR WORDPRESS

Lester Chan | http://lesterchan.net

Agenda

Introduction Developing Plugin

WP API: Filters/Hooks Plugin Path Plugin Details Inserting CSS/Javascript Modifying Content Translating Plugin Text To Other Languages Shortcode API Activating The Plugin

Introduction

Name Lester Chan

Website http://lesterchan.net

Experience Developing WordPress Plugins the day WP

is born Developed 16 WP plugins to date

WP-Polls, WP-PostRatings, WP-PostViews, WP-Print, WP-Email, WP-Useronline, etc

WP:API Filters/Hooks

Filters Filters allows your plugin to modify data that

passes through WordPress at specific locations Eg: post title, post date, post content add_filter(‘location’, ‘plugin_function_name’);

Hooks Hooks allows you to execute your plugin

function at specific location when WordPress is being executed Eg: Init, header, footer add_action(‘location’, ‘plugin_function_name’);

Plugin Path

All WordPress plugins are placed in: /wp-content/plugins/

Example: Name: WP-Demo Nice Name: wp-demo

Placing your plugin in: /wp-content/plugins/wp-demo.php /wp-content/plugins/wp-demo/wp-demo.php

Plugin Path

My naming convention style: /wp-content/plugins/wp-demo/

wp-demo.php demo-css.css demo-js.js demo-js-packed.js demo-options.php demo-uninstall.php

Plugin Details

<?php/*Plugin Name: WP-DemoPlugin URI: http://lesterchan.net/wp-demo/Description: This is a demo pluginVersion: 1.00Author: Lester ChanAuthor URI: http://lesterchan.net*/?>

Inserting CSS/Javascript

Inserting CSS: function print_css() {

echo '<link rel="stylesheet" href="'.get_option('siteurl').'/wp-content/plugins/wp- demo/demo-css.css" type="text/css" media="screen" />‘;}

Use Hook: wp_head add_action('wp_head', ‘print_css');

Inserting CSS/Javascript

Inserting Javascript: Use Hook: wp_head Use 2 WP Functions:

wp_register_script() wp_print_scripts()

wp_register_script('wp-demo', '/wp-content/plugins/wp-demo/demo-js-packed.js', false, '1.00');

wp_print_scripts(array('jquery', 'wp-demo'));

Inserting CSS/Javascript

Advantages of using register/print script: Print only once

Good practice to compress/obfuscate Javascript Smaller File Size Load Faster http://dean.edwards.name/packer/

WordPress 2.6 wp_register_style() wp_print_styles()

Modifying Content

function demo_content($content) {return ‘Start of post’.$content.’End

of post’;}

Use Filter: the_content add_filter('the_content', 'demo_content');

Translating Plugin

Loading The Translation: function demo_textdomain() {

load_plugin_textdomain('wp-demo', 'wp- content/plugins/wp-demo');}

Use Hook: init add_action('init', 'demo_textdomain');

Translating Plugin

Printing the text Instead of

<?php echo ‘Testing’; ?>

Use <?php _e(‘Testing’, ‘wp-demo’); ?>

Return the text <?php __(‘Testing’, ‘wp-demo’); ?>

Translating Plugin

Poedit http://www.poedit.net/

Tutorial http://lc.sg/q

ShortCode API

What is ShortCode API? Shortcode API, a simple set of functions for

creating macro codes for use in post content.

Example: [demo id=“1”] Is able to retrieve a demo record of ID 1 and

embed the results into the post content

ShortCode API

Implementation [demo id=“1”] add_shortcode('demo', 'demo_shortcode');

function demo_shortcode($atts) {extract(shortcode_atts(array('id' => 0),

$atts)); return get_demo_by_id($id);}

Get Demo By ID Function function get_demo_by_id($id) {

// Perform Database Queryreturn '<p>ID:'. $id.'</p>‘;

}

Activating The Plugin

add_action('activate_wp-demo/wp-demo.php', 'create_demo_table');

global $wpdb; $wpdb->demo = $wpdb->prefix.'demo'; function create_demo_table() {

global $wpdb;…

}

THANK YOU

ANY QUESTIONS