Extending WordPress beyond!

mitcho (Michael 芳貴 Erlewine)

http://mitcho.com, @themitchoD.C. WordPress Meetup, March 18, 2011

Extending WordPress beyond!

CC-BY-NC flickr.com/photos/28634332@N05/

mailto:[email protected]


follow slides onhttp://slideshare.net/mitcho

http://slideshare.net/mitcho

http://slideshare.net/mitcho

Today: extend WordPress...


beyond the blog


beyond the blogbeyond the hack


beyond the blogbeyond the hackbeyond your site

Introduction

Introduction

• Hi, I’m mitcho.

Introduction

• Hi, I’m mitcho.• Linguist, coder, teacher.

Introduction


• http://mitcho.com; @themitcho

http://mitcho.com

http://mitcho.com

http://twitter.com/mitchoyoshitaka


Introduction


• http://mitcho.com; @themitcho• Linguistics PhD student at MIT

http://mitcho.com

http://mitcho.com



Introduction


• http://mitcho.com; @themitcho• Linguistics PhD student at MIT• Mozilla, Automattic, MIT

http://mitcho.com

http://mitcho.com



Yet Another Related Posts Plugin (YARPP)

• smart “related posts” listings with lots of customization



• mitcho.com/code/yarpp or search for “YARPP”; @yarpp


http://mitcho.com/code/yarpp


http://twitter.com/yarpp



• mitcho.com/code/yarpp or search for “YARPP”; @yarpp

• over 850k downloads






HookPress

HookPress• opens up the WordPress hook

system to remote scripts


system to remote scripts• extend WP with other languages


system to remote scripts• extend WP with other languages• now on WordPress.com!


system to remote scripts• extend WP with other languages• now on WordPress.com!• mitcho.com/code/hookpress;

@hookpress





ShrimpTest

ShrimpTest

• A/B testing, built right into WP

ShrimpTest

• A/B testing, built right into WP• joint project with Automattic

ShrimpTest

• A/B testing, built right into WP• joint project with Automattic• currently in perpetual beta:

ShrimpTest

• A/B testing, built right into WP• joint project with Automattic• currently in perpetual beta:• shrimptest.com; @shrimptest





ShrimpTest

• A/B testing, built right into WP• joint project with Automattic• currently in perpetual beta:• shrimptest.com; @shrimptest

• video of talk up on wordpress.tv





CC-BY-NC-SA flickr.com/photos/13382424@N00/5216424459/

http://www.flickr.com/photos/13382424@N00/5216424459/

http://www.flickr.com/photos/13382424@N00/5216424459/

WordPress at MIT

WordPress at MIT

• Becoming the platform of choice

WordPress at MIT

• Becoming the platform of choice• Free, flexible, easy, well-known

WordPress at MIT

• Becoming the platform of choice• Free, flexible, easy, well-known• Academic to administrative;

public and private

WordPress at MIT

• Becoming the platform of choice• Free, flexible, easy, well-known• Academic to administrative;

public and private• But... is it more than just a blog?

take WordPressbeyond the blog

three examples from MIT

Edgerton Digital CollectionsMIT Museum and MIT Edgerton Centerhttp://edgerton-digital-collections.org

http://edgerton-digital-collections.org

http://edgerton-digital-collections.org

12000 photos, 8000 notebook pagesDynamic custom UI and search

Transcriptions and commentsMetadata direct from museum data store

Global ShakespearesMIT Shakespeare Project

http://globalshakespeares.org



Rich custom metadataAll managed through WordPress

Dynamic searchCalls WordPress search via AJAX

DOM built client-side; data in localstorage

Educational Collaboration SpaceMIT Dept. of Mathematics, NSFmore info at http://ecs.mit.edu



Management of “File Groups”Content linked through tags

Notification by tags

WP beyond blogs?

WP beyond blogs?

• A solid foundation

WP beyond blogs?

• A solid foundation• Faster development cycle

WP beyond blogs?


• Cohesive structure and navigation

WP beyond blogs?


• Cohesive structure and navigation• A great community

WP beyond blogs?


• Cohesive structure and navigation• A great community• Plugins and themes you can use

CONTENT

CC-BY-NC-SA flickr.com/photos/bikeracer/6740232/

http://www.flickr.com/photos/bikeracer/6740232/

http://www.flickr.com/photos/bikeracer/6740232/

Details, details, details


• Navigation, permalinks, RSS


• Navigation, permalinks, RSS• User roles and permissions


• Navigation, permalinks, RSS• User roles and permissions• External data? AJAX-heavy UI?


• Navigation, permalinks, RSS• User roles and permissions• External data? AJAX-heavy UI?• Ask me about it. :)

take WordPressbeyond the blog

You customized WordPressfor a project.

what if...

CC-BY-NC-SA flickr.com/photos/slworking/1704538333

http://www.flickr.com/photos/slworking/1704538333


•they move servers...




•they move servers...•they want to reuse some of it...





•they want modifications...





•they want modifications...disaster!




take your codebeyond the hack

Abstraction!

Abstraction arises from the recognition of similarities between certain objects, situations, or processes in the real world and the decision to concentrate on these similarities and to ignore, for the time being, their differences.

— C.A.R. Hoare

Abstraction

Abstraction=

thinking about the more general problem

result=

result=

code that you and others can reuse

How?

Think abstractly

• Produce “functionalities”

Think abstractly

• Produce “functionalities”• One functionality = one plugin

Think abstractly

• Produce “functionalities”• One functionality = one plugin• Interrelated code can be

modularized

Think abstractly

