Do you really need a Child Theme?

1. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Do you really  need a Child Theme?

2. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Bego Mario Garde Happy WordPress user since 7 years  Moderator in German support forums  General Translation Editor … and this is my first WordCamp session!

3. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Some general assumptions Don't hack WordPress Core. Never. Reasons: Updates overwrite your changes   Your site gets unmaintainable  Difﬁcult to provide support

4. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Some general assumptions Don't hack WordPress Themes. Reasons: Updates overwrite your changes   Your theme gets unmaintainable  Difﬁcult to provide support

5. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin The obvious solution Create a Child Theme! Reason: Updates don't overwrite your changes. Changes are easy to spot.  

6. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin The obvious solution Create a Child Theme! Reason: Updates don't overwrite your changes. Changes are easy to spot.   Well, sort of.

7. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin .php .js .css Child Theme What about security issues? .php .js .css Parent Theme .php We copy templates of a Parent Theme into the Child Theme and tweak them as needed. But what, if the Parent Theme had a bug or even security issues? The Child Theme Dilemma, T. Landsiedel   http://bit.ly/1SWpJFZ

8. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin .php .js .css Child Theme What about security issues? .php .js .css Parent Theme .php We copy templates of a Parent Theme into the Child Theme and tweak them as needed. But what, if the Parent Theme had a bug or even security issues? The Child Theme Dilemma, T. Landsiedel   http://bit.ly/1SWpJFZ

9. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin .php .js .css Child Theme What about security issues? .php .js .css Parent Theme .php While the Parent Theme gets ﬁxed by the theme developer, … the Child Theme keeps the bug.  (worst case: you don't even notice) The Child Theme Dilemma, T. Landsiedel   http://bit.ly/1SWpJFZ

10. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin .php .js .css Child Theme What about security issues? .php .js .css Parent Theme .php.php While the Parent Theme gets ﬁxed by the theme developer, … the Child Theme keeps the bug.  (worst case: you don't even notice) The Child Theme Dilemma, T. Landsiedel   http://bit.ly/1SWpJFZ

11. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin .php .js .css Child Theme Other issues? .php .js .css Parent Theme .php.php Theme developers may change function and class names. Worst Case: Your website shows an error message. Only. (That's when your client calls!) The Child Theme Dilemma, T. Landsiedel   http://bit.ly/1SWpJFZ

12. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Solution: Plugin Child Theme Check Plugin Child Theme Check  https://wordpress.org/plugins/child-theme-check/

13. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Parent Theme Child Theme Plugin Child Theme Check  https://wordpress.org/plugins/child-theme-check/

14. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Parent Theme Child Theme Plugin Child Theme Check  https://wordpress.org/plugins/child-theme-check/

15. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Plugin Child Theme Check Great idea, great tool, but … Theme Review Team not convinced   about version numbers in templates Changes still hard to maintain

16. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin More sites, more Child Themes Things get a little messy,   if you create a new Child Theme  for every new client. How do you manage all of them   after two months? After two years?

17. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin So… Do you really  need a Child Theme?

18. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Step 1  Check your Theme Options. Really.

19. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Photo "Strawberries" by @veeterzy, CC-0  https://unsplash.com/photos/OJJIaFZOeX4

20. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin https://wordpress.org/themes/twentysixteen

21. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin

22. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Theme options generally provide you with more options, than you realize. Play with them. Use them.

23. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Step 2  Plugins for Custom CSS

26. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Right Click ➞ Inspect Element Try any value Copy best result Developer Tools Chrome Developer Tools  https://developer.chrome.com/devtools

27. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin .site-header { padding: 0;  } .header-image { margin: 0 0 5em 0; img { width: 100%;  height: auto; } }

28. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Support for SASS Add-on or   Replacement Revisions Disables on   syntax errors Jetpack Plugin Jetpack  https://wordpress.org/plugins/jetpack/

29. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin One Trick Pony Easy and reliable No revisions No support for SASS Simple   Custom CSS Plugin Simple Custom CSS  https://wordpress.org/plugins/simple-custom-css/

30. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Need to style individual pages? No Problem! WordPress adds the right body Class body Class WP Codex: Function Reference/body class  http://bit.ly/1seFLBw

31. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Need to style individual pages? No Problem! WordPress adds the right body Class body Class WP Codex: Function Reference/body class  http://bit.ly/1seFLBw

32. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Step 3  Add your own functions

33. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Additional editor to add any function for front or back end Functions can be exported Error handling Code Snippets Plugin Code Snippets  https://wordpress.org/plugins/code-snippets/

34. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Replace pluggable functions Code Snippets if ( ! function_exists( 'twentysixteen_fonts_url' ) ) : Plugin Code Snippets  https://wordpress.org/plugins/code-snippets/

35. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Replace pluggable functions Code Snippets if ( ! function_exists( 'twentysixteen_fonts_url' ) ) : Plugin Code Snippets  https://wordpress.org/plugins/code-snippets/

37. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Error handling Plugin Code Snippets  https://wordpress.org/plugins/code-snippets/

38. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Error handling Plugin Code Snippets  https://wordpress.org/plugins/code-snippets/

39. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Plugin Code Snippets  https://wordpress.org/plugins/code-snippets/ Hooks   to the rescue Need to add a custom ﬁeld? You don't need custom templates.

40. Bego Mario Garde  @pixolin add_filter( 'the_content', 'append_cf_location' ); function append_cf_location( $content ) { $location = get_field( 'location' ); $out = $content .   '<div class="location">Location: <strong>' .   $location . '</strong></div>' ; return $out; } WordCamp Antwerp 2016

41. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Step 4  Create Shortcodes for your own PHP

42. Bego Mario Garde  @pixolin add_shortcode( 'portfolio', 'get_portfolio' );   function get_portfolio() { $portfolios = new WP_Query( 'post_type=portfolio' ); if ( $portfolios->have_posts() ) { while ( $portfolios->have_posts() ) { $portfolios->the_post(); $out .= get_the_title(); } } return $out; wp_reset_postdata(); } WordCamp Antwerp 2016

43. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Step 5  Bring your own JavaScript

44. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Loads frameworks Error handling Revisions Custom JavaScript Editor Plugin Custom JavaScript Editor  https://wordpress.org/plugins/custom-javascript-editor/

45. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Loads frameworks Error handling Revisions Custom JavaScript Editor Plugin Custom JavaScript Editor  https://wordpress.org/plugins/custom-javascript-editor/

46. Bego Mario Garde  @pixolin jQuery(document).ready(function($){  $('#smoothup').on('click', function(){  $('html, body').animate({scrollTop:0}, 'fast');  return false;  });  }); add_action('twentysixteen_credits', 'scroll_up_link');  function scroll_up_link() {  echo '<a href="#" id="smoothup" class="siteinfo"   title="Back to top">Back to Top / </a>';  } WordCamp Antwerp 2016 in plugin Code Snippets in plugin Custom JS Editor

47. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Step 6  Performance matters  Concatenate JavaScript and CSS

48. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Autoptimize Aggregates and minimizes JS, CSS and HTML Plugin Autoptimize  https://wordpress.org/plugins/autoptimize/

49. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Autoptimize Aggregates CSS and JavaScript 12 CSS files ➞ 1 CSS file  14 JavaScript files ➞ 1 JavaScript file

50. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin My personal Conclusion 

51. WordCamp Antwerp 2016 Bego Mario Garde  @pixolin Is it wrong to use Child Themes? Is it evil to use Child Themes? No. But you may have better alternatives. Dank u wel · Merci

Do you really need a Child Theme?

Do you really need a Child Theme?

Recommended

More Related Content

Viewers also liked

Viewers also liked(15)

Similar to Do you really need a Child Theme?

Similar to Do you really need a Child Theme?(20)

More from pixolin

More from pixolin(6)

Recently uploaded

Recently uploaded(20)

Do you really need a Child Theme?