Travis Hensgen: Introducing MasterPress

MasterPress is a commercial plugin for WordPress released in January 2013, that I have been building as a side-project for the past 2 years.

After a bit of background information about how the project came to be, you’ll see a demo build for a fictional restaurant website showing how MasterPress can quickly take a fresh installation of WordPress through to a highly customised dashboard containing multiple custom post types, taxonomies and custom fields.

We’ll then briefly explore how MasterPress lets you easily query your post types and bring custom field data into your WordPress themes, demonstrating its powerful and concise object-oriented API.

Transcript

1. Introducing MasterPress Travis Hensgen WordCamp Melbourne 2013 1
2. Introducing MasterPress - WordCamp Melbourne 2013 Project Background
3. Introducing MasterPress - WordCamp Melbourne 2013 2009: Hello WordPress Started with WordPress in 2009 WordPress before 3.0 was quite limited No Custom Post Types! I needed better custom fields, and some way to tie those to types of posts or templates Flutter by Freshout: “Custom Write Panels” and custom field types Then Flutter faded away, but it was forked to create another plugin called Magic Fields
4. Introducing MasterPress - WordCamp Melbourne 2013 2010: Magic Fields Mods Late 2010: Contributed User Interface tidy ups Just CSS, JavaScript, and PHP patches I was by no means a “plugin developer” Mods were okay, but I would have liked something better...
5. Introducing MasterPress - WordCamp Melbourne 2013 2010: Meanwhile... a better API Was also tinkering away with an object-oriented API wrapper around Magic Fields. Access to fields in Magic Fields wasn’t particularly intuitive: “Uh wait, what does that second 1 do again?” This work would come to be a major part of MasterPress Probably the most ambitious part <?php  echo  get('my_field',1  ,1  ,1,  14);  ?>
6. Introducing MasterPress - WordCamp Melbourne 2013 Time to build the dream plugin UI ideas from Magic Fields Object-Oriented API WordPress 3.2 (July 2011) and PHP 5.2 FTW! Custom Post Type and Taxonomy UI, rather than “Write Panels” A premium plugin with a whole lot of polish! Pro Tip: This book was a far better learning tool ... http://dramatica.com/analysis/field-of-dreams http://www.amazon.com/Professional-WordPress-Plugin- Development-Williams/dp/0470916222/
7. Introducing MasterPress - WordCamp Melbourne 2013 Pffffft. No worries. I’ve got heaps of time!
8. Introducing MasterPress - WordCamp Melbourne 2013 2011: Design... Spent a lot of time in Photoshop Needed to design: Over 20 Custom Field Types The custom field post editing experience About a week trying and trying again Admin Screens (over 15 of them) implements  Iterator
9. Introducing MasterPress - WordCamp Melbourne 2013 Design: Field Types - Image UI States Drop State Empty
10. Introducing MasterPress - WordCamp Melbourne 2013 Design: Field Types - Image UI States Populated Uploading
11. Introducing MasterPress - WordCamp Melbourne 2013 Design: Collapsed Field Set UI (Magic Fields)
12. Introducing MasterPress - WordCamp Melbourne 2013 Design: Collapsed Field Set UI (MasterPress - Photoshop Concept)
13. Introducing MasterPress - WordCamp Melbourne 2013 Design: Collapsed Field Set UI (MasterPress 1.0)
14. Introducing MasterPress - WordCamp Melbourne 2013 Making the solution seem so completely inevitable and obvious, so uncontrived and natural - it's so hard! Jonathon Ive
15. Introducing MasterPress - WordCamp Melbourne 2013 2011: Development Admin Screens Including a home-grown MVC plugin-UI framework 15+ Views, 10+ Models, 15+ Controllers Field Types - 20+, each comprising: Their own PHP API UI for field options + UI for post editing jQueryUI-based widget class for behaviour
16. Introducing MasterPress - WordCamp Melbourne 2013 2011: Development A whole lot of: git  commit means a lot of commitment
17. Introducing MasterPress - WordCamp Melbourne 2013 2011: Development A lot of late nights But... if you love what you’re doing, it really doesn’t feel like work Plus... I just learnt so much during http://himynameisjohnn.tumblr.com/post/18607151553 http://johnfpetraglia.authorsxpress.com/2012/08/
18. Introducing MasterPress - WordCamp Melbourne 2013 2011: Success! At the end of 2011, I thought I was just about there I had a great plug-in built, and was actively using it in client projects http://seriouslove.wordpress.com/2010/05/19/cheers/
19. Introducing MasterPress - WordCamp Melbourne 2013 Lucky too, because even more time had opened up!
20. Introducing MasterPress - WordCamp Melbourne 2013 2012: Products... argh Building things for others is hard Website and marketing materials Crazy amounts of documentation... 960 functions, about 50 long-form posts... Terms and conditions Legal Help + GPL = Tricky eCommerce, Merchant Accounts, and a licencing engine... Woo... Hoo...
21. Introducing MasterPress - WordCamp Melbourne 2013 2013: Made It! For Realz!
22. Introducing MasterPress - WordCamp Melbourne 2013 My Real Job 2011 - 2013 = A loooong build time But also threaded around development work that earnt money Thankfully, most of that work has made use of MasterPress. So its development has been driven by real needs in those projects.
23. Introducing MasterPress - WordCamp Melbourne 2013 Projects: World Economic Forum Forum:Blog http://forumblog.org A more traditional use of WordPress, but still with a few MasterPress enhancements.
24. Introducing MasterPress - WordCamp Melbourne 2013 Projects: World Economic Forum Reports http:// reports.weforum.org Long form reports. A much more advanced use of WordPress, with custom post types, custom taxonomies, and multisite.
25. Introducing MasterPress - WordCamp Melbourne 2013 Good developers eat their own...
26. Introducing MasterPress - WordCamp Melbourne 2013 Projects: MasterPress Website The MasterPress site itself is the most advanced project I’ve built with MasterPress. Post Types: Features, Pages, Field Types, Documentation, Classes, Methods, Releases, Prereleases, Products, Forums, Topics ... Taxonomies: Categories, Field Type Categories, Interfaces, Licence Types, Method Categories, Packages, Licences, Post Tags, ... Custom Fields: ... loads!
27. Introducing MasterPress - WordCamp Melbourne 2013 Hands-on Creating a restaurant site
28. Introducing MasterPress - WordCamp Melbourne 2013 Content Management setup: Post Types: Menu (list of food and drink items) Dish Drink Taxonomies: Menu Type Drink Type Dietary Notes
29. Introducing MasterPress - WordCamp Melbourne 2013 Custom Field Sets: Dish: Details: Description (Editor) Photo (Image) Price (Number) Dietary Notes (Taxonomy Term) Menu: Details: Description (Editor) Items (Related Posts)
30. Introducing MasterPress - WordCamp Melbourne 2013 Custom Field Sets: Dietary Notes (Taxonomy): Details: Abbreviation
31. Introducing MasterPress - WordCamp Melbourne 2013 Demo Creating our Masterplan http://www.flickr.com/photos/ultrakml/ Featuring photos by: Under Creative Commons Attribution-ShareAlike http://creativecommons.org/licenses/by-sa/2.0/deed.en Under Creative Commons Attribution-NonCommercial-ShareAlike http://creativecommons.org/licenses/by-nc-sa/2.0/deed.en http://www.flickr.com/photos/diekatrin/ Katrin Morenz Katherine Lim
32. Introducing MasterPress - WordCamp Melbourne 2013 Theme API Reimagining the WordPress API
33. Introducing MasterPress - WordCamp Melbourne 2013 WordPress API: first thoughts the_api() I didn’t really ... get_the_api()
34. Introducing MasterPress - WordCamp Melbourne 2013 WordPress API: observations Consistency Problems: Is it get_the_something($id), OR the_something($id,  $get_flag=TRUE) OR is there no way at all to “get” Lack of context, and uncertain global context: get_post_meta(  $post_id  ) need to use IDs a lot wp_reset_query()
35. Introducing MasterPress - WordCamp Melbourne 2013 To be fair: Global context is part of how WordPress works, allowing many sites to be built without developers. The API powers thousands of themes being created, distributed, and sold every day It is well documented and evolving every day WordPress core team... I still love you, please don’t hunt me down... http://simpsons.wikia.com/wiki/File:Simpsons_angry_mob.png
36. Introducing MasterPress - WordCamp Melbourne 2013 Theme API: Background I didn’t “set out” to build this from the get-go Started out as a way to access custom field data in Magic Fields Involved building wrapper objects around standard WordPress objects like posts, for example PHP 5 magic methods used to allow highly intuitive chained access to field sets and fields
37. Introducing MasterPress - WordCamp Melbourne 2013 Theme API: Background Liked using objects so much, that the scope of this initial work expanded: wrapper classes around Posts, Terms, Users, Sites (multi-site), Post Types, Taxonomies, User Roles, Images, Files, and even HTTP requests. Also includes powerful querying capabilities, with helpful collection classes Everything is accessed via a single instance variable
38. Introducing MasterPress - WordCamp Melbourne 2013 Theme API: Background Clever use of PHP5’s __toString()  to auto- convert echoed objects to values useful in the context of theme development (e.g. images = <img>) Design heavily inspired by jQuery Some interesting approaches to error handling and “silent failure” Allows powerful chaining capabilities A lot of utilities to solve common theming needs
39. Introducing MasterPress - WordCamp Melbourne 2013 Demo Building theme code for our restaurant site http://www.flickr.com/photos/ultrakml/ Featuring photos by: Under Creative Commons Attribution-ShareAlike http://creativecommons.org/licenses/by-sa/2.0/deed.en Under Creative Commons Attribution-NonCommercial-ShareAlike http://creativecommons.org/licenses/by-nc-sa/2.0/deed.en http://www.flickr.com/photos/diekatrin/ Katrin Morenz Katherine Lim
40. Introducing MasterPress - WordCamp Melbourne 2013 Questions?
41. Thanks! More Information (features, pricing): http://masterpressplugin.com Theme API: http://masterpressplugin.com/docs/developer Follow me (Travis Hensgen) on Twitter: @_traversal (note the leading underscore)