Is it still necessary to use a Divi Child Theme since the arrival of the Theme Builder? Indeed, this is a legitimate question you may ask yourself, as the Theme Builder allows you to go very far in customising your site...
However, (very) advanced customisation of a theme, whether it is the Divi theme or another WordPress theme, requires the creation of a child theme. Let's just say that this is the only way to add new files to your theme...
If you are worried about coding a child theme, there are other solutions:
- You can use plugins to add code without having to create a child theme
- You can install a special plugin to create child themes in one click.
- There are even generators that can do it for you if you prefer the easy way out...
- You can also download your free Divi child theme at the bottom of this article!
Or you can create your own child theme for Divi? It's so easy!
- 1 - What is a child theme?
- 2 - Creating the functions.php file
- 3 - Creating the style.css file
- 4 - Creating the screenshot.png
- 5 - Creating the Divi child theme folder (theme directory)
- 6 - Sending the child theme to your hosting
- 7 - Download your free Divi Child Theme
- 8 - A list of child themes for Divi to discover
Announcement: this article contains affiliate links that you will easily recognise. The classic links are in purple and sponsored links are in pink.
1 - What is a child theme?
A child theme is a "satellite theme" that depends on a parent theme and allows you to make tweaks and changes without impacting the original theme (the Divi theme). A child theme inherits the functionality of a parent theme and takes precedence over it, i.e. any CSS styles you enter will be taken into account instead of the parent theme.
A child theme is essential if you want to make changes to a parent theme so that these changes are retained when the parent theme is updated.
Creating a child theme for Divi protects your original theme, so you can copy files used by the parent theme into the child theme and modify them without fear. There are only advantages to using a child theme.
Creating a child theme is not complicated, however you can use the WordPress codex if necessary.
To build a child theme, you will need :
- a text editor
- from Divi theme
- file to create a style.css
- to create a functions.php
Did you know? You can test Divi for free by visiting on this page and clicking on "TRY IT FOR FREE
2 - Creating the file functions.php
- Open Sublim Text (for example) and go to File > New File
- Save this file to your desktop by going to File > Save As
Need to master Divi? Discover my training which will guide you step by step in the understanding and use of Divi! Learn more about Divi training.
3 - Creating the file style.css
Still using a text editor like SublimText, you will be able to create the second file necessary to design the child theme for Divi, this is the file style.css. This file is mandatory, just like the functions.phpfile, and it is in this file that you can write all your modifications and CSS rules.
If you are a beginner in CSS and you need to see more clearly, I have selected for you the best site - and I weigh my words - to understand CSS, it is easy, there is no blah-blah and it is very educational, it is LearLayoutDo not hesitate to visit it.
Back to the point, to create the file, here is what you need to do:
- Open the style.css file in the root of the original Divi theme in SublimText. This is where you will find the information you need to create your child theme.
- Look for the header at the beginning of the file: these are the elements between /* and */
- Select these elements from the header and copy them (Ctrl+C).
- Still in SublimText, create a new file by going to the File > New File menu and then paste (Ctrl+V) the header of the style.css file from the Divi theme you just copied.
- Change the line "Theme Name: Divi to "Theme Name: Divi Child" (see line 2 in the screenshot below). Add a line called "Template: Divi" (see line 3). Do not insert spaces between the word Template and the colon that follow.
- You can add the URL of your site, your name, modify the description and delete any lines you consider superfluous.
- Save this file to your desktop by going to File > Save As (the same procedure as for saving the functions.php).
- Name this file style.cssin lower case, then click on Save.
4 - Creating the screenshot.png
The screenshot.png is the image that illustrates your child theme in the administration area under the Appearance > Theme. It's a superfluous step but it's a little "extra" that adds value to your child theme, especially if it's for one of your clients.
- Choose an image to represent your child theme
- Resize it to 1200 pixels x 900 pixels
- Save it as screenshot.png
5 - Creating the Divi child theme folder (theme directory)
Now you have 3 files:
- the file functions.php
- file style.css
- the file screenshot.png
You will be able to put them together in a folder that will become your child theme folder for Divi.
- On the desktop of your computer, create a new folder and name it "Divi-child".
- Move the 3 files to this new folder.
- If necessary, compress the folder of your child theme to obtain a .zip folder (right-click > compress).
6 - Sending the child theme to your hosting
A child theme is installed like any other WordPress theme, I already explained how to install the Divi themeBut I propose a small synthesis here:
Option 1: using FilleZilla
Once the directory of your child theme is complete, all you have to do is upload it to your hosting in the folder : www > wp-content > themes (or public_html > wp-content > themes) using Filezilla.
Attention: this method requires sending the file UNZIPPED!
Once your folder is present on your server, you can activate it from the WordPress back office in the Appearance > Theme tab. Be sure not to delete the parent theme.
In this child theme folder, you can add as many modified files as necessary, this step is optional and can be done later.
Option 2: directly from WordPress
There is an easier way to upload your child theme folder to your server: you can do it directly from the administration of your WordPress site as follows:
Go to the Appearance > Theme > Add > Bring theme online > Browse > tab and choose the child theme for Divi that you just created.
Please note that this is the .zip file that you must send. The one that has been compressed.
Once imported, activate it without removing the parent theme.
When you need to add files to this child theme, you will need to use FTP (the Filezilla method).
7 - Download your free Divi Child Theme
You can download my child theme here. You don't need to register nor to leave your e-mail...
8 - A list of child themes for Divi to discover
So there you have it, it took you 10 minutes on the clock to create your child theme for Divi. Was it hard? Now you can start with a good foundation and customize your site or blog to the max. You've got the cards in your hands, now you just have to follow the other tutorials available on my "Customize Divi" section.
However, the child theme you just created is blank, and the advantage of a child theme is that you can add custom files to make your site look like no other... So, here is a small list of child themes for Divi designed by Developer-Designers:
- "Sales Mart : Child theme for Divi & WooCommerce
- Discovering the Duriza child theme
- Discovering the Divi Girl Child Theme
- Discovering the "Twice" children's theme
- Discovering the Divi Chef Child Theme
The child themes listed above are from the official ElegantThemes marketplace. These are "elaborate" child themes, far from the one you just created with my tutorial. They have been developed to offer more design options... If you want to buy a custom child theme of this type, I advise you to do so from merchants who will maintain this child theme over time and the ElegantThemes marketplace is a safe bet.