Flexx FAQ

From iThemes Codex
Revision as of 21:01, 19 August 2010 by Ronald (talk | contribs) (Sample stylesheet style.css for a Flexx Child Theme)
Jump to: navigation, search

Check the General FAQ page in case your question does not appear in this section.

How to create a Child theme for Flexx

In order to preserve your original Flexx theme files (as downloaded), you should use a Child Theme. Using Child themes, you can modify (override) all aspects of an existing iThemes (Parent theme), e.g. the css code in the stylesheet, html or php code in the page templates, functions, without having to modify any of the original core theme template files. This also means that upgrading the parent theme does not overwrite any of your modifications.

For more general information on Child Themes you can read these articles: iThemes and Child Themes – introduction and Child Themes, a quick tutorial.

This article describes how to create a Child theme for Flexx CandyApple theme, but it applies to all Flexx themes.

There is one modification required to the parent theme.

Minimum requirements

Your current Flexx theme should be at least at version 2.6.3 (release date: Oct. 15, 2009)

Modifications in the Parent themes functions.php

Locate the following code in functions.php of the parent theme. Note that currently, this modification will be overwritten when you upgrade the theme.

//A function to include files throughout the theme
//It checks to see if the file exists first, so as to avoid error messages.
function get_template_file($filename) {
    if (file_exists(TEMPLATEPATH."/$filename"))

and replace that entire block of code with:

//A function to include files throughout the theme
//It checks to see if the file exists first, so as to avoid error messages.
function get_template_file($filename) {
        if (file_exists(get_stylesheet_directory()."/$filename"))
        else if (file_exists(get_template_directory()."/$filename"))

This will make sure that theme functions will try to locate a theme file in the Child theme template first, and if it does not exists, the theme will use the file from the parent theme.

Creating a child theme

A child theme in the most essential form contains only a stylesheet, named style.css. Code in that stylesheet will tell WordPress that this is actually a Child theme, and what its Parent theme is.

To make sure all functions work properly, and all images used for the design of the theme, we will need to duplicate the following files and folders.

  • copy the images subfolder and all it's content to the Child theme folder
  • copy the screenshot.jpg to the Child theme, it will just look better on the WordPress themes panel (optional)
  • create a style.css, and make sure it has the proper information in the header.

Sample stylesheet style.css for a Flexx Child Theme

Theme Name:    Flexx Theme CandyApple - Child Theme
Theme URI:     http://www.ithemes.com
Description:   Child theme for Flexx CandyApple
Author:        iThemes
Author URI:    http://www.ithemes.com
Version:       1.0.0
Template:      FlexxCandyApple

/* Import Parent Stylesheet, do not remove this line,
   make sure you use the ACTUAL parent theme folder name!
@import url("../FlexxCandyApple/style.css");

/* Make all your modifications and customisations below this line

It is assumed that your base Flexx theme is located in a folder named "FlexxCandyApple" (case sensitive).

Download a sample Child theme

You can download a sample basic FlexxCandyApple Child Theme, that includes all the required files.

Using the Child theme

Install the Child theme as you normally would, using the WordPress theme installer, or by unzipping and uploading the Child Theme folder to your wp-content/themes folder. Activate the Child theme just as you would activate any other theme.

Back to the main Flexx page