In this video, learn what a child theme is and when you should use one.
- [Instructor] Before we start working on our child theme, I want to make sure that we're talking about the same thing. You probably already know that in the WordPress world that themes control the look and feel of your site. So they'll control things like the layout and some of the bigger things in the layout are, how many columns do you want? One, two, three. Do you want a sidebar? Things like, how big is your header and what is included in that header? Themes also control how many menus you have and where they're located. The featured image and where those show up in a blog post. And how big your logo is and where it shows up. There's also a lot of smaller things, for example, do your blog posts show you who posted the article? And do they show you the date the article was posted? Themes also control the look and feel of your site. The look and feel are things like what colors you want on your site. Is it dark? Is it light? Or is it colorful? So these might specifically be things like, what do the headers on your page look like? What do the block quotes on your page look like? And of course what do your links look like? Themes control really big and important things as well as really small nuance things that you might not even notice. With a child theme you can change all of these. Child themes are designed to modify an existing theme. When a child theme modifies another theme, that theme is called the parent theme. If you're familiar with CSS or cascading style sheets, child themes work similarly, for example, in CSS you might say, all the text on the site should be red and in another CSS file you might say, all of the headers on the contact page should be blue. The way CSS is designed you can affect the outcome without changing the original file. So the original file could be updated and your CSS modification would remain intact. Child themes work the same way. It's possible for me to modify the look of the block quotes in my child theme, and the parent theme could be updated and my modifications can still say intact. If you're brand new to WordPress, this might not seem like a big issue but it's massively important. WordPress is constantly going through changes, there's lots of little tweaks in the background that you don't always notice and sometimes like with WordPress 5.O, they introduce a new way to edit your content and for it to display on the front end. If you designed your own theme from scratch, every time there's a new feature, you'd have to code it yourself. But with child themes you can modify a theme and your parent theme can update in the background so you can always have access to the newest features without having to code them yourself. So before we get going, I want to give you a very brief description of how child themes do this so you know what to expect as we go through the rest of this course. CSS is the easiest to explain. WordPress will load the parent's CSS file first and then it will load your child theme's CSS file. So you can write CSS in your child theme and because it's loaded later than the parent's CSS file your changes will still show up. Template files in WordPress control the HTML for a page and they have placeholders for the content. So you might have a template for a sidebar and you want to add extra HTML to that template. You can include a template in your child theme and WordPress will load your template instead of the parent theme's template. Function files control some of the programming that goes into your theme. In the WordPress world themes usually modify the content in the database in some small way before presenting that content. Your functions file will load before the parent theme's functions file and if your parent theme is designed correctly you can modify the parent theme's functions because they're pluggable. You don't have to understand exactly how all of these work right now. We'll get into the details of all of these throughout the course. I just wanted to give you an idea of how child themes are designed so you can edit as few files as possible to make huge changes and not have to worry about recoding everything.
- Setting up your development environment and editor
- Picking a parent theme
- Creating a child theme
- Including style sheets
- Creating and modifying styles
- Modifying functions
- Hooking functions
- Creating and modifying template files
- Adding menus and functionality
- Migrating theme files to a live WordPress site