• Produce “functionalities”• One functionality = one plugin• Interrelated code can be

modularized• introduce new hooks and filters

with do_action(), apply_filters()

Think abstractly

Use WP abstractions

Use WP abstractions

• DB query? $wpdb, not mysql_*

Use WP abstractions

• DB query? $wpdb, not mysql_*• Caching? Object Cache and

Transients API

Use WP abstractions

• DB query? $wpdb, not mysql_*• Caching? Object Cache and

Transients API• Options? set_option() not db

Use WP abstractions

Use WP abstractions• Posts? get_posts() not SQL

Use WP abstractions• Posts? get_posts() not SQL• Custom data? Custom taxonomy

or fields


or fields• New entities? Custom post types!


or fields• New entities? Custom post types!• External request?

wp_remote_post() not curl

© 2008 Drew and Natalie Dee, toothpastefordinner.com

Don’t reinvent the wheel.

Be mobile

• Don’t expect to be in a particular place

Be mobile


• Use __FILE__, plugins_url(), etc.

Be mobile


• Use __FILE__, plugins_url(), etc.• Get info with get_bloginfo()

Be mobile


• Use __FILE__, plugins_url(), etc.• Get info with get_bloginfo()• Use $wpdb so you can forget

about database settings

Be mobile

Be classy

Be classy• OOP is perfect for abstracting

“functionality”


“functionality”• Write your functionality as a

class with some defaults



class with some defaults• Easy for others to extend



class with some defaults• Easy for others to extend• Clean, legible code

Give yourself options


• Don’t hard code the project name, URLs, emails, etc.



• Bare minimum: declare as overrideable constants



• Bare minimum: declare as overrideable constants

• Ideally: create an options screen

Learn from the masters

• http://codex.wordpress.org


http://codex.wordpress.org


• http://codex.wordpress.org• Read others’ code.




• http://codex.wordpress.org• Read others’ code.• Borrow and adapt from other

plugins, themes, and the Core




• http://codex.wordpress.org• Read others’ code.• Borrow and adapt from other

plugins, themes, and the Core• “free as in freedom!”




CC-BY-NC xkcd.com/292/

Good practice matters

http://xkcd.com/292/

http://xkcd.com/292/

Results

• Won’t [Less likely to] break when you move or upgrade

Results


• Easier to maintain

Results


• Easier to maintain• Easier to build on

Results


• Easier to maintain• Easier to build on• Easier to reuse elsewhere

Results

More FTW = less WTF

take your codebeyond the hack

but wait, there’s more...

CC-BY-NC-SA flickr.com/photos/z6p6tist6/500048151/

http://www.flickr.com/photos/z6p6tist6/500048151/



is not a one way street.

Free software




is not a one way street.

WordPress



Think:

• You just customized WordPress for a client

Think:


• Others could benefit from this

Think:


• Others could benefit from this• You and the client have benefited

from free software: WordPress

Think:

Consider open-sourcing your client-requested

functionality.

take your codebeyond your site

Do people really do this?

success stories:

success stories:

My own work at MIT

Open source from MIT

• Shakespeare: Redirect by Custom Field, Require First and Last Name


• Shakespeare: Redirect by Custom Field, Require First and Last Name

• Educational Collaboration Space: File Groups, Distinct Preview, Allow LaTeX Uploads, Notifications By Tag, License


LicenseEducational Collaboration Space

LicenseEducational Collaboration Space

ECS and Shibboleth

ECS and Shibboleth

• Shibboleth authentication

ECS and Shibboleth

• Shibboleth authentication• now contributing to the pre-

existing Shibboleth plugin

ECS and Shibboleth

• Shibboleth authentication• now contributing to the pre-

existing Shibboleth plugin• MIT customizations can be

reused in other MIT projects

Brad Williamsco-founder, WebDevStudios.com

success stories:

Brad Williams

• NextGEN Public Uploader

Brad Williams

• NextGEN Public Uploader• Post Google Map

Brad Williams

• NextGEN Public Uploader• Post Google Map• sponsored by injersey.com

Brad Williams

Brad Williams

• no client has said no

Brad Williams

• no client has said no• many clients want to give back

Brad Williams

• no client has said no• many clients want to give back• plugins have brought in new

clients

Brad Williams

John James Jacobynow at Automattic

success stories:

BuddyPress Member Filterdevelopment supported by LOGOI Ministries

BuddyPress Edit Group Slugdevelopment supported by We Heart This

John James Jacoby

John James Jacoby• educate client about community

role and open-source


role and open-source• sometimes appropriate to just

open-source the backend w/o UI



open-source the backend w/o UI• community contributions got

him noticed



open-source the backend w/o UI• community contributions got

him noticed• BuddyPress Core, Automattic

Tips

Tips• bring up open-sourcing early

Tips• bring up open-sourcing early• if they say no, respect that

Tips• bring up open-sourcing early• if they say no, respect that• don’t pass cost back to client

Tips• bring up open-sourcing early• if they say no, respect that• don’t pass cost back to client• acknowledge the funding

Tips• bring up open-sourcing early• if they say no, respect that• don’t pass cost back to client• acknowledge the funding• don’t forget you can contribute

to existing projects as well

take your codebeyond your site



beyond the blog


beyond the blogbeyond the hack


beyond the blogbeyond the hackbeyond your site

Thank you!Questions?

Slides up on slideshare.net/mitcho.

mitcho (Michael 芳貴 Erlewine)

mitcho.com; @themitcho

http://mitcho.com/blog/

http://mitcho.com/blog/



Technology

Extending WordPress beyond!