Customizing WordPress Themes / Child Themes - WordCamp Savannah 2010

  • 4,913 views
Uploaded on

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 …

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.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
4,913
On Slideshare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
70
Comments
0
Likes
9

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. by sara cannon / sara-cannon.com / follow @saracannon Saturday, August 21, 2010
  • 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 that inherits the functionality of another theme, called the parent theme, and allows you to modify, or add to, the functionality of that parent theme. Saturday, August 21, 2010
  • 6. WHAT IS A CHILD THEME? USE A CHILD THEME TO: • Add to the theme’s functionality • Modify CSS/Design • Add Custom Templates / Post Types Saturday, August 21, 2010
  • 7. EXAMPLES OF CHILD THEMES Saturday, August 21, 2010
  • 8. TWENTYTEN Saturday, August 21, 2010
  • 9. SPEAKY BY WPBEGINNER PARENT THEME: TWENTYTEN Saturday, August 21, 2010
  • 10. HALE COUNTY HUMANE SOCIETY BY DAN GAVIN PARENT THEME: TWENTYTEN Saturday, August 21, 2010
  • 11. FD LAWFIRM BY SCOUT BRANDING PARENT THEME: TWENTYTEN Saturday, August 21, 2010
  • 12. WHY IS CHILD THEMING AN IMPORTANT PRACTICE? Saturday, August 21, 2010
  • 13. WHY CHILD THEME? • Updates to the Parent without overwriting CSS wp_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 THEME IT IS AS SIMPLE AS: • The parent theme in the themein 3.0!) (twentyten is already installed folder • A new directory in the theme folder for your child theme to live • Your new child theme CSS file Saturday, August 21, 2010
  • 16. TWENTYTEN Saturday, 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 Parent’s CSS file Saturday, August 21, 2010
  • 18. MAKING A CHILD THEME • Anyoverwritesto theprevious selectors file changes any new CSS child theme twentyten CSS: twentyten child CSS: Saturday, August 21, 2010
  • 19. MAKING A CHILD THEME Saturday, August 21, 2010
  • 20. MAKING A CHILD THEME CSS TIPS: • Keep in mind CSS Specificity http://www.smashingmagazine.com/2007/07/27/css-specificity- things-you-should-know/ • 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. NOT overwrite functions but ADDS does • Smart choice of a parent theme will have pluggable functions • Or hooks you canor remove_filter() remove_action() remove with Saturday, August 21, 2010
  • 22. RESOURCES: CODEX: http://codex.wordpress.org/Child_Themes CSS SPECIFICITY: http://www.smashingmagazine.com/2007/07/27/css-specificity- things-you-should-know/ MODIFYING THEMES: http://themeshaper.com/modify- wordpress-themes/ Saturday, August 21, 2010
  • 23. by sara cannon / sara-cannon.com / follow @saracannon Saturday, August 21, 2010