How To: WordPress Child Themes

Installing a child theme in a WordPress website is a smart way to make customizations to a theme without losing the ability to update the parent theme. Here’s a step-by-step guide to manually create and activate a child theme:

Step 1: Create a Child Theme Directory

1. Access Your Site’s Files: Use an FTP client or your hosting provider’s file manager to access your WordPress site’s files.
2. Navigate to the Themes Directory: Go to wp-content/themes/.
3. Create a New Folder: Make a new folder for your child theme. It’s a good practice to name it after the parent theme with -child appended. For example, if your parent theme is twentytwentyone, name the child theme twentytwentyone-child.

Step 2: Create a Stylesheet for the Child Theme

1. Create a Style Sheet File: Inside the child theme folder, create a new file named style.css.
2. Add Theme Details: Open style.css and add the following information at the top:

CSS

/* Theme Name: Twenty Twenty-One Child Theme URI: http://example.com/twenty-twenty-one-child/ Description: Twenty Twenty-One Child Theme Author: Your Name Author URI: http://example.com Template: twentytwentyone Version: 1.0.0 */

Replace the details with your own, especially the Template, which should match the parent theme’s directory name.

3. Import Parent Theme Styles (Optional): To inherit the parent theme’s styles, add the following line of code after the header comments in your child theme’s style.css:

css

@import url("../twentytwentyone/style.css");

Note: The recommended way to enqueue parent theme styles is through a function in the functions.php file, as the @import method is slower.

Step 3: Create a Functions.php File

1. Create the File: Inside your child theme folder, create a file named functions.php.
2. Add PHP Opening Tag: Open functions.php and add the following PHP opening tag at the top:

php

<?php

3. Enqueue Parent and Child Theme Styles: Add the following code to properly enqueue your parent and child theme stylesheets:

PHP

add_action( 'wp_enqueue_scripts', 'my_child_theme_styles' ); function my_child_theme_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' ); wp_enqueue_style( 'child-style', get_stylesheet_uri(), array( 'parent-style' ) ); }

Step 4: Activate the Child Theme

1. Log In to Your WordPress Dashboard: Go to your site’s admin area.
2. Navigate to Appearance > Themes: You’ll see your child theme listed among the available themes.
3. Activate the Child Theme: Hover over the child theme and click the ‘Activate’ button.

Step 5: Customize Your Child Theme

• Now that your child theme is active, you can safely make customizations without affecting the parent theme. This includes adding custom CSS, modifying PHP templates, and more.

By following these steps, you’ll have successfully created and activated a child theme in WordPress, allowing for safer customizations and easier updates.

Using Prebuilt Child Themes

Many premium or custom WordPress themes come with a prebuilt child theme included. This is often provided as a separate .zip file alongside the main theme files, sometimes within a documentation folder or directly downloadable from the theme provider’s website. Utilizing a prebuilt child theme can save time and ensures that you’re using a child theme configured specifically to work well with the parent theme.

Step 1: Locate the Child Theme Zip File

• If your theme came with a prebuilt child theme, locate the .zip file. This might be within the theme’s documentation, on the theme provider’s website, or included in the theme purchase package.

Step 2: Install the Child Theme Through WordPress Dashboard

1. Log into Your WordPress Dashboard: Go to the admin area of your site.
2. Go to Appearance > Themes > Add New > Upload Theme: Click on the ‘Upload Theme’ button at the top of the page.
3. Choose the Child Theme Zip File: Click ‘Choose File’ and select the child theme .zip file you located earlier. Then, click ‘Install Now’.

Step 3: Activate the Child Theme

• Once the upload and installation are complete, you’ll see an option to activate the child theme. Click ‘Activate’ to switch to the child theme.

Step 4: Follow Any Additional Instructions

• Some prebuilt child themes may come with specific instructions for setup or additional features. These could be found in the theme documentation or as notices within your WordPress dashboard upon activation. Follow any provided instructions to ensure your child theme is set up correctly and fully functional.