WordCampGR 2012: Developing Child-Theme Friendly Themes

10,255 views
9,041 views

Published on

Child Themes provide a great deal of power for the end user to modify and extend a Theme, and offload a considerable amount of development and support work for the developer. This presentation will cover the important aspects of developing a Theme with Child Theme-friendliness in mind, including proper referencing of bundled Theme resources, incorporating template action hooks, making Theme functions pluggable and filterable, and making Theme options extensible.

Published in: Technology
1 Comment
4 Likes
Statistics
Notes
No Downloads
Views
Total views
10,255
On SlideShare
0
From Embeds
0
Number of Embeds
211
Actions
Shares
0
Downloads
27
Comments
1
Likes
4
Embeds 0
No embeds

No notes for slide

WordCampGR 2012: Developing Child-Theme Friendly Themes

  1. Developing Child-Theme Friendly Themes Chip Bennett, WordCamp St. Louis, 18 August 2012 @chip_bennett
  2. Developing Child-Theme Friendly ThemesAudience: ● Developers ● Out of scope: how to create a child Theme ● http://codex.wordpress.org/Child_ThemesWhy Develop Child-Theme Friendly Themes?The Basics: ● Understand the Template Hierarchy ● Understand Template Directory vs Stylesheet DirectoryIntermediate: ● Template-part files ● Callback all the things in functions.phpAdvanced: ● Template content filters ● Extensible Theme Options 2 WordCamp Grand Rapids: 18 Aug 2012
  3. Why Develop Child-Theme Friendly Themes? “If you build it, they will come.”3 WordCamp Grand Rapids: 18 Aug 2012
  4. Developing Child-Theme Friendly ThemesWhy Simplify?● End-User Modification ● Developing Child-Theme Friendly Themes will facilitate end-user Theme modifications 4 WordCamp Grand Rapids: 18 Aug 2012
  5. Developing Child-Theme Friendly ThemesWhy Simplify?● End-User Modification ● Developing Child-Theme Friendly Themes will facilitate end-user Theme modifications● Support ● Developing Child-Theme Friendly Themes will lighten your support workload 5 WordCamp Grand Rapids: 18 Aug 2012
  6. Developing Child-Theme Friendly ThemesWhy Simplify?● End-User Modification ● Developing Child-Theme Friendly Themes will facilitate end-user Theme modifications● Support ● Developing Child-Theme Friendly Themes will lighten your support workload● Theme Maintenance ● Developing Child-Theme Friendly Themes will facilitate maintenance and and bug-fixing 6 WordCamp Grand Rapids: 18 Aug 2012
  7. Basics: Understand the Template Hierarchy Simplifying Theme template files7 WordCamp Grand Rapids: 18 Aug 2012
  8. Developing Child-Theme Friendly ThemesBasics: Understand the Template HierarchyWhat is theTemplateHierarchy? 8 WordCamp Grand Rapids: 18 Aug 2012
  9. Developing Child-Theme Friendly ThemesBasics: Understand the Template HierarchyWhat is theTemplateHierarchy?http://codex.wordpress.org/ Template_Hierarchy 9 WordCamp Grand Rapids: 18 Aug 2012
  10. Developing Child-Theme Friendly ThemesBasics: Understand the Template HierarchyDoes your template file listlook like this? 10 WordCamp Grand Rapids: 18 Aug 2012
  11. Developing Child-Theme Friendly ThemesBasics: Understand the Template HierarchyDoes your template file listlook like this?404.phparchive.phpattachment.phpauthor.phpcategory.phpdate.phpfront-page.phphome.phpindex.phpsearch.phptag.php 11 WordCamp Grand Rapids: 18 Aug 2012
  12. Developing Child-Theme Friendly ThemesBasics: Understand the Template HierarchyDoes your template file list Or perhaps this?look like this?404.phparchive.phpattachment.phpauthor.phpcategory.phpdate.phpfront-page.phphome.phpindex.phpsearch.phptag.php 12 WordCamp Grand Rapids: 18 Aug 2012
  13. Developing Child-Theme Friendly ThemesBasics: Understand the Template HierarchyDoes your template file list Or perhaps this?look like this?404.php index.phparchive.phpattachment.phpauthor.phpcategory.phpdate.phpfront-page.phphome.phpindex.phpsearch.phptag.php 13 WordCamp Grand Rapids: 18 Aug 2012
  14. Developing Child-Theme Friendly ThemesBasics: Understand the Template HierarchyDoes your template file list Or perhaps this?look like this?404.php index.phparchive.phpattachment.phpauthor.phpcategory.phpdate.phpfront-page.phphome.phpindex.phpsearch.phptag.phpConsider usingconditional tags 14 WordCamp Grand Rapids: 18 Aug 2012
  15. Developing Child-Theme Friendly ThemesBasics: Understand the Template HierarchyDoes your template file list Or perhaps this?look like this?404.php index.phparchive.phpattachment.phpauthor.phpcategory.phpdate.phpfront-page.phphome.phpindex.phpsearch.phptag.phpConsider using conditional Consider using template-tags part files. 15 WordCamp Grand Rapids: 18 Aug 2012
  16. Developing Child-Theme Friendly ThemesBasics: Understand the Template HierarchyKey Points 16 WordCamp Grand Rapids: 18 Aug 2012
  17. Developing Child-Theme Friendly ThemesBasics: Understand the Template HierarchyKey Points ● Dont include template files you dont need 17 WordCamp Grand Rapids: 18 Aug 2012
  18. Developing Child-Theme Friendly ThemesBasics: Understand the Template HierarchyKey Points ● Dont include template files you dont need ● Dont over-complicate conditional content in template files 18 WordCamp Grand Rapids: 18 Aug 2012
  19. Developing Child-Theme Friendly ThemesBasics: Understand the Template HierarchyKey Points ● Dont include template files you dont need ● Dont over-complicate conditional content in template files ● Use template-part files to keep DRY 19 WordCamp Grand Rapids: 18 Aug 2012
  20. Basics: Template vs Stylesheet Directory Whats in a name?20 WordCamp Grand Rapids: 18 Aug 2012
  21. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryStand-Alone Themes 21 WordCamp Grand Rapids: 18 Aug 2012
  22. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryStand-Alone Themes● Stylesheet directory and Template directory are the same 22 WordCamp Grand Rapids: 18 Aug 2012
  23. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryStand-Alone Themes● Stylesheet directory and Template directory are the same● Both correspond to the containing directory for the current Theme 23 WordCamp Grand Rapids: 18 Aug 2012
  24. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryStand-Alone Themes● Stylesheet directory and Template directory are the same● Both correspond to the containing directory for the current Theme● That is: the directory that contains style.css for the current Theme 24 WordCamp Grand Rapids: 18 Aug 2012
  25. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryStand-Alone Themes● Stylesheet directory and Template directory are the same● Both correspond to the containing directory for the current Theme● That is: the directory that contains style.css for the current ThemeChild Themes 25 WordCamp Grand Rapids: 18 Aug 2012
  26. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryStand-Alone Themes● Stylesheet directory and Template directory are the same● Both correspond to the containing directory for the current Theme● That is: the directory that contains style.css for the current ThemeChild Themes● Stylesheet directory 26 WordCamp Grand Rapids: 18 Aug 2012
  27. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryStand-Alone Themes● Stylesheet directory and Template directory are the same● Both correspond to the containing directory for the current Theme● That is: the directory that contains style.css for the current ThemeChild Themes● Stylesheet directory ● Corresponds to the containing directory for the current Theme 27 WordCamp Grand Rapids: 18 Aug 2012
  28. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryStand-Alone Themes● Stylesheet directory and Template directory are the same● Both correspond to the containing directory for the current Theme● That is: the directory that contains style.css for the current ThemeChild Themes● Stylesheet directory ● Corresponds to the containing directory for the current Theme ● That is: the directory that contains style.css for the current Theme 28 WordCamp Grand Rapids: 18 Aug 2012
  29. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryStand-Alone Themes● Stylesheet directory and Template directory are the same● Both correspond to the containing directory for the current Theme● That is: the directory that contains style.css for the current ThemeChild Themes● Stylesheet directory ● Corresponds to the containing directory for the current Theme ● That is: the directory that contains style.css for the current Theme● Template directory 29 WordCamp Grand Rapids: 18 Aug 2012
  30. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryStand-Alone Themes● Stylesheet directory and Template directory are the same● Both correspond to the containing directory for the current Theme● That is: the directory that contains style.css for the current ThemeChild Themes● Stylesheet directory ● Corresponds to the containing directory for the current Theme ● That is: the directory that contains style.css for the current Theme● Template directory ● Corresponds to the containing directory for the template (i.e. Parent) Theme 30 WordCamp Grand Rapids: 18 Aug 2012
  31. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryStand-Alone Themes● Stylesheet directory and Template directory are the same● Both correspond to the containing directory for the current Theme● That is: the directory that contains style.css for the current ThemeChild Themes● Stylesheet directory ● Corresponds to the containing directory for the current Theme ● That is: the directory that contains style.css for the current Theme● Template directory ● Corresponds to the containing directory for the template (i.e. Parent) Theme ● The template is defined in the current Themes style.css file, via the Template: <theme-name> header tag (e.g. Template: twentyeleven) 31 WordCamp Grand Rapids: 18 Aug 2012
  32. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryWhy does it matter? 32 WordCamp Grand Rapids: 18 Aug 2012
  33. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryWhy does it matter? ● Use Template directory for anything that should not be overridden by the Child Theme: 33 WordCamp Grand Rapids: 18 Aug 2012
  34. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryWhy does it matter? ● Use Template directory for anything that should not be overridden by the Child Theme: ● Theme options 34 WordCamp Grand Rapids: 18 Aug 2012
  35. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryWhy does it matter? ● Use Template directory for anything that should not be overridden by the Child Theme: ● Theme options ● Bundled resources (images, scripts, fonts, etc.) 35 WordCamp Grand Rapids: 18 Aug 2012
  36. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryWhy does it matter? ● Use Template directory for anything that should not be overridden by the Child Theme: ● Theme options ● Bundled resources (images, scripts, fonts, etc.) ● Default custom header/background image 36 WordCamp Grand Rapids: 18 Aug 2012
  37. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryWhy does it matter? ● Use Template directory for anything that should not be overridden by the Child Theme: ● Theme options ● Bundled resources (images, scripts, fonts, etc.) ● Default custom header/background image ● This, in the parent Theme functions.php, will break a child Theme: 37 WordCamp Grand Rapids: 18 Aug 2012
  38. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryWhy does it matter? ● Use Template directory for anything that should not be overridden by the Child Theme: ● Theme options ● Bundled resources (images, scripts, fonts, etc.) ● Default custom header/background image ● This, in the parent Theme functions.php, will break a child Theme: ● require_once( get_stylesheet_uri() . /options.php ); 38 WordCamp Grand Rapids: 18 Aug 2012
  39. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Stylesheet/Template Directory Functions vs Globals 39 WordCamp Grand Rapids: 18 Aug 2012
  40. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Stylesheet/Template Directory Functions vs GlobalsStylesheet Directory 40 WordCamp Grand Rapids: 18 Aug 2012
  41. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Stylesheet/Template Directory Functions vs GlobalsStylesheet DirectoryUse this:get_stylesheet_directory_uri() 41 WordCamp Grand Rapids: 18 Aug 2012
  42. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Stylesheet/Template Directory Functions vs GlobalsStylesheet DirectoryUse this:get_stylesheet_directory_uri()not this:STYLESHEETPATH 42 WordCamp Grand Rapids: 18 Aug 2012
  43. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Stylesheet/Template Directory Functions vs GlobalsStylesheet Directory Template DirectoryUse this:get_stylesheet_directory_uri()not this:STYLESHEETPATH 43 WordCamp Grand Rapids: 18 Aug 2012
  44. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Stylesheet/Template Directory Functions vs GlobalsStylesheet Directory Template DirectoryUse this: Use this:get_stylesheet_directory_uri() get_template_directory_uri()not this:STYLESHEETPATH 44 WordCamp Grand Rapids: 18 Aug 2012
  45. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Stylesheet/Template Directory Functions vs GlobalsStylesheet Directory Template DirectoryUse this: Use this:get_stylesheet_directory_uri() get_template_directory_uri()not this: not this:STYLESHEETPATH TEMPLATEPATH 45 WordCamp Grand Rapids: 18 Aug 2012
  46. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Stylesheet/Template Directory Functions vs GlobalsStylesheet Directory Template DirectoryUse this: Use this:get_stylesheet_directory_uri() get_template_directory_uri()not this: not this:STYLESHEETPATH TEMPLATEPATH The STYLESHEETPATH and TEMPLATEPATH globals are slated for deprecation: http://core.trac.wordpress.org/ticket/18298. 46 WordCamp Grand Rapids: 18 Aug 2012
  47. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Referencing Template Files 47 WordCamp Grand Rapids: 18 Aug 2012
  48. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Referencing Template Files● What about template-part files, or custom page templates? 48 WordCamp Grand Rapids: 18 Aug 2012
  49. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Referencing Template Files● What about template-part files, or custom page templates?● These files could be in either the parent, or the child, or both 49 WordCamp Grand Rapids: 18 Aug 2012
  50. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Referencing Template Files● What about template-part files, or custom page templates?● These files could be in either the parent, or the child, or both● WordPress provides smart include functions for these files: 50 WordCamp Grand Rapids: 18 Aug 2012
  51. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Referencing Template Files● What about template-part files, or custom page templates?● These files could be in either the parent, or the child, or both● WordPress provides smart include functions for these files: ● get_header()/get_footer()/get_sidebar() 51 WordCamp Grand Rapids: 18 Aug 2012
  52. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Referencing Template Files● What about template-part files, or custom page templates?● These files could be in either the parent, or the child, or both● WordPress provides smart include functions for these files: ● get_header()/get_footer()/get_sidebar() ● get_template_part() 52 WordCamp Grand Rapids: 18 Aug 2012
  53. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Referencing Template Files● What about template-part files, or custom page templates?● These files could be in either the parent, or the child, or both● WordPress provides smart include functions for these files: ● get_header()/get_footer()/get_sidebar() ● get_template_part() ● locate_template() 53 WordCamp Grand Rapids: 18 Aug 2012
  54. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Referencing Template Files● What about template-part files, or custom page templates?● These files could be in either the parent, or the child, or both● WordPress provides smart include functions for these files: ● get_header()/get_footer()/get_sidebar() ● get_template_part() ● locate_template()● All functions search both the Stylesheet directory and the Template directory 54 WordCamp Grand Rapids: 18 Aug 2012
  55. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Referencing Template Files● What about template-part files, or custom page templates?● These files could be in either the parent, or the child, or both● WordPress provides smart include functions for these files: ● get_header()/get_footer()/get_sidebar() ● get_template_part() ● locate_template()● Both functions search both the Stylesheet directory and the Template directory● Use get_*() functions in template files to include template-part files 55 WordCamp Grand Rapids: 18 Aug 2012
  56. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Referencing Template Files● What about template-part files, or custom page templates?● These files could be in either the parent, or the child, or both● WordPress provides smart include functions for these files: ● get_header()/get_footer()/get_sidebar() ● get_template_part() ● locate_template()● Both functions search both the Stylesheet directory and the Template directory● Use get_*() functions in template files to include template-part files● Use locate_template() in either template files or functional files 56 WordCamp Grand Rapids: 18 Aug 2012
  57. Developing Child-Theme Friendly ThemesBasics: Understand Template Directory vs. Stylesheet DirectoryNote: Referencing Template Files● What about template-part files, or custom page templates?● These files could be in either the parent, or the child, or both● WordPress provides smart include functions for these files: ● get_header()/get_footer()/get_sidebar() ● get_template_part() ● locate_template()● Both functions search both the Stylesheet directory and the Template directory● Use get_*() functions in template files to include template-part files● Use locate_template() in either template files or functional files● Lets take a look at template-part files. 57 WordCamp Grand Rapids: 18 Aug 2012
  58. Intermediate: Template-Part Files Because you always want to keep your Themes DRY58 WordCamp Grand Rapids: 18 Aug 2012
  59. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesThe locate_template() file-search cascade 59 WordCamp Grand Rapids: 18 Aug 2012
  60. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesThe locate_template() file-search cascade● locate_template(), and therefore all of the get_*() functions, look for files in a specific order: 60 WordCamp Grand Rapids: 18 Aug 2012
  61. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesThe locate_template() file-search cascade● locate_template(), and therefore all of the get_*() functions, look for files in a specific order: ● Stylesheet directory before Template directory 61 WordCamp Grand Rapids: 18 Aug 2012
  62. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesThe locate_template() file-search cascade● locate_template(), and therefore all of the get_*() functions, look for files in a specific order: ● Stylesheet directory before Template directory ● More-specific before less-specific 62 WordCamp Grand Rapids: 18 Aug 2012
  63. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesThe locate_template() file-search cascade● locate_template(), and therefore all of the get_*() functions, look for files in a specific order: ● Stylesheet directory before Template directory ● More-specific before less-specific● Example: get_template_part( loop, page ) 63 WordCamp Grand Rapids: 18 Aug 2012
  64. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesThe locate_template() file-search cascade● locate_template(), and therefore all of the get_*() functions, look for files in a specific order: ● Stylesheet directory before Template directory ● More-specific before less-specific● Example: get_template_part( loop, page ) ● Searches for loop-page.php in Stylesheet directory 64 WordCamp Grand Rapids: 18 Aug 2012
  65. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesThe locate_template() file-search cascade● locate_template(), and therefore all of the get_*() functions, look for files in a specific order: ● Stylesheet directory before Template directory ● More-specific before less-specific● Example: get_template_part( loop, page ) ● Searches for loop-page.php in Stylesheet directory ● Searches for loop-page.php in Template directory 65 WordCamp Grand Rapids: 18 Aug 2012
  66. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesThe locate_template() file-search cascade● locate_template(), and therefore all of the get_*() functions, look for files in a specific order: ● Stylesheet directory before Template directory ● More-specific before less-specific● Example: get_template_part( loop, page ) ● Searches for loop-page.php in Stylesheet directory ● Searches for loop-page.php in Template directory ● Searches for loop.php in Stylesheet directory 66 WordCamp Grand Rapids: 18 Aug 2012
  67. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesThe locate_template() file-search cascade● locate_template(), and therefore all of the get_*() functions, look for files in a specific order: ● Stylesheet directory before Template directory ● More-specific before less-specific● Example: get_template_part( loop, page ) ● Searches for loop-page.php in Stylesheet directory ● Searches for loop-page.php in Template directory ● Searches for loop.php in Stylesheet directory ● Searches for loop.php in Template directory 67 WordCamp Grand Rapids: 18 Aug 2012
  68. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesThe locate_template() file-search cascade● locate_template(), and therefore all of the get_*() functions, look for files in a specific order: ● Stylesheet directory before Template directory ● More-specific before less-specific● Example: get_template_part( loop, page ) ● Searches for loop-page.php in Stylesheet directory ● Searches for loop-page.php in Template directory ● Searches for loop.php in Stylesheet directory ● Searches for loop.php in Template directory● We can take advantage of this cascade to make our Themes more child-Theme friendly! 68 WordCamp Grand Rapids: 18 Aug 2012
  69. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesWhy Use Template-Part Files? 69 WordCamp Grand Rapids: 18 Aug 2012
  70. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesWhy Use Template-Part Files? ● Using template-part files ensures DRY 70 WordCamp Grand Rapids: 18 Aug 2012
  71. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesWhy Use Template-Part Files? ● Using template-part files ensures DRY ● “Core” template-part files 71 WordCamp Grand Rapids: 18 Aug 2012
  72. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesWhy Use Template-Part Files? ● Using template-part files ensures DRY ● “Core” template-part files – header.php: get_header() – footer.php: get_footer() – sidebar.php get_sidebar() 72 WordCamp Grand Rapids: 18 Aug 2012
  73. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesWhy Use Template-Part Files? ● Using template-part files ensures DRY ● “Core” template-part files ● Arbitrary template-part files 73 WordCamp Grand Rapids: 18 Aug 2012
  74. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesWhy Use Template-Part Files? ● Using template-part files ensures DRY ● “Core” template-part files ● Arbitrary template-part files – loop.php: get_template_part( loop ) 74 WordCamp Grand Rapids: 18 Aug 2012
  75. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesWhy Use Template-Part Files? ● Using template-part files ensures DRY ● “Core” template-part files ● Arbitrary template-part files – loop.php: get_template_part( loop ) – loop-header.php – loop-footer.php – post-header.php – post-content.php – post-footer.php 75 WordCamp Grand Rapids: 18 Aug 2012
  76. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesWhy Use Template-Part Files? ● Using template-part files ensures DRY ● Using template-part files allows more targeted child-Theme overrides of template content 76 WordCamp Grand Rapids: 18 Aug 2012
  77. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesWhy Use Template-Part Files? ● Using template-part files ensures DRY ● Using template-part files allows more targeted child-Theme overrides of template content ● Using template-part files allows for contextual child-Theme overrides of template content 77 WordCamp Grand Rapids: 18 Aug 2012
  78. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesHow to use template-part files 78 WordCamp Grand Rapids: 18 Aug 2012
  79. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesHow to use template-part files ● Basic usage: ● get_template_part( loop ); ● get_header(); 79 WordCamp Grand Rapids: 18 Aug 2012
  80. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesHow to use template-part files ● Basic usage: ● get_template_part( loop ); ● get_header(); ● Intermediate usage: ● get_template_part( loop, page ); ● get_header( page ); 80 WordCamp Grand Rapids: 18 Aug 2012
  81. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesHow to use template-part files ● Basic usage: ● get_template_part( loop ); ● get_header(); ● Intermediate usage: ● get_template_part( loop, page ); ● get_header( page ); ● Advanced usage: ● get_template_part( loop, theme_get_context() ); ● get_header( theme_get_context() ); 81 WordCamp Grand Rapids: 18 Aug 2012
  82. Developing Child-Theme Friendly ThemesIntermediate: Template-Part FilesHow to use template-part files ● Basic usage: ● get_template_part( loop ); ● get_header(); ● Intermediate usage: ● get_template_part( loop, page ); ● get_header( page ); ● Advanced usage: ● get_template_part( loop, theme_get_context() ); ● get_header( theme_get_context() ); ● PROTIP: wp-includes/template-loader.php 82 WordCamp Grand Rapids: 18 Aug 2012
  83. Intermediate: Callback All The Things Your Theme is a novel, Child Themes are fan fiction, and every plot should have a hook83 WordCamp Grand Rapids: 18 Aug 2012
  84. Developing Child-Theme Friendly ThemesIntermediate: Callback All The ThingsWhy use callbacks? 84 WordCamp Grand Rapids: 18 Aug 2012
  85. Developing Child-Theme Friendly ThemesIntermediate: Callback All The ThingsWhy use callbacks? ● Function calls not explicitly hooked into an action hook via callback will fire at after_setup_theme, which may not be the appropriate action hook for the function being called. 85 WordCamp Grand Rapids: 18 Aug 2012
  86. Developing Child-Theme Friendly ThemesIntermediate: Callback All The ThingsWhy use callbacks? ● Function calls not explicitly hooked into an action hook via callback will fire at after_setup_theme, which may not be the appropriate action hook for the function being called. ● Also, function calls not explicitly hooked into an action hook via callback cannot be overridden via remove_action(). 86 WordCamp Grand Rapids: 18 Aug 2012
  87. Developing Child-Theme Friendly ThemesIntermediate: Callback All The ThingsWhy use callbacks? ● Function calls not explicitly hooked into an action hook via callback will fire at after_setup_theme, which may not be the appropriate action hook for the function being called. ● Also, function calls not explicitly hooked into an action hook via callback cannot be overridden via remove_action(). ● By using callbacks appropriately, child Themes can more easily override parent-Theme functionality. 87 WordCamp Grand Rapids: 18 Aug 2012
  88. Developing Child-Theme Friendly ThemesIntermediate: Callback All The ThingsCallback all the things Before add_theme_support( custom-background ); add_theme_support( custom-header ); add_theme_support( automatic-feed-links ); add_theme_support( post-thumbnails ); register_nav_menus( array( header => Header Menu ) ); 88 WordCamp Grand Rapids: 18 Aug 2012
  89. Developing Child-Theme Friendly ThemesIntermediate: Callback All The ThingsCallback all the things Before add_theme_support( custom-background ); add_theme_support( custom-header ); add_theme_support( automatic-feed-links ); add_theme_support( post-thumbnails ); register_nav_menus( array( header => Header Menu ) ); After function themename_setup_theme() { add_theme_support( custom-background ); add_theme_support( custom-header ); add_theme_support( automatic-feed-links ); add_theme_support( post-thumbnails ); register_nav_menus( array( header => Header Menu ) ); } add_action( after_setup_theme, themename_setup_theme ); 89 WordCamp Grand Rapids: 18 Aug 2012
  90. Developing Child-Theme Friendly ThemesIntermediate: Callback All The ThingsCallback all the things Before register_sidebar( array( // Args array ) ); 90 WordCamp Grand Rapids: 18 Aug 2012
  91. Developing Child-Theme Friendly ThemesIntermediate: Callback All The ThingsCallback all the things Before register_sidebar( array( // Args array ) ); After function themename_widgets_init() { register_sidebar( array( // Args array ) ); } add_action( widgets_init, themename_widgets_init ); 91 WordCamp Grand Rapids: 18 Aug 2012
  92. Advanced: Template Content Filters Content modification more powerful than template-part files92 WordCamp Grand Rapids: 18 Aug 2012
  93. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersWhat is a template content filter? 93 WordCamp Grand Rapids: 18 Aug 2012
  94. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersWhat is a template content filter?● A template content filter is simply a custom Theme filter 94 WordCamp Grand Rapids: 18 Aug 2012
  95. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersWhat is a template content filter?● A template content filter is simply a custom Theme filter ● Example core filter: – echo apply_filters( the_content, $content ); 95 WordCamp Grand Rapids: 18 Aug 2012
  96. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersWhat is a template content filter?● A template content filter is simply a custom Theme filter ● Example core filter: – echo apply_filters( the_content, $content ); ● Example core filter modification: – function themename_filter_the_content( $content ) { return $content . <p>Yes, there really is a Kalamazoo.</p>; } 96 WordCamp Grand Rapids: 18 Aug 2012
  97. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersWhat is a template content filter?● A template content filter is simply a custom Theme filter ● Example core filter: – echo apply_filters( the_content, $content ); ● Example core filter modification: – function themename_filter_the_content( $content ) { return $content . <p>Yes, there really is a Kalamazoo.</p>; } add_filter( the_content, themename_filter_the_content ); 97 WordCamp Grand Rapids: 18 Aug 2012
  98. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersWhat is a template content filter?● A template content filter is simply a custom Theme filter● To use a template content filter, simply pass a static template text string through an apply_filters() call. 98 WordCamp Grand Rapids: 18 Aug 2012
  99. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersWhat is a template content filter?● A template content filter is simply a custom Theme filter● To use a template content filter, simply pass a static template text string through an apply_filters() call.● For example, site footer text: 99 WordCamp Grand Rapids: 18 Aug 2012
  100. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersWhat is a template content filter?● A template content filter is simply a custom Theme filter● To use a template content filter, simply pass a static template text string through an apply_filters() call.● For example, site footer text: ● © Site Name, proudly powered by WordPress, design by Theme Name 100 WordCamp Grand Rapids: 18 Aug 2012
  101. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersWhat is a template content filter?● A template content filter is simply a custom Theme filter● To use a template content filter, simply pass a static template text string through an apply_filters() call.● For example, site footer text: ● © Site Name, proudly powered by WordPress, design by Theme Name ● Instead of making a Theme option, use a filter: 101 WordCamp Grand Rapids: 18 Aug 2012
  102. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersWhat is a template content filter?● A template content filter is simply a custom Theme filter● To use a template content filter, simply pass a static template text string through an apply_filters() call.● For example, site footer text: ● © Site Name, proudly powered by WordPress, design by Theme Name ● Instead of making a Theme option, use a filter: – $footer_text = © Site Name, proudly powered by WordPress, design by Theme Name; 102 WordCamp Grand Rapids: 18 Aug 2012
  103. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersWhat is a template content filter?● A template content filter is simply a custom Theme filter● To use a template content filter, simply pass a static template text string through an apply_filters() call.● For example, site footer text: ● © Site Name, proudly powered by WordPress, design by Theme Name ● Instead of making a Theme option, use a filter: – $footer_text = © Site Name, proudly powered by WordPress, design by Theme Name; echo apply_filters( themename_footer_text, $footer_text ); 103 WordCamp Grand Rapids: 18 Aug 2012
  104. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersHow would a child Theme use a template content filter? 104 WordCamp Grand Rapids: 18 Aug 2012
  105. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersHow would a child Theme use a template content filter?● Using the site footer text example: 105 WordCamp Grand Rapids: 18 Aug 2012
  106. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersHow would a child Theme use a template content filter?● Using the site footer text example: ● The child Theme would include a callback and add_filter() call in functions.php, to modify the site footer text: 106 WordCamp Grand Rapids: 18 Aug 2012
  107. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersHow would a child Theme use a template content filter?● Using the site footer text example: ● The child Theme would include a callback and add_filter() call in functions.php, to modify the site footer text: – function childthemename_filter_site_text( $footer_text ) { $footer_text .= Yall come back now, hear?; return $footer_text; } 107 WordCamp Grand Rapids: 18 Aug 2012
  108. Developing Child-Theme Friendly ThemesAdvanced: Template Content FiltersHow would a child Theme use a template content filter?● Using the site footer text example: ● The child Theme would include a callback and add_filter() call in functions.php, to modify the site footer text: – function childthemename_filter_site_text( $footer_text ) { $footer_text .= Yall come back now, hear?; return $footer_text; } add_filter( themename_footer_text, childthemename_filter_site_text ); 108 WordCamp Grand Rapids: 18 Aug 2012
  109. Advanced: Extensible Theme Options Using the Settings API for fun and profit* * Profit not guaranteed109 WordCamp Grand Rapids: 18 Aug 2012
  110. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsWhy Bother With Extensible Theme Options? 110 WordCamp Grand Rapids: 18 Aug 2012
  111. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsWhy Bother With Extensible Theme Options?● For most of the same reasons for supporting child Themes 111 WordCamp Grand Rapids: 18 Aug 2012
  112. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsWhy Bother With Extensible Theme Options?● For most of the same reasons for supporting child Themes● To leverage your Settings API-compatible, DRY Theme options 112 WordCamp Grand Rapids: 18 Aug 2012
  113. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow to Use Extensible Theme Options 113 WordCamp Grand Rapids: 18 Aug 2012
  114. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow to Use Extensible Theme Options● Once again, use custom filters 114 WordCamp Grand Rapids: 18 Aug 2012
  115. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow to Use Extensible Theme Options● Once again, use custom filters● Assuming all of your Theme option parameters are contained in an array, returned by a function, this is easy: 115 WordCamp Grand Rapids: 18 Aug 2012
  116. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow to Use Extensible Theme Options● Once again, use custom filters● Assuming all of your Theme option parameters are contained in an array, returned by a function, this is easy: ● function themename_option_parameters() { $parameters = array( option_1 => array( // option parameter key=>value pairs ) ); return $parameters; } 116 WordCamp Grand Rapids: 18 Aug 2012
  117. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow to Use Extensible Theme Options● Simply replace this: ● return $parameters; 117 WordCamp Grand Rapids: 18 Aug 2012
  118. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow to Use Extensible Theme Options● Simply replace this: ● return $parameters;● ...with this: ● return apply_filters( themename_option_parameters, $parameters); 118 WordCamp Grand Rapids: 18 Aug 2012
  119. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow to Use Extensible Theme Options● Simply replace this: ● return $parameters;● ...with this: ● return apply_filters( themename_option_parameters, $parameters);● Now, a child Theme can easily add to, remove from, or modify all of your Theme options 119 WordCamp Grand Rapids: 18 Aug 2012
  120. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow would a Child Theme Use Extensible Theme Options? 120 WordCamp Grand Rapids: 18 Aug 2012
  121. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow would a Child Theme Use Extensible Theme Options?● Using the same callback/add_filter() pair in functions.php 121 WordCamp Grand Rapids: 18 Aug 2012
  122. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow would a Child Theme Use Extensible Theme Options?● Using the same callback/add_filter() pair in functions.php● Example #1, adding a new Theme option: 122 WordCamp Grand Rapids: 18 Aug 2012
  123. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow would a Child Theme Use Extensible Theme Options?● Using the same callback/add_filter() pair in functions.php● Example #1, adding a new Theme option: ● function childtheme_filter_option_parameters( $parameters ) { $parameters[option_name] = array( // option parameter key => value pairs ); return $parameters; } 123 WordCamp Grand Rapids: 18 Aug 2012
  124. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow would a Child Theme Use Extensible Theme Options?● Using the same callback/add_filter() pair in functions.php● Example #1, adding a new Theme option: ● function childtheme_filter_option_parameters( $parameters ) { $parameters[option_name] = array( // option parameter key => value pairs ); return $parameters; } add_filter( themename_option_parameters, childtheme_filter_option_parameters ); 124 WordCamp Grand Rapids: 18 Aug 2012
  125. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow would a Child Theme Use Extensible Theme Options?● Example #2, deleting a Theme option: 125 WordCamp Grand Rapids: 18 Aug 2012
  126. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow would a Child Theme Use Extensible Theme Options?● Example #2, deleting a Theme option: ● function childtheme_filter_option_parameters( $parameters ) { unset $parameters[option_name]; return $parameters; } add_filter( themename_option_parameters, childtheme_filter_option_parameters ); 126 WordCamp Grand Rapids: 18 Aug 2012
  127. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow would a Child Theme Use Extensible Theme Options?● Example #3, modifying an existing Theme option: 127 WordCamp Grand Rapids: 18 Aug 2012
  128. Developing Child-Theme Friendly ThemesAdvanced: Extensible Theme OptionsHow would a Child Theme Use Extensible Theme Options?● Example #3, modifying an existing Theme option: ● function childtheme_filter_option_parameters( $parameters ) { $parameters[option_name][default] = some new default value; return $parameters; } add_filter( themename_option_parameters, childtheme_filter_option_parameters ); 128 WordCamp Grand Rapids: 18 Aug 2012
  129. Feedback You’ve heard from me; now I want to hear from you129 WordCamp Grand Rapids: 18 Aug 2012
  130. Developing Child-Theme Friendly Themes Questions? 130 WordCamp Grand Rapids: 18 Aug 2012

×