Customizing WordPress Themes / Child Themes - WordCamp Savannah 2010

Download Customizing WordPress Themes / Child Themes - WordCamp Savannah 2010

Post on 27-Jan-2015




0 download

Embed Size (px)


Interested in customizing themes to fit your needs and design? We'll be using the new default WordPress theme Twentyten as a base for looking at best practices and how to's for theme customization. We will demonstrate how to make a child theme and what are some good standard practices that you should know to keep your new theme healthy and update-able in order to save you time as well as keep it relevant in the future.


<ul><li> 1. by sara cannon / / follow @saracannon Saturday, August 21, 2010 </li></ul> <p> 2. LOVE A THEME BUT WANT TO CUSTOMIZE IT?No Problem! Saturday, August 21, 2010 3. CHILD THEMES TO THE RESCUE! Saturday, August 21, 2010 4. WHAT IS A CHILD THEME? (and why should I use it?) Saturday, August 21, 2010 5. WHAT IS A CHILD THEME?WORDPRESS CODEX:A WordPress child theme is a theme thatinherits the functionality of another theme,called the parent theme, and allows you tomodify, or add to, the functionality of thatparent theme. Saturday, August 21, 2010 6. WHAT IS A CHILD THEME?USE A CHILD THEME TO: Add to the themes functionality Modify CSS/Design Add Custom Templates / Post TypesSaturday, August 21, 2010 7. EXAMPLES OF CHILD THEMES Saturday, August 21, 2010 8. TWENTYTENSaturday, August 21, 2010 9. SPEAKY BY WPBEGINNERPARENT THEME: TWENTYTEN Saturday, August 21, 2010 10. HALE COUNTY HUMANE SOCIETY BY DAN GAVINPARENT THEME: TWENTYTEN Saturday, August 21, 2010 11. FD LAWFIRM BY SCOUT BRANDINGPARENT THEME: TWENTYTEN Saturday, August 21, 2010 12. WHY IS CHILD THEMING ANIMPORTANT PRACTICE? Saturday, August 21, 2010 13. WHY CHILD THEME? Updates to the Parent withoutoverwriting CSSwp_list_pages(); to wp_nav_menu(); Parental updates = longevity Saves time in the long run Saturday, August 21, 2010 14. HOW DO I MAKE MY OWN CHILD THEME? Saturday, August 21, 2010 15. MAKING A CHILD THEMEIT IS AS SIMPLE AS: The parent theme in the themein 3.0!)(twentyten is already installedfolder A new directory in the theme folder foryour child theme to live Your new child theme CSS file Saturday, August 21, 2010 16. TWENTYTENSaturday, August 21, 2010 17. MAKING A CHILD THEME CHILD THEME CSS FILE: Make a new CSS File Edit the CSS header to say: IMPORT the Parents CSS fileSaturday, August 21, 2010 18. MAKING A CHILD THEME Anyoverwritesto theprevious selectorsfile changesanynew CSS child theme twentytenCSS:twentytenchild CSS: Saturday, August 21, 2010 19. MAKING A CHILD THEME Saturday, August 21, 2010 20. MAKING A CHILD THEMECSS TIPS: Keep in mind CSS Specificity More specific = WIN! Firebug Firefox Plugin Saturday, August 21, 2010 21. MAKING A CHILD THEME CHILD THEME FUNCTIONS FILE: Unlike style.css... functions.phpto it. NOToverwrite functions but ADDSdoes Smart choice of a parent theme will havepluggable functions Or hooks you canor remove_filter()remove_action() remove withSaturday, August 21, 2010 22. RESOURCES: CODEX: SPECIFICITY: things-you-should-know/ MODIFYING THEMES: Saturday, August 21, 2010 23. by sara cannon / / follow @saracannon Saturday, August 21, 2010 </p>