#nyc12: Hacking WordPress in the Newsroom

This morning, I gave the second of three CMA NYC sessions I’m leading this week:

You publish with WordPress, are comfortable with editing theme templates and making basic CSS changes, and you’re ready to take your site to the next level. Join Daniel Bachhuber, code wranger for Automattic’s WordPress.com VIP, to learn what you need to know. We’ll discuss topics like version control, performance and optimization, debugging, and other development best practices. This session will be geared towards the tech-savvy with a practical knowledge of WordPress.

It ended up being a little less ambitious. We started out with (the importance of) setting up a local environment, reviewed what makes a plugin, and introduced a few project ideas. Between a dozen and two dozen students attended; for almost all, the information was completely new.

The most important note on this subject: there are lots of jobs available.

Also, come hit us up with WordPress questions at our Happiness Bar!

Session notes are below the slides.

Do it locally

• Set up a sandbox
  • MAMP is an awesome way to get going on a Mac and there’s a way for Windows too
  • Sequel Pro allows you to easily access your database
  • Use ‘ack’ to find functions
    • Example: ack –before-context=10 –ignore-dir=wp-admin ‘function esc_’
    • Code is gospel. You might read tutorials or examples on the web that say one thing or the other; code will tell you the truth.
    • Reading code is a literacy of WordPress development. Dive into it to figure out what’s going on.
• Learn how to properly debug – fix those bugs as they’re happening
  • Enable WP_DEBUG in your local environment
    • It’s a quick and easy way to see what’s going wrong with your code for fatal errors
    • See PHP notices and other things you might normally miss
    • Make sure you’re using the best WordPress functions for the job
  • “5 ways to debug WordPress” and “Debugging WordPress” – Andrew Nacin
• Commit to version control and deploy to production
  • Why?
    • More easily communicate the changes you’re making with the rest of your team.
    • Work on multiple features at the same time.
    • Roll back if necessary; better than backups.
    • Automated deployment — no more copy and pasting over FTP.
  • What makes a good commit message:
    • Consider your audience: writing for coworkers and for historical purposes.
    • Explain why you made the change, not what it was. What it was should be self-explanatory from the code
    • Link to Trac tickets or other relevant conversation.

Anatomy of a plugin

• First, a quick introduction to PHP
  • functions, variables, and how the code is executed
• What are plugins then?
  • Description
  • Functions and variables
  • Do something useful
• How to audit a plugin
  • Reviewing on WordPress.org
    • Compatible with most recent version of WordPress?
    • Regular release cycle with clear changelog
    • Positive dialog in the WordPress.org forums
    • Reputable plugin author has other plugins released
    • Licensed under the GPL
  • Install it locally and test it out. Make sure it does what you want it to do.
  • Formal code review?
    • Follows best practices and coding standards
    • Uses core APIs and the proper hook
    • Secure and performant
  • Common problems with plugins
    • Doesn’t do what you need it to
    • Plays poorly with the rest of your site
    • Performance problems with queries or remote requests
    • Security holes
• How to write your own plugin

What to do?

• Making your design responsive across many screens
  • What is responsive design?
    • Design for many different browser widths
    • Different than creating a mobile-specific website
  • Examples
    • Smashing Magazine: http://www.smashingmagazine.com/
    • BU Pipe Dream: http://www.bupipedream.com/
• Multi-format publishing (post formatsand custom post types)
  • Post formats:
    • Customize the presentation of your content based on the type of content
    • Types include links, galleries, videos, statuses, audio, etc.
  • Custom post types allow you define arbitrary content types
  • Examples:
    • ONA11 conference website uses custom post types and post formats: http://ona11.journalists.org/sessions/friday-lunch-keynote-a-conversation-on-the-front-lines-of-the-arab-revolution/
    • WSJ Story Streams: http://stream.wsj.com/story/oscars-2012/SS-2-112/
• Moar plugins!
  • Edit Flow
  • Zoninator
  • JSON API
• Multisite blog network
  • Let students create sites for their organizations, etc.
  • Quick introduction to multisite
• Follow the five tenets to mastering WordPress development
• Read others’ code and have others read yours; work in public on Github