CBOX Classic Theme Developer Guide

This guide will take you through all the steps needed to quickly create a custom CBOX Classic Theme. We’ll show you exactly how you can easy customize the default theme and make them in a upgrade safe manner. Let’s get started shall we?

Introduction to the basic concepts of CBOX Classic Theming

The most important concept you need to learn about before you get started is the concept of Child Theming. Child Theming is a powerful WordPress feature that allows you to overwrite templates and functionality from a “parent theme”. The Infinity Theme is developed to make this process is easy as possible, allowing you to overwrite pretty much every single aspect of the theme.

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.

The parent/child structure has been a very popular method to harness the power of WordPress Frameworks because it allows you to modify the styling and layout of a parent theme to any extent without editing the files of the parent theme itself. That way, when the parent theme is updated, your modifications are preserved.

We strongly advise you to NEVER make changes to the CBOX Classic Parent Theme in any way. You will lose all these changes when you update the theme and you’ll end up with a big headache maintaining the theme over time. Take some time to learn the power of Child Themes and you’ll be a happy homer. If you still decide to hack away at the CBOX Classic Parent Theme we won’t be able to help you with support either!

Is using Child Themes with CBOX Classic different then child theming with regular WordPress Themes?

If you are already familiar with how Child Themes work you’ll be right at home and nothing is different in terms of workflow. But because the CBOX Classic Theme is very flexible there’s a whole bunch of additional stuff you can do with it. This is all done through special .ini files that live inside your child theme folder. These .ini files allow you to quickly customize your theme beyond templates and functions.php code. If you want to dive into this you can find in-depth documentation about this on the PressCrew site. You’ll also learn the basics about the ini files during this Getting Started guide.

So what stuff can I change through my Child Theme?

Here’s a short summary of some of the things you can modify/overwrite or disable through your Infinity Child Theme:

  • Templates (single.php for example, or any BuddyPress template)
  • Stylesheets and Javascript files (CBOX Classic styles are split into several files which can be easily overwritten)
  • Images (change the default logo by copying over logo.png to the assets/images/ folder in your child theme)
  • Dashboard Pages (overwrite default Theme dashboard pages like the “Start” or “Docs” page
  • Theme Options (for example to change the description texts for any theme option)
  • User Documentation
  • PHP Functions

Creating your own CBOX Classic Child Theme

Creating your own CBOX Classic Child Theme just takes a few steps. Here’s the quick rundown:

  • Create a new folder in your wp-content/themes/ folder
  • Create a file called style.css with the following into it< 
    /*
Theme Name: My Custom CBOX Classic Child
Theme URI: http://myurl.com
Description: Insert description here
Version: 1.0
Author: Your Name
Template: cbox-theme
*/
  • Create the following folder structure /engine/config/ and create a file called infinity.ini in there
  • Open up the infinity.ini file and add the following line to it: 
    parent_theme = "cbox-theme"

That’s it! You can now activate your CBOX Classic Child Theme and it will inherit everything from the Parent theme.

During this tutorial we’ll take a look at how to do these things step by step, and by the end you’ll know enough to create unique looking front end and theme dashboard in a snap. We’ll start things easy, by overwriting some of the CSS in the Infinity Theme.

To the next tutorial: Adding and overwriting custom CSS