1 / 24

Child Themes 101

Child Themes 101. Presentation by Jess Jacob. Child Themes 101. Who am I? Jess Jacob Freelance front end web developer Callcenter dialer programmer Writer and organizer of groups for local writers And finally…. Child Themes 101. The wrangler of two extremely fluffy, gray cats. Quinlan.

clover
Download Presentation

Child Themes 101

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Child Themes 101 Presentation by Jess Jacob

  2. Child Themes 101 • Who am I? • Jess Jacob • Freelance front end web developer • Callcenter dialer programmer • Writer and organizer of groups for local writers • And finally… WordCamp Asheville 2014

  3. Child Themes 101 • The wrangler of two extremely fluffy,gray cats Quinlan Saoirse WordCamp Asheville 2014

  4. Child Themes 101 • What is a child theme? • A customization of an existing theme • Think of it like a car • Getting a new paint job • Structure the same • Just changes to what’s already there WordCamp Asheville 2014

  5. Child Themes 101 • What is a child theme NOT? • Not a custom theme • Not always the best solution • But in many cases, I think yes! WordCamp Asheville 2014

  6. Child Themes 101 • Why use a child theme? • Wordpress themes are great • Not always what we want out of the box • Child themes allow you to • Quickly change • Link color, font size, content dimensions, etc • Leave original theme untouched WordCamp Asheville 2014

  7. Child Themes 101 • Child themes make development • Faster • Less clicking between screens and pages • Custom themes take a lot of time • Modular • Less hunting to find the changes you made • Everything is in one place WordCamp Asheville 2014

  8. Child Themes 101 • Child themes make development • Changes stick • Updating the theme won’t delete your changes • Stay current and maintain your work! • Cost effective • Speeds up the development process • Saves you time (and your client money) • Go live faster WordCamp Asheville 2014

  9. Child Themes 101 What if I'm only doing this for myself and not clients? Should I still bother with child themes? YES WordCamp Asheville 2014

  10. Child Themes 101 What You’ll Need WordCamp Asheville 2014

  11. Child Themes 101 • FTP Client (free) • FileZilla • Windows and Mac • https://filezilla-project.org/ • Yummy FTP • Mac only • Download from App Store WordCamp Asheville 2014

  12. Child Themes 101 • Text Editor (free) • Notepad++ • Windows • http://notepad-plus-plus.org/ • TextWrangler • Mac • Download from App Store WordCamp Asheville 2014

  13. Child Themes 101 Where do you start? WordCamp Asheville 2014

  14. Child Themes 101 • Find a theme to modify • e.g. Twenty Thirteen • Determine customizations you want to make • Create your stylesheet • style.css • Upload to your server • /wp-content/themes/<child theme folder> • Activate under Appearance in Dashboard • That’s it! WordCamp Asheville 2014

  15. Child Themes 101 • Not limited to just CSS changes • Page templates • functions.php • Customize existing functions • Create your own • Add additional widget areas • Must then call in a custom page template WordCamp Asheville 2014

  16. Some Examples WordCamp Asheville 2014

  17. Home: Before the Child Theme WordCamp Asheville 2014

  18. Home: After the Child Theme WordCamp Asheville 2014

  19. Blog: Before the Child Theme WordCamp Asheville 2014

  20. Blog: After the Child Theme WordCamp Asheville 2014

  21. Child Themes 101 • How to determine what changes to make? • Your new best friend: Inspect Element • Available in Chrome, Safari, and Firefox • Right click an element then click “Inspect Element” • Preview changes • When happy, just add to your style.css and upload • Can do HTML changes but best for just CSS WordCamp Asheville 2014

  22. Helpful links to get started • https://codex.wordpress.org/Child_Themes • http://codex.wordpress.org/Page_Templates Download this presentation www.yourbestpageforward.com/ wordcamp2014/ChildThemes101.pptx WordCamp Asheville 2014

  23. Questions? WordCamp Asheville 2014

  24. Contact Me Jess Jacob jess@yourbestpageforward.com @jesswjacob

More Related