Documentation › Child Themes and Headway

Child Themes and Headway

Child themes are often thought of as being for design customizations. However, child themes and Headway templates can actually work in tandem if you wish to do more advanced customizations to your site that require the use of PHP and WordPress hooks.

As you customize your site using Headway, those changes are saved in a way that they’re not overwritten when you update the theme. Not losing customizations on upgrades is typically why child themes are used for other themes, but they’re not required with Headway since you have Live CSS and other design options in the Visual Editor.

However, you will still want to use a child theme if you need to make advanced customizations that require WordPress or Headway Hooks. Also, child themes are great if you like editing files directly.

Choose a Code Editor

Before creating a child theme, you need to choose a plain text editor. Notepad for Windows and Text Edit (in Plain Text mode) for Mac are available on virtually every Windows and Mac computer out there.

Important: An application used to create documents such as Microsoft Word, Apple Pages, or Wordpad will not work for editing theme files.

If you want a more robust coding environment than the Windows and Mac default programs, we recommend the following editors:

Child Theme Requirements

A WordPress child theme requires only style.css, but we recommend you also have functions.php so you can run custom PHP code in your child theme. The functions.php is for inserting PHP code, such as if you want to make use of Headway hooks. Anything in the child theme functions.php file will be executed before any of Headway’s files.

      1. Open a new text document in your favorite text editor.
      2. Insert this code:
        /* THEME NAME:Headway Child Theme 
        THEME URI: 
        VERSION:1.0 AUTHOR:Headway Themes 
        AUTHOR URI: 
        DESCRIPTION:This is an example. 
      3. Edit any of these items except the TEMPLATE line, which tells WordPress this is a child theme of Headway.
      4. Add any CSS you want to use in the child theme.
      5. Save the file as style.css.
      6. Open a new text document.
      7. Save it as functions.php in the same location as style.css.

Child Themes API: Remove Theme Support

Headway’s child theme API allows for removing theme support for certain functionality or stylesheets, which means less time customizing your CSS to work against the default Headway styles and more time creating your child theme. You can use any of the following arguments with remove_theme_support(); in the functions.php file of your child theme. Hook it into the headway_setup_child_theme action hook.

These arguments are available:

      • headway-block- basics-css (remove simple floats, margins, and so on for header, navigation, and other blocks)
      • headway- content-styling-css (remove default styling for lists, paragraphs, blockquotes, etc.)
      • headway-design-editor (remove the Design Mode from the Visual Editor)
      • headway- dynamic-block-css (used for things like navigation block height)
      • headway-live-css (remove support for the Live CSS Editor)
      • headway-reset-css (recommended you NOT disable this)


/* ************************************ REMOVE DEFAULT CSS & DESIGN MODE ************************************* */ 

function hwct_remove_theme_support() { 
remove_theme_support('headway-structure-css'); } 
add_action('headway_setup_child_theme', 'hwct_remove_theme_support'); 

Activating Your Child Theme

When you’ve added your PHP code to functions.php and you’re ready to add your child theme to your WordPress site, create a .zip file containing style.css and functions.php. Using the WordPress admin panel, upload the .zip file as a theme and activate it. Here’s an example one we’ve created to get you started.


See the following video for a demonstration of using a child theme.

Copyright © 2016 Vesped Inc. All Rights Reserved. Proudly Powered by Headway and WordPress