Kathryn Presner
WordCamp Montreal 2014
@zoonini
#wcmtl	
  
Kathryn Presner
Happiness Engineer
Automattic Theme Team
https://www.flickr.com/photos/ben124/5396260658
https://www.flickr.com/photos/sackton/8258253775/
Brownies
Cream butter and sugar.
Beat in eggs and vanilla.
Add dry ingredients.
Spread in pan, bake at
350F for 30 min.
1 ...
Child theme = recipe variation
https://www.flickr.com/photos/snekse/399462304
Brownie Variations
Blondies
+ brown sugar - white sugar
Mint brownies
+ add mint extract - vanilla
Nutty brownies
+ nuts
D...
https://www.flickr.com/photos/handcoding/2117794703
Parent Theme
!=
Starter Theme
Why?
Why?
Faster development
Why?
Benefit from others' design, coding
Why?
Safer updates
Why not?
Why not?
Untangling others' code
Why not?
Can feel hacky
Why not?
Can be inefficient
http://wordpress.org/themes/
Sorbet
One-minute
child theme setup
For reals!
Setup
parent
Setup
parent
child
Setup
parent
child
Setup
parent
child
Setup
required file
style.css
style.css
Activate child theme
Import parent styles
in style.css
(or) Enqueue styles
in functions.php
https://www.flickr.com/photos/47741487@N06/7994654729
https://www.flickr.com/photos/healthcare4every1/3743271846
Template files
YES
Use child's file
NO
Use parent's file
Does template file exist in child theme?
and
so
on
...
content.php
content.php
content.php in parent
content.php in child
https://codex.wordpress.org/Post_Formats#Using_Formats
Create custom template
http://codex.wordpress.org/Page_Templates#Creating_a_Page_Template
https://www.flickr.com/photos/stefz/2159280574
Functions – loading order
1. Child's functions.php loaded
2. Parent's functions.php loaded
Duplicate functions
Hooks, actions, filters
https://www.flickr.com/photos/bonitoclub/7959426472
Remember this?
https://www.flickr.com/photos/nationalzoo/4368143044
Grandchild
themes?
https://www.flickr.com/photos/nationalzoo/4368143044
Resources
Child Themes – Codex
https://codex.wordpress.org/Child_Themes
Conditional Tags – Codex
http://codex.wordpress.or...
Resources
ThemeShaper
http://themeshaper.com
Replacing a filter in a Twenty Twelve Child
Theme
http://mikelittle.org/replac...
Credits
Presentation 
slideshare.net/zoonini
Kathryn Presner 
kpresner.com / Twitter: @zoonini
Fonts 
Arvo & Lato
Photos
F...
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Getting Comfortable With Child Themes - WordCamp Montreal
Upcoming SlideShare
Loading in...5
×

Getting Comfortable With Child Themes - WordCamp Montreal

2,160

Published on

Child themes are a simple but powerful way to customize a pre-made theme. Learning how to use them properly means you’ll never risk losing all your modifications when the developer releases a new version and you update the theme. Using easy-to-follow language, I’ll walk you through the steps to set up a child theme and we’ll get started making some tweaks – from CSS look-and-feel adjustments to more substantial changes in functionality.

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,160
On Slideshare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
0
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Getting Comfortable With Child Themes - WordCamp Montreal

  1. 1. Kathryn Presner WordCamp Montreal 2014 @zoonini #wcmtl  
  2. 2. Kathryn Presner Happiness Engineer Automattic Theme Team
  3. 3. https://www.flickr.com/photos/ben124/5396260658
  4. 4. https://www.flickr.com/photos/sackton/8258253775/
  5. 5. Brownies Cream butter and sugar. Beat in eggs and vanilla. Add dry ingredients. Spread in pan, bake at 350F for 30 min. 1 cup sugar ½ cup butter 2 eggs 1 tsp vanilla 1 cup flour ¼ cup cocoa ½ tsp. salt
  6. 6. Child theme = recipe variation https://www.flickr.com/photos/snekse/399462304
  7. 7. Brownie Variations Blondies + brown sugar - white sugar Mint brownies + add mint extract - vanilla Nutty brownies + nuts Double chocolate mini muffins + choc. chips +bake in mini-muffin tin
  8. 8. https://www.flickr.com/photos/handcoding/2117794703
  9. 9. Parent Theme != Starter Theme
  10. 10. Why?
  11. 11. Why? Faster development
  12. 12. Why? Benefit from others' design, coding
  13. 13. Why? Safer updates
  14. 14. Why not?
  15. 15. Why not? Untangling others' code
  16. 16. Why not? Can feel hacky
  17. 17. Why not? Can be inefficient
  18. 18. http://wordpress.org/themes/
  19. 19. Sorbet
  20. 20. One-minute child theme setup For reals!
  21. 21. Setup parent
  22. 22. Setup parent child
  23. 23. Setup parent child
  24. 24. Setup parent child
  25. 25. Setup required file
  26. 26. style.css
  27. 27. style.css
  28. 28. Activate child theme
  29. 29. Import parent styles in style.css
  30. 30. (or) Enqueue styles in functions.php
  31. 31. https://www.flickr.com/photos/47741487@N06/7994654729
  32. 32. https://www.flickr.com/photos/healthcare4every1/3743271846
  33. 33. Template files YES Use child's file NO Use parent's file Does template file exist in child theme?
  34. 34. and so on ...
  35. 35. content.php
  36. 36. content.php
  37. 37. content.php in parent
  38. 38. content.php in child https://codex.wordpress.org/Post_Formats#Using_Formats
  39. 39. Create custom template http://codex.wordpress.org/Page_Templates#Creating_a_Page_Template
  40. 40. https://www.flickr.com/photos/stefz/2159280574
  41. 41. Functions – loading order 1. Child's functions.php loaded 2. Parent's functions.php loaded
  42. 42. Duplicate functions
  43. 43. Hooks, actions, filters https://www.flickr.com/photos/bonitoclub/7959426472
  44. 44. Remember this?
  45. 45. https://www.flickr.com/photos/nationalzoo/4368143044
  46. 46. Grandchild themes? https://www.flickr.com/photos/nationalzoo/4368143044
  47. 47. Resources Child Themes – Codex https://codex.wordpress.org/Child_Themes Conditional Tags – Codex http://codex.wordpress.org/Conditional_Tags Functions – Codex https://codex.wordpress.org/Function_Reference/
  48. 48. Resources ThemeShaper http://themeshaper.com Replacing a filter in a Twenty Twelve Child Theme http://mikelittle.org/replacing-a-filter-in-a-twenty-twelve- child-theme/ Creating Grandchild Themes http://docs.appthemes.com/tutorials/creating-grandchild- themes/
  49. 49. Credits Presentation slideshare.net/zoonini Kathryn Presner kpresner.com / Twitter: @zoonini Fonts Arvo & Lato Photos Flickr – Creative Commons Cat photos – K. "Crazy Cat Lady" Presner

×