Frumph.NET

A very large issue with child-themes is distribution, the need and want to have your child theme available to your end users so they can have a different variety of looks available that go along with your parent theme.

The following is the method on how to include your child themes with your main parent theme download.

The WordPress Dev team doesn’t recommend this method. In the future there will be child-themes available to be added to the repo, however this is just a side note on how to implement it if you want to.

The first step is to create a directory in your parent theme called “child-themes” and inside that directory, toss all of your child themes that are available for your parent theme into it.

Then, open up your parent themes functions.php file and we’re going to add some code to it, preferably where you init your other functions.

add_action('init', 'easel_init_child_theme_directory');

function easel_init_child_theme_directory() {
	register_theme_directory(get_template_directory().'child-themes');
// fix for windows servers and the  / issue.
	add_filter('stylesheet_uri', 'easel_fix_path');
}

function easel_fix_path($stylesheet_uri) {
	$stylesheet_uri = str_replace('', '/', $stylesheet_uri);
	return $stylesheet_uri;
}

Using the above addition to your functions.php file is telling WordPress to register the child-themes directory that is IN your template directory (parent) as an additional theme directory to look at for themes. Also take note to use the instead of / when using the register_theme_directory() function.

The next step is adjusting your child themes css import, normally with a child theme you would import by going up one directory and then back down to the parent theme directory to find the style.css of the parent, like so:

@import url('../easel/style.css');

However, since the child themes are now being stored within the parent we need to change the location of where to find the style.css of the parent for importing, such as this:

@import url('../../style.css');

Basically going up two directories to where the parent themes template root is.

.. and that’s it. Now when people activate the theme and go to look in the appearance -> themes, it will also show all the child themes you have available AND you now can distribute your child themes with your parent theme, even on the WordPress.org repository.

– Phil