Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
#CMSX #ChunkyWP@jeckmanBeyond Posts & Pages:Structured Content inWordPressJohn EckmanISITE Design | CMS Myth
#CMSX #ChunkyWP@jeckman2http://www.isitedesign.com/
#CMSX #ChunkyWP@jeckman3http://delight.us/
#CMSX #ChunkyWP@jeckman4http://www.cmsmyth.com/
#CMSX #ChunkyWP@jeckmanShirts!5
#CMSX #ChunkyWP@jeckmanShirtsFirst five people to tweet:“Learning how to make WordPressChunky with @jeckman at #cmsx#chunk...
#CMSX #ChunkyWP@jeckmanAgenda• Why do we need structured content?• How does WordPress do it?– Metadata– Custom Post Types–...
#CMSX #ChunkyWP@jeckmanContent Strategy 2018
#CMSX #ChunkyWP@jeckmanAdaptive ContentFive Key Elements of AdaptiveContent:1.Reusable content– Content developed to maxim...
#CMSX #ChunkyWP@jeckmanAdaptive Content, Cont’d3. Presentation-independent content– Design decisions made by platformbased...
#CMSX #ChunkyWP@jeckmanWordPress Blobs11
#CMSX #ChunkyWP@jeckmanGetting chunkier12
#CMSX #ChunkyWP@jeckmanWordPress ChunksTo enhance structured content inWordPress, we need more:•Custom Post Types– Not jus...
#CMSX #ChunkyWP@jeckmanExample: Alerts14
#CMSX #ChunkyWP@jeckmanExample: Alerts15
#CMSX #ChunkyWP@jeckmanCode Example (Simple)16http://codex.wordpress.org/Function_Reference/register_post_type
#CMSX #ChunkyWP@jeckmanCode17Key is register_post_typeArguments passed control:•What to call it (Labels)•Where to show it–...
#CMSX #ChunkyWP@jeckmanExample: Slides18http://jleuze.com/plugins/meteor-slides/
#CMSX #ChunkyWP@jeckmanExample: Meteor Slides19
#CMSX #ChunkyWP@jeckmanCode20http://jleuze.com/plugins/meteor-slides/
#CMSX #ChunkyWP@jeckmanCode (Cont’d)21
#CMSX #ChunkyWP@jeckmanMore Complex Example• Client: Generation Citizen• Custom Post Type for “Stories”• Secondary HTML Ar...
#CMSX #ChunkyWP@jeckmanDemo – Stories page23
#CMSX #ChunkyWP@jeckmanSecondary HTML Areas24http://wordpress.org/extend/plugins/secondary-html-content/
#CMSX #ChunkyWP@jeckmanSecondary HTML areas25
#CMSX #ChunkyWP@jeckmanTaxonomiesCustom Post Types can be furtherenhanced with custom TaxonomiesIn this case that means:•R...
#CMSX #ChunkyWP@jeckman27Here we have a custom post type for“Stories” with two custom taxonomies:Locations and TopicsHere ...
#CMSX #ChunkyWP@jeckman28These Meta Boxes enable selection ofLocation / Topic from a pre-defined setThese Meta Boxes enabl...
#CMSX #ChunkyWP@jeckmanCustom Taxonomy Code29 http://codex.wordpress.org/Function_Reference/register_taxonomy
#CMSX #ChunkyWP@jeckmanShow Custom Meta Box30
#CMSX #ChunkyWP@jeckmanStyle Locations Box31
#CMSX #ChunkyWP@jeckmanSave on Submit32
#CMSX #ChunkyWP@jeckman33We’ve also got custom meta data here for:•Pull Quote•School•Teacher•Democracy Coaches
#CMSX #ChunkyWP@jeckmanCustom Meta Boxes• Process for these other meta boxesis similar:– add_meta_box() passed a stylingfu...
#CMSX #ChunkyWP@jeckmanAttachments35http://wordpress.org/extend/plugins/attachments/
#CMSX #ChunkyWP@jeckmanNotes• Search– WordPress search does not searchcustom post meta data– This means secondary html are...
#CMSX #ChunkyWP@jeckmanNotes37
#CMSX #ChunkyWP@jeckmanQ & A• Model content first• Find the tradeoff– More structure = more complexity– Less structure = l...
#CMSX #ChunkyWP@jeckman39Thank you.John EckmanISITE Design | CMS Mythwww.isitedesign.comwww.cmsmyth.com@jeckman
#CMSX #ChunkyWP@jeckmanResources• Plugins– http://wordpress.org/extend/plugins/advanced-custom-fields/– http://wordpress.o...
#CMSX #ChunkyWP@jeckmanResources• Plugins– http://wordpress.org/extend/plugins/posts-to-posts/• Tools– http://generatewp.c...
Upcoming SlideShare
Loading in …5
×

