Child themes

Jesper Johansen edited this page Sep 12, 2013 · 9 revisions

Since Cakifo is a parent theme, you'll want to create a child theme if you plan on making any customizations. That way you won't lose your changes when Cakifo is updated. Don't know how to make a child theme? It's relatively simple. Just follow the below steps.

Want a more detailed explanation? Join Theme Hybrid and get access to the in-depth documentation


Download a sample child theme: http://themehybrid.com/themes/cakifo-child


  • Create a theme folder in your wp-content/themes directory called cakifo-child (or something else - you decide)

  • Then, create a style.css file within your theme folder

  • At the top of your style.css file, add the below information

/**
 * Theme Name: Cakifo child
 * Theme URI: http://link-to-your-site.com
 * Description: Describe what your theme should be like.
 * Version: 1.0
 * Author: Your Name
 * Author URI: http://link-to-your-site.com
 * Tags: Add, Whatever, Tags, You, Want
 * Template: cakifo
 */

This will give you a blank design. If you want to import the Cakifo parent theme style, simply append this code after the above information:

@import url( '../cakifo/style.min.css' );
 
/* Custom code goes below here. */

See more about Child Themes at the Codex

Functions.php

You can make more than just style changes in a child theme. Unlike style.css, the functions.php of a child theme does not override its counterpart from the parent. Instead, it is loaded in addition to the parent's functions.php. (Specifically, it is loaded right before the parent's file.)

Adding functions or changing things in the parent theme will be lost when it's updated. Fortunately Cakifo is very user child theme friendly. It has a lot of hooks and filter to make it easy for you to change the functionality of the parent theme in your child theme. See the Hybrid Core Hooks guide for more information.

Example

An example child theme is included in the download. But I'll give an example here as well

Let's say you want to change the speed of the slider and/or remove comments from pages. In your child theme functions.php do this

<?php

add_action( 'after_setup_theme', 'my_child_setup', 11 );

function my_child_setup() {

	/* Get the parent theme prefix. */
	$prefix = hybrid_get_prefix();

	/* Set the slider speed. */
	add_filter( 'cakifo_flexslider_args', 'my_child_slider_args' );

	/* Remove comments from pages. */
	add_action( 'init', 'my_child_disable_comments_for_pages', 11 );

	/* Other Actions and filters calls go here. */
}

function my_child_slider_args( $args ) {
	$args['slideshowSpeed'] = 4000; // Sets the speed to 4 seconds
	return $args;
}

function cakifo_child_disable_comments_for_pages() {
	remove_post_type_support( 'page', 'comments' );
}

?>

Or what about adding some content to the header? Easy.

<?php

add_action( 'after_setup_theme', 'my_child_setup', 11 );

function my_child_setup() {

	/* Get the parent theme prefix. */
	$prefix = hybrid_get_prefix();

	/* Add content to the header. */
	add_action( "{$prefix}_header", 'my_child_header_content' );

	/* Other Actions and filters calls go here. */
}

function my_child_header_content() {
	echo 'Header Content';
}

?>
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.