WordPress Child Theme Tutorial #4

This is part four of the WordPress Child Theme Generator tutorials. This tutorial series will give a full review of the generator and how to maximize your WordPress child theme.

In Part 4, You will learn how to begin customization of your own website using the child theme. We will take a look at the back-end code that allows you to customize your own site.

Make sure that you have watched tutorials 1-3 prior to watching part 4.

Next Tutorial:WordPress Child Theme Tutorial #5
Return to WordPress Child Theme Tutorial Main Page.

This content is covered in the video but is available here for those who like to read.

Now that you have your child theme installed and activated, you are ready to begin customizing your website.
The child theme that you installed comes premade with some code that you can use to make customizations on your site, and the child theme also gives you the flexibility to modify the existing code to suit your tastes and create your own customizations.

First, I need to explain exactly what the child theme is. The basic WordPress child theme is a piece of the website that’s called a cascading style sheet or CSS. This CSS is code that creates all of the styles on your website.

All WordPress Themes come with an existing CSS file and each time the theme is updated, the older files can be deleted and replaced. If customizations are made to the existing core CSS file, these customizations may be lost when the theme is updated.

The use of a child theme solves the problem of losing customizations to a website when a theme is updated.
Now let’s take a look at the child theme and a web page to see exactly what the child theme is doing.

From the WordPress dashboard, hover over the appearance tab, now click on the editor. From here, we’ll select the theme that we wanna look at. The theme we’ll select is our child theme which is titled “suffusion-child.” If it is not already selected, highlight it and then click select. This will bring the child theme up for editing.

On the right, you can see that the only file available for editing at this time is the “style.css” file. Other files can be added here, but for now, we’re gonna just stick with customizing the visual appearance of the site.

On the left, you can see the actual code that makes up the child theme file known as the CSS file. This is the code that was generated when you used the WordPress Child Theme Generator to create the child theme.
This section, tells the web browser to first read and style using your child theme and then to read and style using your actual theme. In this case, the browser will read the suffusion child theme CSS, and then it will read the suffusion theme CSS.

The rest of the code below is known as CSS code and is primarily what we will focus on in the next video.
In the next video, I will explain how this code can be used to customize and style your website in many fun and amazing ways.