Beyond Posts and Pages: Structured Content in WordPress

5,243 views

Published on

How to use custom content types, taxonomies, and metadata to create structured content in WordPress

Published in: Technology, Business
  • Be the first to comment

Beyond Posts and Pages: Structured Content in WordPress

  1. 1. #CMSX #ChunkyWP@jeckmanBeyond Posts & Pages:Structured Content inWordPressJohn EckmanISITE Design | CMS Myth
  2. 2. #CMSX #ChunkyWP@jeckman2http://www.isitedesign.com/
  3. 3. #CMSX #ChunkyWP@jeckman3http://delight.us/
  4. 4. #CMSX #ChunkyWP@jeckman4http://www.cmsmyth.com/
  5. 5. #CMSX #ChunkyWP@jeckmanShirts!5
  6. 6. #CMSX #ChunkyWP@jeckmanShirtsFirst five people to tweet:“Learning how to make WordPressChunky with @jeckman at #cmsx#chunkyWP”6
  7. 7. #CMSX #ChunkyWP@jeckmanAgenda• Why do we need structured content?• How does WordPress do it?– Metadata– Custom Post Types– Custom Taxonomies• Examples– Basic: Slides, Alerts– Complex: Stories• Notes– Search– Controlling display– Relationships7
  8. 8. #CMSX #ChunkyWP@jeckmanContent Strategy 2018
  9. 9. #CMSX #ChunkyWP@jeckmanAdaptive ContentFive Key Elements of AdaptiveContent:1.Reusable content– Content developed to maximize reuse– Different formats/types available1.Structured content– Discrete chunks can be combined indifferent ways on different platforms9http://www.abookapart.com/products/content-strategy-for-mobile
  10. 10. #CMSX #ChunkyWP@jeckmanAdaptive Content, Cont’d3. Presentation-independent content– Design decisions made by platformbased on rules, not by authors3. Meaningful metadata– Metadata which can be used by theplatform to drive presentation rules3. Usable CMS interfaces– UI and workflow to encourage wellstructured and metadata-enhancedcontent10
  11. 11. #CMSX #ChunkyWP@jeckmanWordPress Blobs11
  12. 12. #CMSX #ChunkyWP@jeckmanGetting chunkier12
  13. 13. #CMSX #ChunkyWP@jeckmanWordPress ChunksTo enhance structured content inWordPress, we need more:•Custom Post Types– Not just “pages” and “posts”– Complex content types•Custom Taxonomies– Sort, categorize, relate•Custom Meta Data– More boxes for granular data13
  14. 14. #CMSX #ChunkyWP@jeckmanExample: Alerts14
  15. 15. #CMSX #ChunkyWP@jeckmanExample: Alerts15
  16. 16. #CMSX #ChunkyWP@jeckmanCode Example (Simple)16http://codex.wordpress.org/Function_Reference/register_post_type
  17. 17. #CMSX #ChunkyWP@jeckmanCode17Key is register_post_typeArguments passed control:•What to call it (Labels)•Where to show it– Public, Show UI, Searchable,has_archive– Menu position•Who can use it (capabilities)•What it includes (supports)http://codex.wordpress.org/Function_Reference/register_post_type
  18. 18. #CMSX #ChunkyWP@jeckmanExample: Slides18http://jleuze.com/plugins/meteor-slides/
  19. 19. #CMSX #ChunkyWP@jeckmanExample: Meteor Slides19
  20. 20. #CMSX #ChunkyWP@jeckmanCode20http://jleuze.com/plugins/meteor-slides/
  21. 21. #CMSX #ChunkyWP@jeckmanCode (Cont’d)21
  22. 22. #CMSX #ChunkyWP@jeckmanMore Complex Example• Client: Generation Citizen• Custom Post Type for “Stories”• Secondary HTML Areas• Custom Taxonomies: Locations,Topics• Custom Metadata• Attachments22
  23. 23. #CMSX #ChunkyWP@jeckmanDemo – Stories page23
  24. 24. #CMSX #ChunkyWP@jeckmanSecondary HTML Areas24http://wordpress.org/extend/plugins/secondary-html-content/
  25. 25. #CMSX #ChunkyWP@jeckmanSecondary HTML areas25
  26. 26. #CMSX #ChunkyWP@jeckmanTaxonomiesCustom Post Types can be furtherenhanced with custom TaxonomiesIn this case that means:•Register Taxonomy•Show custom meta box•Save on submit26
  27. 27. #CMSX #ChunkyWP@jeckman27Here we have a custom post type for“Stories” with two custom taxonomies:Locations and TopicsHere we have a custom post type for“Stories” with two custom taxonomies:Locations and Topics
  28. 28. #CMSX #ChunkyWP@jeckman28These Meta Boxes enable selection ofLocation / Topic from a pre-defined setThese Meta Boxes enable selection ofLocation / Topic from a pre-defined set
  29. 29. #CMSX #ChunkyWP@jeckmanCustom Taxonomy Code29 http://codex.wordpress.org/Function_Reference/register_taxonomy
  30. 30. #CMSX #ChunkyWP@jeckmanShow Custom Meta Box30
  31. 31. #CMSX #ChunkyWP@jeckmanStyle Locations Box31
  32. 32. #CMSX #ChunkyWP@jeckmanSave on Submit32
  33. 33. #CMSX #ChunkyWP@jeckman33We’ve also got custom meta data here for:•Pull Quote•School•Teacher•Democracy Coaches
  34. 34. #CMSX #ChunkyWP@jeckmanCustom Meta Boxes• Process for these other meta boxesis similar:– add_meta_box() passed a stylingfunction– style function outputs the htmlneeded– save function added to save_postaction– update_post_meta to store34
  35. 35. #CMSX #ChunkyWP@jeckmanAttachments35http://wordpress.org/extend/plugins/attachments/
  36. 36. #CMSX #ChunkyWP@jeckmanNotes• Search– WordPress search does not searchcustom post meta data– This means secondary html areas– http://wordpress.org/extend/plugins/relevanor other search• Display– You’ve customized the content so youcan’t rely on <?php the_content() ?>36
  37. 37. #CMSX #ChunkyWP@jeckmanNotes37
  38. 38. #CMSX #ChunkyWP@jeckmanQ & A• Model content first• Find the tradeoff– More structure = more complexity– Less structure = less flexibility• Focus on goals – why before how• Go forth and structure content!38
  39. 39. #CMSX #ChunkyWP@jeckman39Thank you.John EckmanISITE Design | CMS Mythwww.isitedesign.comwww.cmsmyth.com@jeckman
  40. 40. #CMSX #ChunkyWP@jeckmanResources• Plugins– http://wordpress.org/extend/plugins/advanced-custom-fields/– http://wordpress.org/extend/plugins/custom-content-type-manager/– http://wordpress.org/extend/plugins/types/ (part of premium toolset)– http://wordpress.org/extend/plugins/custom-post-type-ui/40
  41. 41. #CMSX #ChunkyWP@jeckmanResources• Plugins– http://wordpress.org/extend/plugins/posts-to-posts/• Tools– http://generatewp.com/post-type/41

×