DevelopmentFSOSS 2009

full-time now!

What is ?

…and it’s FREE

Where do I find ?

This number changes every few minutes.

This number changes every few minutes.

8, 000, 000 People publish blogson WordPress.com

8, 000, 000 People publish blogson WordPress.com

200 million people visit one or more

WordPress.com blogs every month.

200 million people visit one or more

WordPress.com blogs every month.

, not just a blog anymore

Getting started

What you need

PHP version 4.3 or greaterMySQL version 4.0 or greater

Creativity and Passion

Installing

5 minute install,

really it’s that quick and easy!

Installing • If installing locally

– Install a local server (Mac: MAMP, PC:XAMPP or WAMP, LINUX: LAMP).

• Create a new database.

• Download WordPress from wordpress.org and extract the files to a new folder under the htdocs folder.

• Rename the wp-config-sample.php file to wp-config.php and update the database details according to your local server.

• Run wp-admin/install.php and follow the instructions to install WordPress.

• Done!

Installing Update wp-config.php File

Installing Run install.php

Theming

Create or download a Photoshop design. Create a static HTML+CSS template of each page.

Theming Why Create a Static HTML File First?

Mainly because it will make the development process a lot

easier. I usually create a HTML file for every template that I

need, test it across all browsers, validate both HTML and CSS

markups, then all I have to do is cut & paste the WordPress

code. By doing so, I don’t have to worry about HTML or CSS

bugs during my theme making process.

Theming

How it all works

If you go the default theme folder (wp-content/themes/default),

you will see many PHP files (these are template files) and one

style.css file. When you are viewing the front page, WordPress

actually uses several template files to generate the page

(index.php << header.php, sidebar.php, and footer.php).

Theming

Theming Splitting the file

Theming

The Loop

The Loop is used to display blog posts and it also lets you

control what to display. Basically, The Loop checks if there

are posts in your blog, while there are posts, display it, if no

post found, say "Not Found".

Theming

<?php wp_list_cats('exclude=1'); ?> <?php wp_list_cats('exclude=1'); ?>

<?php wp_list_cats('exclude=1, 2'); ?><?php wp_list_cats('exclude=1, 2'); ?>

<?php the_content('Read the rest of this entry &raquo;'); ?><?php the_content('Read the rest of this entry &raquo;'); ?>

<div class="alignleft"><?php next_posts_link('&laquo; Older Entries') ?></div>

<div class="alignright"><?php previous_posts_link('Newer Entries &raquo;') ?></div>

<div class="alignleft"><?php next_posts_link('&laquo; Older Entries') ?></div>

<div class="alignright"><?php previous_posts_link('Newer Entries &raquo;') ?></div>

Conditional Tags

*See WordPress Codex- Conditional Tags

Theming Styles.css

/* Theme Name: Theme NAMETheme URI: http://yoursite.com/Description: My cool theme.Version: 1.6Author: Brendan Sera-ShriarAuthor URI: http://dropthedigibomb.com */

body { … }H1, h2, h3 { … }#header { … }#content { … }#sidebar { … }#footer { … }

.post { … }

.comments { … }

} This defines the template theme

} Theme id’s and classes

Theming Loop Resources

• The Loop in Action

• Template Tags

• Using the Loop in Template Files

• Matt Read Loop Article

• MaxPower Dynamic Sticky Tutorial

• IfElse Query_post Redux

• 1001 WordPression Loops

• Global Variables and the WordPress Loop

• WordPress Triple Loop Tutorial

• Multiple Loops with Multiple Columns

• WordPress - modified, dependent and extra Loops

• Super Loop: Exclude Categories and Limit Number of Posts

• Easily Adaptable WordPress Loop Templates: Basic Loops, Mullet Loops, and More

*See my presentation on WordPress Theme Design

Plugins and Widgets

PluginsPlugins are tools to extend the functionality of WordPress. The core of WordPress is designed to be lean, to maximize flexibility and minimize code bloat. Plugins offer custom functions and features so that each user can tailor their site to their specific needs.

WidgetsWordPress Widgets (WPW) is like a plugin, but designed to provide a simple way to arrange the various elements of your sidebar content (known as "widgets") without having to change any code.

VS.

“Plug-ins can extend WordPress to do almost anything you can imagine.” -WordPress.org

*See my presentation on WordPress Plugin Development

Plugins and Widgets

if ( function_exists('register_sidebar') ) {register_sidebar(array(

'before_widget' => '<li id="%1$s" class="widget %2$s">','after_widget' => '</li>','before_title' => '<h2 class="widgettitle">','after_title' => '</h2>',

)); }

if ( function_exists('register_sidebar') ) {register_sidebar(array(

'before_widget' => '<li id="%1$s" class="widget %2$s">','after_widget' => '</li>','before_title' => '<h2 class="widgettitle">','after_title' => '</h2>',

)); }

Widgetizing a themefunctions.php

<?php /* Widgetized sidebar, if you have the plugin installed. */if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>

Your widgets will show up here…

<?php endif; ?>

<?php /* Widgetized sidebar, if you have the plugin installed. */if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>

Your widgets will show up here…

<?php endif; ?>

sidebar.php

