Slide 1

Child Themes 101 Presentation by Jess Jacob

Slide 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 5/31/2014WordCamp Asheville 20142

Slide 3

Child Themes 101 The wrangler of two extremely fluffy, gray cats 5/31/2014WordCamp Asheville 20143 QuinlanSaoirse

Slide 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 whats already there 5/31/2014WordCamp Asheville 20144

Slide 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! 5/31/2014WordCamp Asheville 20145

Slide 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 5/31/2014WordCamp Asheville 20146

Slide 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 5/31/2014WordCamp Asheville 20147

Slide 8

Child Themes 101 Child themes make development Changes stick Updating the theme wont 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 5/31/2014WordCamp Asheville 20148

Slide 9

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

Slide 10

Child Themes 101 What Youll Need 5/31/2014WordCamp Asheville 201410

Slide 11

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

Slide 12

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

Slide 13

Child Themes 101 Where do you start? 5/31/2014WordCamp Asheville 201413

Slide 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/ Activate under Appearance in Dashboard Thats it! 5/31/2014WordCamp Asheville 201414

Slide 15

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 5/31/2014WordCamp Asheville 201415 Child Themes 101

Slide 16

Some Examples 5/31/2014WordCamp Asheville 201416

Slide 17

Home: Before the Child Theme 5/31/2014WordCamp Asheville 201417

Slide 18

5/31/2014WordCamp Asheville 201418 Home: After the Child Theme

Slide 19

5/31/2014WordCamp Asheville 201419 Blog: Before the Child Theme

Slide 20

5/31/2014WordCamp Asheville 201420 Blog: After the Child Theme

Slide 21

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 5/31/2014WordCamp Asheville 201421 Child Themes 101

Slide 22

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

Slide 23

Questions? 5/31/2014WordCamp Asheville 201423

Slide 24

Contact Me Jess Jacob jess@yourbestpageforward.com @jesswjacob