Support Home

Getting Started

Theme Documentation

ZOOM Framework

Advanced

Resources

Ways to customize your theme: custom.css and child themes

It’s very well known the fact that everyone wants to have an unique theme. But before giving a unique look to your theme and website, you’ll have to learn how to customize your theme, as other customers did with their WPZOOM Themes.

Before proceeding on watching following tutorials, please keep in mind 2 RECOMMENDED THINGS:

  1. Try not to make changes into the theme’s files unless it is really necessary. Instead watch the following tutorial, and learn how to create a Child Theme.
  2. Do not edit style.css file. Instead use the custom.css file and add in it your custom CSS statements.

Part 1: custom.css

Important:

  • Don’t forget to back-up your custom.css file each time you want to update your theme.
  • For easier customizing, check following tutorial: How to Customize a WPZOOM Theme

Part 2: Child Themes

A WordPress child theme is a theme that inherits the functionality of another theme, called the parent theme, and allows you to modify, or add to, the functionality of that parent theme. This tutorial shows how to create a basic child theme and explains what you can do with it. As an example parent theme it uses Newsley.

What you need to make a child theme

  1. FTP access to your site and an FTP client, like FileZilla.
  2. A text/code editor (like Notepad++).
  3. Any WPZOOM theme, updated with a version which was released after March 5, 2011.
What if my theme version was released before March 5, 2011?
In this case you’ll have to replace all strings from your theme which contains stylesheet_directory with template_directory. You can do this very easy with a tool like Notepad++, using Find in files option, accessed via Ctrl+Shift+F shortcut.

The required style.css file in Child Themes

style.css is the one and only required file in a child theme. It provides the information header by which WordPress recognizes the child theme, and it replaces the style.css of the parent. 

/*
Theme name: My WPZOOM Child Theme
Version: 1.0
Template: newsley
*/

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

A quick explanation of each line:
Theme name. (required) Child theme name.
Version. (optional) Child theme version. E.g.: 0.1, 1.0, etc.
Template. (required) directory name of parent theme, case-sensitive.

Download a sample Child Theme

Download here.

Useful Guides & Tutorials

WordPress Codex: Child Themes
How to make a child theme for WordPress
HTML & CSS Tutorials for Beginners

Have a suggestion?

Lost password?