Essential Plugins• Ad Rotator - http://kpumuk.info/projects/wordpress-plugins/ad-rotator • Advanced Random Post - http://www.danielesalamina.it/advanced-random-post • AFD Admin Theme - http://aenonfiredesign.com/blog/afd-wordpress2-admin-theme • Akismet - http://akismet.com/ • All in One SEO Pack - http://semperfiwebdesign.com • Article Templates - http://www.bin-co.com/tools/wordpress/plugins/article_templates • Audio player - http://www.1pixelout.net/code/audio-player-wordpress-plugin • Blogroll Page - http://www.byte-me.org • Different Posts Per Page - http://www.maxblogpress.com/plugins/dppp • Disable WordPress Core Update - http://lud.icro.us/disable-wordpress-core-update • Executable PHP widget - http://wordpress.org/extend/plugins/php-code-widget • Kimili Flash Embed - http://www.kimili.com/plugins/kml_flashembed • Lightbox 2 - http://www.stimuli.ca/lightbox • Maintenance Mode - http://sw-guide.de/wordpress/plugins/maintenance-mode/ • myStatus - http://eightface.com/code/wp-mystatus • NextGEN Gallery - http://alexrabe.boelinger.com/?page_id=80

Essential Plugins• p2pConverter - http://www.briandgoad.com/blog/p2pConverter • Post2pdf - http://wordpress.org/extend/plugins/post2pdf • PXS Mail Form - http://www.phrixus.co.uk/pxsmail • QuickTime Embed - http://www.channel-ai.com/blog/plugins/quicktime-embed • Random Featured Post - http://www.mydollarplan.com/random-featured-post-plugin • Riffly Video/Audio Comments - http://riffly.com • Role Manager - http://www.im-web-gefunden.de/wordpress-plugins/role-manag er• Widget Logic - http://freakytrigger.co.uk/wordpress-setup • WordPress Database Backup - http://www.ilfilosofo.com/blog/wp-db-backup • Wordpress Download Monitor - http://wordpress.org/extend/plugins/download-monitor • WP Cache - http://mnm.uib.es/gallir/wp-cache-2 • WP e-commerce - http://www.instinct.co.nz/e-commerce • WP Polls - http://lesterchan.net/portfolio/programming/php • WP SpamFree - http://www.hybrid6.com/webgeek/plugins/wp-spamfree • WP-Sticky - http://lesterchan.net/portfolio/programming/php • WP Shopping Cart - http://www.instinct.co.nz

Extending

BuddyPress is a suite of WordPress plugins and themes, each adding a distinct new feature. BuddyPress contains all the features you’d expect from WordPress but aims to let members socially interact.

http://buddypress.org/

WordPress MU, or multi-user, is designed to do exactly that. It is most famously used for WordPress.com where it serves tens of millions of hits on millions of blogs each day.

http://mu.wordpress.org/

Extending

When a visitor browses to a WordPress.com blog on a mobile device we show special themes designed to work on small screens focussing on fast load times. The first theme is a modification of WPtouch and is displayed to phones with rich web browsers like the iPhone and Android phones. The second theme was developed from an old version of the WordPress Mobile Edition and will be displayed to all other mobile devices.

Mobile

Install

ResourcesDocumentationCodex - http://codex.wordpress.org/Main_PageSite Architecture – http://codex.wordpress.org/Site_Architecture_1.5Template Hierarchy - http://codex.wordpress.org/Template_HierarchyWordPress Plugins - http://www.webdesignerwall.com/general/useful-wordpress-plugins/WordPress Theme Hacks - http://www.webdesignerwall.com/tutorials/wordpress-theme-hacks/

TutorialsWeb Designer Wall - http://www.webdesignerwall.comSix Revisions – http://www.sixrevisions.comNetTuts - http://net.tutsplus.com/Tutorial 9 – http://www.tutorial9.net WPTopics - http://www.wptopics.com/WordPress Tutorials - http://www.wp-tutorials.org/

ThemesFunction - http://wefunction.comWPSnap - http://www.wpsnap.com/WooThemes – http://www.woothemes.comStyleShout - http://www.styleshout.com

ResourcesPluginsSimplified AJAX For WordPress Plugin Developers using Jquery“Desenvolvendo Plugins para WordPress” by Rafael Dohms (in Brazilian Portuguese)12 part “How to Write a Wordpress Plugin” at DevLounge.net by Ronald Huereca (PDF)How to create WordPress Plugin from a scratchUsing AJAX with your WordPress Plugin, also at DevLounce.netHow to Write a Simple WordPress Plugin at ATD

OtherBuddyPress - http://buddypress.org/WordPress MU – http://mu.wordpress.org/ WP e-Commerce – http://www.instinct.co.nz/e-commerce/ Thematic – http://themeshaper.com/WpTouch – http://www.bravenewcode.com/wptouch/ WordPress Mobile – http://en.blog.wordpress.com/2009/10/20/the-hero-is-in-your-pocket/

Thank You

Where to find me…

http://www.brendanserashriar.comhttp://www.dropthedigibomb.com

dropit@dropthedigibomb.com

http://www.twitter.com/digibombhttp://www.twitter.com/OptimalPayments