Beyond Posts and Pages: Structured Content in WordPress


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

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Why do we need structured content? If we ever hope to get to adaptive content we need structure.
  • Arguably, by default, WordPress creates “blobs” – what does in to that big primary WYSIWYG editor is a mixture of headings, subheadings, callouts, images, and other content – but in a fully unstructured way.
  • But we do actually have some existing metadata: Date Categories Tags Title Excerpt Post Thumbnail / Featured Image Author info (based on the logged in user). Further, media “attached” to the post are tracked as a relationship in meta and can be pulled up, including post-thumbnail.
  • In this simple example, we get a custom post type for alerts but there isn’t really much complexity to it – otherwise it is mostly a blob. I do get to use the “date published” differently in the template
  • Meteor slides plugin uses Custom Post Types to enable management of slideshows
  • This is the code in the template itself – secondary html areas are mapped based on their names
  • Example showing custom taxonomies. Here we’ve created a custom post type of “Stories” – and added two custom taxonomies, one for Location and one for Topics.
  • Note: adding ‘ popular_items ’ => NULL, to the $labels array will suppress the “ tag cloud ” on the admin edit screen for the custom taxonomy
  • Note we’re checking here to see if the nonce is correctly set (prevent forged form submission)
  • Lengthy discussion about the future of WP – whether relationships between posts belongs in core or not. For now, there is the Posts2Posts plugin
  • 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@jeckman2
    3. 3. #CMSX #ChunkyWP@jeckman3
    4. 4. #CMSX #ChunkyWP@jeckman4
    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 platforms9
    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)16
    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)
    18. 18. #CMSX #ChunkyWP@jeckmanExample: Slides18
    19. 19. #CMSX #ChunkyWP@jeckmanExample: Meteor Slides19
    20. 20. #CMSX #ChunkyWP@jeckmanCode20
    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 Areas24
    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
    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@jeckmanAttachments35
    36. 36. #CMSX #ChunkyWP@jeckmanNotes• Search– WordPress search does not searchcustom post meta data– This means secondary html areas– 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
    40. 40. #CMSX #ChunkyWP@jeckmanResources• Plugins––– (part of premium toolset)–
    41. 41. #CMSX #ChunkyWP@jeckmanResources• Plugins–• Tools–