Start WP Child Theme Example

This example shows how to create a simple child theme for the WordPress parent theme twentysixteen. This can be useful when, for example, a managed WordPress hosting service auto-updates WP and overwrites a theme’s style.css, functions.php, etc. files.

1. Create a new folder in the WP themes folder, usually with “-child” appended to the parent name. In this case, the folder name will be twentysixteen-child.

2. Create 2 new text files named “style.css” and “functions.php” as shown below. Put them in the new “twentysixteen-child” folder. Note that all custom page templates, including modified header and footer PHP files, should go in this child theme folder also.

STYLE.CSS
/*
Theme Name: Twenty Sixteen Child
Theme URI: http://example.com/twentysixteen-child/
Description: Twenty Sixteen Child Theme
Author: Nels Johnson
Author URI: http://downrecs.com
Template: twentysixteen
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: twenty-sixteen-child
*/

/* start custom css classes and selectors – will load after and override css in parent theme */
.
.
.
/* end custom css */

FUNCTIONS.PHP
<?php
function my_theme_enqueue_styles() {

$parent_style = ‘parent-style’; // This is ‘twentysixteen-style’ for the Twenty Sixteen theme.

wp_enqueue_style( $parent_style, get_template_directory_uri() . ‘/style.css’ );
wp_enqueue_style( ‘child-style’,
get_stylesheet_directory_uri() . ‘/style.css’,
array( $parent_style ),
wp_get_theme()->get(‘Version’)
);
}
add_action( ‘wp_enqueue_scripts’, ‘my_theme_enqueue_styles’ );
?>

3. In WP Admin, go to Appearance > Themes and switch to the new (child) theme.

End WP Child Theme Example