A child theme is your best option if you are looking to do some serious customizations to Response Pro. A child theme is a companion theme where customizations to the main theme can be made that will not be overwritten when the main theme is updated. This is useful if you are making a substantial amount of changes to the theme’s CSS, or if you want to make customizations to the core template files.

Creating and activating a child theme is quite simple, and below you will find several examples along with a download link to an already prepared empty child theme.

Download the Response Pro starter child theme.

Creating your own:

All you need is a basic text editor, and you are ready to create your own child theme for Response Pro. The first step is to create a folder to house the contents of your child theme. Using your computer, create a folder (on your Desktop for example) and give it a name relevant to your child theme. For our example, we have created a folder called “responsepro-childtheme”

Once you have created your folder, you need to create a stylesheet for your child theme. Open up your text editor and enter the following text:

/*
Theme Name: Response Pro Child Theme
Theme URI: http://cyberchimps.com/
Description: Child Theme for Response Pro
Author: CyberChimps
Author URI: http://cyberchimps.com
Template: responsepro
Version: 0.1
*/

@import url("../responsepro/style.css");

The commented portion of the code defines all the various elements of your child theme. Here is a detailed explanation of each element:

Theme Name: This is the name of your child theme. It can be whatever you like, so be creative!

Theme URI: This is the link associated with your child theme. For your purposes, using your domain is probably sufficient but it can be any link you like.

Description: This is your child theme’s description, which provides a unique identifying text which is displayed in the WordPress theme manager.

Author: This one’s pretty simple, it’s you!

Author URI: This is the link associated with the author, again it’s probably best to use your domain but again it can be anything you like (a link to a different personal blog for example).

Template: This one is important. This defines which base theme the child theme is associated with, in our case, iFeaturePro. Please copy this section exactly as you see in the example.

Version: Finally, this is the version number of your child theme. When updating your child theme it is best to increase the version number. It is also helpful to keep a change log inside of your child theme to keep track of the changes you have added or removed.

With the above code, you now have a blank child theme that you can begin customizing. For example, adding the following code will change your site’s background color to blue:

body {background: blue;}

Any custom styles you add AFTER the @import code will be called ahead of the default Response Pro stylesheet, meaning that your custom code will be dominant.

Customizing Core Template Files:

Another powerful element of child themes is the ability to customize core template files, such as the header.php or index.php file. To customize a core template file, simply copy and paste the contents of that file into a new document, make your customizations, and save it with the same name and extension as the original.

This is the proper way to customize theme template files, because your child theme files will not be overwritten when the base theme is updated.

Installing and Activating:

Child themes are installed and activated like any other WordPress theme. You can either upload the folder to your wp-content/themes folder via FTP, or you can install it as a zip using the WordPress theme manager. In order to make your theme a zip, simply right click (option click on a Mac) and compress the folder to a zip archive.

Once you have your theme installed, simply activate it INSTEAD of Response Pro. This step is very important, otherwise your customizations will not take effect on your site.

Final Thoughts:

There are a few things one should keep in mind regarding child themes. It is important to stay up to date with the base theme’s releases, to ensure that your child theme stays up to date. For example, if you create a custom index.php file and the base theme receives a major update to the index.php file, your theme will not receive that update unless you add the new code to your child theme template file. Core template files in the base theme are rarely changed, but if they are those changes are documented in the change log.

This tutorial was designed to get you started with your own child theme, but if you have questions or need help with your own please stop by the Response Pro customization forum (requires Pro forum access) and we would be happy to help you with your child theme.

Tutorial video coming soon.

Permalink