Child Themes – The Best Practice for Custom Changes Outside Lubith

After generating a theme using Lubith you might want to adjust certain details and make further changes to the theme by modifying the CSS and HTML code, either for subtleties or for broader improvements.

But before doing that there are some issues you need to keep in mind before you start. Theme customization demands a different approach: when you make changes directly to the code of the theme, at the next update you will have to reenter them.

Drawbacks of directly modifying the Lubith generated themes:

If you make changes to the code and then choose to further modify the theme in Lubith, the newly generated theme will overwrite itself over the older theme containing all the manually modified code. You will have to reenter the desired modifications in order for them to apply and that means keeping track of all of them, each time you change a line of code.

There is a second follow up to the issue above: Lubith and WordPress are applications with an ongoing development. Features, options and settings might change in time, which means that at every update differences in the initial code might appear. In order to enjoy future updates and maintain the degree of compatibility, you may have to generate a new theme in the future.

While WordPress is going through updates, you can make your customization safely not in the application core, but by using themes and plugins which use separate scripts not affected or overwritten by new versions of WordPress.

When it comes to altering themes, the same principle is applicable through child themes.

What is a child theme?

A child theme is a directory containing at least the style.css file in which you declare the parent theme whose properties you want the child theme to inherit plus any additional changes that you want to apply.

Further reading: Child Themes on WordPress Codex

How does a child theme function?

The parent of the child theme is set in the CSS file. The child theme will inherit all its files: the stylesheet of the parent theme is imported (see the example), allowing you to make your own modifications to it. Only the latest value that you change and provide for the same origin will be taken into consideration.

You can activate the child theme in the usual way, from the administration panel. It will have all the properties and functions of the parent theme with the additional changes that you make to it.

It is not affected by the updates made to the parent theme, because all your changes are stored in a separate file and directory in wp-content/themes.

The child theme will behave like a stand-alone theme with the difference that it uses at its core another parent theme. A simple mechanism is used in this regard: if the child theme contains a file, this file will be the one used. If not, the parent theme’s folder will take its place.
Here are some examples:

Language files. The themes generated by Lubith contain only the English version of language files. Other versions can be stored in the child theme’s folder and used by it. If the translation folder is stored in the folder of the Lubith generated theme, at the next theme update, they will be replaced and the you will have to recopy it.
Custom templates. If you want to use other templates than the ones set in the theme generated by Lubith, they will be safely stored in the child theme without suffering changes at the next update.
CSS properties. The best way to add or overwrite CSS properties is to do it in the style.css file of the child theme, not to modify the theme provided by Lubith.

Note: A child theme is not a modified version of another theme. If you directly apply changes to a parent theme you will obtain a new version of that theme, while using a child theme allows you to keep that parent theme intact.

Follow this link in order to learn how to make child themes.