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.

WordPress as a CMS v2

6,291 views

Published on

Second iteration of my presentation on WordPress as a Content Management System

Published in: Technology, Business
  • Ignore the slide notes. They're inaccurate due to me duplicating slides and not updating the notes that go along with them.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

WordPress as a CMS v2

  1. 1. WordPress as a CMS
  2. 2. Contact Information <ul><li>http://mattwalters.net/ </li></ul><ul><li>http://twitter.com/mwalters/ </li></ul><ul><li>[email_address] </li></ul>
  3. 3. WordPress as a CMS <ul><ul><li>WordPress is </li></ul></ul><ul><ul><li>not just for </li></ul></ul><ul><ul><li>Blogging </li></ul></ul><ul><ul><li>(although it kicks ass at that too) </li></ul></ul>
  4. 4. WordPress as a CMS <ul><ul><li>Pages (with hierarchy) </li></ul></ul><ul><ul><li>Posts </li></ul></ul><ul><ul><ul><li>News Articles / Site Blog </li></ul></ul></ul><ul><ul><li>Themes, Plugins, Sidebars, Custom fields </li></ul></ul><ul><ul><li>Sidebars & Widgets </li></ul></ul><ul><ul><li>Handle various media (images, etc) </li></ul></ul><ul><ul><li>Ajax content </li></ul></ul>
  5. 5. WordPress as a CMS http://www.eye.fi/
  6. 6. WordPress as a CMS http://www.evsc.virginia.edu/
  7. 7. Shockoe Valley Heights WordPress as a CMS
  8. 8. WordPress as a CMS
  9. 10. Shockoe Valley Heights
  10. 12. WordPress as a CMS Shockoe Valley Heights
  11. 14. Shockoe Valley Heights
  12. 16. So how long does it take? <ul><li>Setup Procedures – 1.13 hours </li></ul><ul><ul><li>Local + Staging environment </li></ul></ul><ul><ul><li>Subversion Repository </li></ul></ul><ul><li>Theme Development – 6.01 hours </li></ul><ul><ul><li>PSD Cutup </li></ul></ul><ul><ul><li>Theme coding </li></ul></ul><ul><ul><li>Custom widgets </li></ul></ul><ul><ul><li>Cross browser testing </li></ul></ul>
  13. 17. Recommended Plugins <ul><li>WP Super Cache / W3 Total Cache Plugin </li></ul><ul><li>Akismet </li></ul><ul><li>Google Sitemap Generator </li></ul><ul><li>All In One SEO Pack </li></ul><ul><li>Analytics 360 </li></ul><ul><li>WordPress File Monitor </li></ul><ul><li>WordPress Backup / WP DB Backup </li></ul>
  14. 18. Theme Structure Anatomy of a Theme
  15. 19. Required Files <ul><li>Style.css </li></ul><ul><ul><li>Contains theme meta data </li></ul></ul><ul><ul><ul><li>Name </li></ul></ul></ul><ul><ul><ul><li>Author </li></ul></ul></ul><ul><ul><ul><li>etc... </li></ul></ul></ul><ul><ul><li>Can contain styling for site </li></ul></ul><ul><li>Index.php </li></ul><ul><ul><li>Logic / Display of content </li></ul></ul>
  16. 20. Theme Structure <ul><li>Functions.php </li></ul><ul><ul><li>Contains custom functionality for theme </li></ul></ul><ul><ul><li>Can be procedural or Object Oriented </li></ul></ul><ul><ul><li>Can include plugin-like code </li></ul></ul><ul><ul><ul><li>Create settings page in admin area </li></ul></ul></ul><ul><ul><ul><li>Apply filters </li></ul></ul></ul><ul><ul><ul><li>Perform actions </li></ul></ul></ul><ul><ul><ul><li>Bundle plugins with theme </li></ul></ul></ul><ul><ul><ul><li>etc... </li></ul></ul></ul>
  17. 21. Theme Structure Template Hierarchy Diagram
  18. 22. Theme Development Template Hierarchy Diagram
  19. 23. Theme Structure <ul><li>Child Themes </li></ul><ul><ul><li>Style.css </li></ul></ul><ul><ul><ul><li>Template: <define parent theme> </li></ul></ul></ul><ul><ul><li>Other fields are same as a parent theme </li></ul></ul><ul><ul><li>Child theme template files override that of parent theme </li></ul></ul><ul><ul><li>Parent templates are inherited by child theme </li></ul></ul>
  20. 24. Template Files <ul><li>Base template structure </li></ul><ul><ul><li>get_header() </li></ul></ul><ul><ul><ul><li>Includes header.php from theme directory </li></ul></ul></ul><ul><ul><li>The Loop </li></ul></ul><ul><ul><ul><li>Display content / perform logic </li></ul></ul></ul><ul><ul><li>get_sidebar() </li></ul></ul><ul><ul><ul><li>Includes sidebar.php from theme directory </li></ul></ul></ul><ul><ul><li>get_footer() </li></ul></ul><ul><ul><ul><li>Includes footer.php from theme directory </li></ul></ul></ul>
  21. 25. Template Files <ul><li>The Loop </li></ul><ul><ul><li>Required in template files to display dynamic content </li></ul></ul><ul><ul><li>Displays Posts/Pages </li></ul></ul><ul><ul><li>Provides easy access to content data </li></ul></ul><ul><ul><ul><li>the_title() </li></ul></ul></ul><ul><ul><ul><li>the_content() </li></ul></ul></ul><ul><ul><ul><li>the_excerpt() </li></ul></ul></ul><ul><ul><ul><li>the_permalink() </li></ul></ul></ul><ul><ul><ul><li>the_tags/category </li></ul></ul></ul><ul><ul><ul><li>etc ... </li></ul></ul></ul>
  22. 26. Data Storage <ul><li>Custom Fields </li></ul><ul><ul><li>Two Components </li></ul></ul><ul><ul><ul><li>Name / Value – Basically key/value pair </li></ul></ul></ul><ul><ul><li>Example Usage: </li></ul></ul><ul><ul><ul><li>Serve as a data source for Ajax content </li></ul></ul></ul><ul><ul><ul><li>Provide multiple content areas for a page </li></ul></ul></ul>
  23. 27. Data Storage <ul><li>Using Custom Fields </li></ul><ul><ul><li>get_post_meta($post_id, $key, [boolean]) </li></ul></ul><ul><ul><ul><li>$post_id = Primary key for Post/Page </li></ul></ul></ul><ul><ul><ul><li>$key = &quot;Name&quot; for custom field </li></ul></ul></ul><ul><ul><ul><li>[boolean] is optional </li></ul></ul></ul><ul><ul><ul><ul><li>True: Returns single string for $key </li></ul></ul></ul></ul><ul><ul><ul><ul><li>False: Returns array witch values for each $key matched </li></ul></ul></ul></ul>
  24. 28. Theme Considerations <ul><li>Front End Development Best Practices </li></ul><ul><ul><li>Keep CSS in one file included via <link> in the header </li></ul></ul><ul><ul><li>Keep Javascript in one file included in the footer </li></ul></ul><ul><ul><li>Use image sprites if possible </li></ul></ul><ul><ul><li>Use shorthand (padding vs padding-left/right) </li></ul></ul><ul><ul><li>Minify CSS/JavaScript if possible </li></ul></ul><ul><ul><li>Use appropriate compression for images </li></ul></ul>
  25. 29. Theme Resources <ul><ul><li>WordPress Codex </li></ul></ul><ul><ul><ul><li>http://codex.wordpress.org/ </li></ul></ul></ul><ul><ul><li>Best Practices for distributing themes </li></ul></ul><ul><ul><ul><li>Avoid packaging plugins </li></ul></ul></ul><ul><ul><ul><li>Support PHP 4 if possible :( </li></ul></ul></ul><ul><ul><ul><li>No paid advertisement </li></ul></ul></ul>
  26. 30. Theme Frameworks <ul><li>Carrington </li></ul><ul><ul><li>Takes context to the next level. </li></ul></ul><ul><ul><li>Under active development by reputable firm. </li></ul></ul><ul><li>Sandbox </li></ul><ul><ul><li>Easy to get started with. </li></ul></ul><ul><ul><li>Follows typical WordPress template structure. </li></ul></ul>
  27. 31. Repository Structure
  28. 32. Theme Development <ul><ul><li>Questions? </li></ul></ul><ul><ul><li>http://mattwalters.net/ </li></ul></ul><ul><ul><li>http://twitter.com/mwalters/ </li></ul></ul><ul><ul><li>[email_address] </li></ul></ul><ul><ul><li>(or funny jokes?) </li></ul></ul>

×