Child Themes

A child theme is only necessary if you plan on editing your WordPress theme files at a code level. If you only need to customise theme CSS then a child theme isn’t necessary, instead, use a custom CSS plugin like SiteOrigin Custom CSS. To confirm, a child theme is not necessary to safeguard your content, theme settings, plugin settings or WordPress core settings.

Each WordPress theme that you have installed is stored in its own folder. That folder is located in the /wp-content/themes/ directory on your server. Whenever a theme author like SiteOrigin ships a theme update and you run that update via DashboardUpdates, the entire theme folder is replaced with the updated version. This means that any edits you might have made to a theme’s files will be lost during the update process. Put another way, it’s not safe to directly edit theme files at a code level.

If you’re still reading then, you do want to edit theme files at a code level, in this event, you’ll need a child theme. A child theme uses all of the parent theme functionality and styles while providing a safe place for you to store your edited files. Your edited files will be used instead of the original files.

Reference: WordPress Codex: Child Themes

Creating a Child Theme

Using our Vantage theme as an example, basic child theme structure looks as follows:

  • vantage-child
    • functions.php
    • style.css


style.css is the one file that is required in a child theme. The child style.css header information allows WordPress to identify which parent theme our child theme belongs to. For our Vantage child theme, the opening contents of our style.css will look as follows:

Theme Name: Vantage Child
Author: SiteOrigin
Author URI:
Theme URI:
Description: Vantage Child Theme
Version: 1.0.0
Template: vantage
Text Domain: vantage-child

/* =Theme customization starts here
————————————————————– */

The most important line above is Template: vantage. That allows WordPress to identify which is the parent theme. For all SiteOrigin themes, the template name is the same regardless of whether the theme is the free or premium version.

If you’d like to add custom CSS to your child theme, you can do so below =Theme customization starts here, or, in a custom CSS plugin.


functions.php is the heart of our child theme. Initially, we’ll use this file to import (enqueue) the parent theme stylesheet. This will ensure that all of the parent theme styles are correctly displayed in our child theme. Later, if we want to add custom functions, this will be the file we’ll do it in.

 * Enqueue the parent theme stylesheet.
function vantage_child_enqueue_parent_style() {
    wp_enqueue_style( ‘vantage-parent-style’, get_template_directory_uri() . ‘/style.css’ );
add_action( ‘wp_enqueue_scripts’, ‘vantage_child_enqueue_parent_style’, 8 );

Starter Child Theme

You’ll find a starter child theme in the documentation section of your SiteOrigin theme. Since we’re using Vantage as our example child theme, you can find the Vantage child starter theme here.


Once saved, your child theme folder “vantage-child” should be stored in the /wp-content/themes folder. One way of uploading your child theme is to ZIP the child theme folder and upload via Appearance > Themes > Add New: Upload Theme.

Activating any child theme in WordPress has a few expected results. AppearanceCustomize and AppearanceMenuMenu Locations settings will reset. This means that after activating your child theme you’ll most likely need to go to Appearance > Menus and re-save your menu location settings. You’ll also need to go to Appearance > Customize and redo any theme Customizer settings. Themes like Vantage have a lot of Customizer > Theme Design settings. If you think you might need a child theme later in your development process, it’s worth installing one right, in the beginning, to avoid having to setup your Customizer settings twice.


Custom CSS rules can be saved in your style.css file or in your custom CSS plugin if you’re using one. Both places are safe. Please, remember, don’t copy the entire contents of the parent style.css file into your style.css file. Only edited or new CSS rules should be added to the child style.css file. For a general overview on custom CSS, please, see our introduction to custom CSS tutorial.

Any theme files you might want to edit can be copied from the parent theme folder to your child theme folder. It isn’t necessary to remove the original from the parent theme folder, copy and paste is all that’s necessary. The copy process can be completed using an FTP program or Hosting File Manager like the one available in cPanel for example.

Advanced Customisations

Not all files can be successfully edited from within your child theme. If you need to change a parent theme PHP function, a slightly different procedure will have to be followed. Filter hooks will often need to be used from within the child theme functions.php. If you’re interested in advanced customizations of this nature, see the following ThemeShaper tutorials on using filters and actions in child themes:

ThemeShaper: Using Filter Hooks in WordPress Child Themes
ThemeShaper: Using Action Hooks in WordPress Child Themes