Using a Child Theme

Besides the colors, fonts and spacing options, we know that at a certain point you will like to dig deeper and make advanced changes which include HTML, JavaScript or PHP code. The best way to make them happen while preserving the custom code changed from being overwritten the next time your theme is updated, is through a child theme. You can easily modify and add functionality without changing any code. So this is very important mostly because you don’t lose the possibility to update the theme without losing your changes.

Download and install the Child Theme

WordPress considers a Child Theme as an entirely separate theme so the process of installing is similar with the installing a Parent Theme. We recommend you follow these steps in order to get a Child Theme up and running.

  1. Download our starter Child Theme.
  2. Navigate to Appearance Themes and click Add New button.
  3. Select Upload Theme.
  4. Click Browse and choose the file you just downloaded and click Install Now.
  5. When the theme is installed click Activate.

Start Customizing

The great part of this process is that you don’t have to worry about the next session of theme’s updates. If you add customizations in the Child Theme all the changes you made will be automatically saved.

Adding custom CSS styles

There are two different ways to add custom CSS to your Child theme — use an FTP client or the WordPress Dashboard. If the first method requires connecting to your site via FTP and editing the style.css file, the second one is much easier because you just have to go to your WordPress Dashboard site under Appearance → Editor and select style.css from the right side and start adding your CSS. Simple as that.

Editing the functions.php file

If most files in your Child Theme overwrite the parent theme’s files (like style.css does for instance), functions.php file is pretty different. Instead of overwriting the parent theme’s functions.php file, you can simply load it in addition to it. Basically, your child theme’s functions.php file is loaded right before the parent theme’s functions.php file. You have to use a functions.php file only if you want to replace or modify a function from the Parent theme.

Editing or adding a new template file

Beyond CSS and Functions changes, we let you do structural changes to your theme by changing the PHP template files. In most scenarios, we recommend you to create a copy of the template files you want to change from the parent theme and make your modifications to the copied files. This way you make sure you’re on safe ground.

For example, if you want to modify the content-single.php template, just copy and paste this file to your Child Theme folder and do the changes you want there.

Additional Resources

Updated on April 21, 2017

Was this article helpful?

Related Articles