Create a WordPress child theme
WordPress is easily customised either through the vast selection of themes and plugins or by delving a little deeper into the code and creating a unique child theme.
This article describes the initial steps for creating a child theme, without actually adding any new functionality.
Child Theme
A child theme is not for everyone. It gives greater flexibility than confining oneself to third-party themes and plugins. But themes and plugins are in no way abandoned. The child theme, the point from which the customisation begins is based on a parent theme. And plugins which are compatible with that parent theme, should be compatible with the child theme.
A child theme looks and behaves like the parent theme from which it is derived, only deviating in specific ways as specified by files added to the child theme’s directory. It is an incremental process, and with the initial files shown below, there is no perceptible difference between the child and parent themes.
The first task is to choose a parent theme and an obvious strategy is to select a theme which is closest to the desired result. The example is based on the Twenty Fourteen theme, the same theme that this website is derived from. Subsequent articles will evolve the child theme with code examples tested using this website. The intention is to present examples which are transferable to themes of the reader’s choosing, however, due to the diversity of themes and behaviours, this cannot always be guaranteed.
The Files
The child theme requires a minimum of two files created within a dedicated directory under wp-content/themes. By convention, the name of this directory consists of the characters -child appended to the name of the parent theme’s directory. So, for this example, the two directories are:
wp-content/themes/twentyfourteen/
wp-content/themes/twentyfourteen-child/
The first directory is the existing parent theme, and the second contains the two files described below.
The file wp-content/themes/twentyfourteen-child/style.css contains additional style declarations for the child theme. At the beginning of the file is a group of comments which are interpreted by WordPress to define the name of the child and the name of its parent.
The file wp-content/themes/twentyfourteen-child/functions.php contains a PHP opening tag on its very first line (there is no closing tag). As a minimum, the file contains code to combine the style sheets of the parent and child, which effectively causes the child theme to inherit all of its parent’s styles.
style.css
/*--------------------------------------- Theme Name: Twenty Fourteen Child Theme URI: Description: Twenty Fourteen Child Theme Author: A. N. Other Author URI: http://example.com/ Template: twentyfourteen Version: 1.0.0 License: License URI: Tags: Text Domain: twenty-fourteen-child */
functions.php
<?php
function theme_enqueue_styles() {
Ψwp_enqueue_style(’parent-style’, get_template_directory_uri() . ’/style.css’);
}
add_action(’wp_enqueue_scripts’, ’theme_enqueue_styles’);