The Ultimate Divi Child Theme Guide for 2018

by | Aug 21, 2018 | Divi Tutorials, Featured Post | 4 comments

This post is all about the Divi Child Theme! And no, I’m not talking about themes for children. 🤔 If you’re not sure what a Divi Child Theme is, don’t worry, we’re going to get to that.

Actually, we’re going to cover everything there is to cover about Divi Child Themes, including the what, why, when, and how. This is in fact the ultimate guide to Divi Child Themes, so rest assured you will be very well educated on the topic by the end of this post/video.

If you’re already a bit overwhelmed, don’t worry! It’s not all as tricky as you may think. We’ll also get to when you actually need to use child theme (hint: it’s not all the time like you may have read elsewhere).

You may have noticed by now the sidebar with quick links to the different parts of this guide. That is there for your convenience. Feel free to skip around and jump to a specific section if you came here for something specific. Otherwise enjoy this post in it’s entirety, and feel free to bookmark it for later, or even better, share it 😍 (we love shares).

Also, before we dive in, there’s a lot of confusion in the Divi community with the difference between a “blank Divi Child Theme” and a “Premium Divi Child Theme.” We’ll be covering both in this post, but keep in mind they’re used for very different reasons despite the same “Divi Child Theme” name often used to refer to both.

So What is a Child Theme?

Before we can dive into how to create a child theme and all that good stuff, let’s discuss what it actually is. And to be clear, child themes are in no way unique to Divi, but a concept in WordPress. You can create a child theme for any WordPress theme.

According to the WordPress Codex, “A child theme is a theme that inherits the functionality and styling of another theme, called the parent theme.”

In other words, a child theme is a way to allow you add advanced customization to your theme without having to worry about erasing those changes each time you update your theme. The child theme inherits the functionality of the parent theme allowing you alter files that don’t lose customizations when the parent theme is updated.

Make sense? Still a little confusing? Let’s take a step back.

WordPress themes contain lots of files, mainly including PHP files, CSS files, and Javascript files. Because of the open nature of WordPress and themes, you can see all the code in the theme files and make edits and additions.

However, you shouldn’t directly edit the theme files unless you plan to never update the theme again. Theme authors will typically push updates to themes (new features, bug fixes, etc) which will overwrite any changes or customizations you made.

To get around this, WordPress created the concept of Child Themes, so you can have the best of both worlds: make coding customizations to your heart’s content, AND be able to update your theme with new features, fixes, etc.

Editing theme files without a child theme is a recipe for disaster. Because if you update the theme, all your customizations will be gone.

And you’ll feel a little like doing this:

Unfortunately I had to learn this the hard way years ago, and it’s incredibly frustrating!

Okay let’s get back to how the child theme concept actually works.

We’ll get to exactly how to create a child theme further down in this post, but essentially, when you create a child theme and define that it’s a “child” of the particular parent theme, then all the functionality and styling of the parent theme will be automatically inherited by the child theme. Then, if there’s a file in the child theme with the same name as a file in the parent theme, then WordPress will know to look at the child theme’s version instead of the parent theme’s version.

For example, if you wanted to add custom code to your footer.php you would copy it from the parent theme to the child theme and make your changes. The version in the child theme will be the version that WordPress reads. Then, when the parent theme updates, and all the files in the parent theme are re-downloaded from the theme author’s latest download package, your footer customizations safely remain in the child theme. 😊

Pretty cool, huh?

Now that we’ve discussed the mechanics of how child themes work in WordPress, let’s discuss when you actually NEED a child theme, and more specifically when you need a child theme when you’re using the Divi theme.

When Do I Need a Child Theme?

Before we discuss when you need a child theme, let’s look at when you don’t need to use a child theme.

Let me start with this: Divi child themes are not always needed.

Depending on what level of customisation you are planning dictates the need for a child theme.

(And to be clear, we’re still talking about child themes for customization purposes, not premium Divi Child Themes. Don’t worry, we’ll get to that!)

If you’ve been around WordPress enough or read any number of blog posts then you’ve probably heard: “always use a child theme no matter what!”

So the very fact that I’m saying that you don’t always need a child theme is a bit controversial…

While there’s definitely nothing wrong with using a child theme, you don’t always need one, especially when it comes to themes like Divi.

Before Divi (and other page builders), WordPress themes were A LOT less flexible. You didn’t have full edge to edge control over what content would go where. Themes would have a pre-defined homepage layout and would include options to turn on and off sections of the homepage, as well as ways to customize it, but overall it was very limited on what you could do from a customization standpoint.

You were essentially stuck with the theme’s pre-defined controls for styling and customization. And the alternative was getting your hands dirty in the PHP files editing the page templates, as well as A LOT of custom CSS. Back in those days, child themes were needed a lot more frequently.

For example, if you wanted to add a nice call to action section at the bottom of your pages just above the footer, and your theme didn’t have the option built in, then you would have to custom create it inside the PHP template file, which means you HAD to use a child theme in order to preserve that custom coding.

Today we are spoiled with Divi. Now you have all the customization ability at your fingertips with Divi’s page builder. So the need to edit PHP files comes up a lot less often.

And in screenshot above, I was able to create that call to action section with Divi’s page builder directly on my page, without having to touch code, and without a child theme too.

So with that said, if you don’t plan on editing the PHP files of the parent theme (or adding new PHP, JS, etc), then chances are you don’t need a child theme.

Even if you’re using custom CSS or a few custom Javascript snippets, Divi has built in places to put the custom CSS (Divi Theme Options) and the Javascript snippets (Divi Theme Options > Integration, or the Code Module).

To make things easy for you, we have a handy guide that will give you some examples of when you do and don’t need to use a Divi Child Theme. 🙂

When You DO NOT Need a Divi Child Theme

  • You’re simply using Divi’s built in controls within the Divi page builder, theme customizer, theme options, etc.
  • You’re adding custom CSS to any of Divi’s custom CSS boxes: Divi Theme Options, theme customizer, Divi Builder page settings, or the advanced tab within modules.
  • You’re adding scripts to the integration tab in Divi Theme Options for things like: Google Analytics, Facebook Pixels, other tracking codes, code snippets, etc.

If you’re doing any of the things above, everything is saved in the database (not the theme files), and not in any danger of getting overwritten when Divi updates.

When You DO Need a Divi Child Theme

  • You’re making changes to Divi’s PHP theme template files such as a header.php, footer.php, single.php, 404.php, etc.
  • You’re adding custom functions or code snippets to functions.php.
  • You’re customizing the theme’s javascript files, or adding lots of new javascript.
  • You’re making edits/additions to ANY file that is within Divi’s theme files.
  • You don’t want clients to see any code that you saved in Theme Options in case they mess with it and break something.

If you’re doing any of the above customizations, then your changes are at risk of being overwritten when you update Divi if you do not use a child theme.

Different Types of Child Themes

Before we move onto the methods of creating a child theme, let’s discuss the two different types of child themes so we can avoid any confusion.

As mentioned previously, there’s really two different types of Divi child themes:

  1.  a blank child theme
  2.  a premium child theme

Blank Divi Child Theme

A blank child theme (often referred to as a standard child theme, or “bare bones” child theme) is comprised of a few files (at least two: style.css & functions.php) that is added to a WordPress installation after the parent theme.

These files will enqueue the functionality of the parent theme and override certain files in order to preserve the site modifications and functionality made by the web developer (as outlined above).

You can create your own child theme from scratch, use a child theme generator, download our free blank child theme, or even use a plugin. We’ll get to that next though.

Premium Divi Child Theme

A premium child theme is similar to a blank child theme in that it sits “on top” of Divi, however it has some distinct differences too.

Premium Divi Child Themes are fully designed website templates that are created and sold to be used as starting points for a new website project. There’s lots of 3rd party developer that create premium child themes, and we’ll take a look at the best places to buy them later in this guide.

From a technical perspective, Premium Child Themes have the same functions.php and style.css (but usually with more code in them), and then they typically also have other additional files with customizations as well.

Here’s an example from our RoyalCommerce child theme with what the file structure looks like:

Installing a premium Divi child theme is essentially like obtaining a finished website built with Divi that you can use as as starting point for any project. Using premium child themes will drastically speed up development time opposed to starting from scratch.

We’re going to discuss Premium Divi Child Themes in detail later on in this guide, but I wanted to explain the differences in this section as well.

Okay…Now that we’ve learned what child themes are, and when to use them. Let’s get to the fun stuff and actually create theme 🙂

How To Create A Child Theme

There are essentially four different ways to create a child theme:

  1. using our free blank child theme (quickest)
  2. manually with code
  3. with a child theme generator
  4. with a plugin

If you simply want a blank child theme then look no further than number one on the list below!

1. Download Our Free Blank Divi Child Theme!

By far the quickest way to get a child theme on your site is to use our free blank Divi Child theme. This can also be known as a “Bare Bones” Child Theme because it has nothing but the bare essentials but it’s ready for you to add your own customizations.

Click the button above and enter your email, and we’ll automatically send you the blank (bare bones) child theme for free. By downloading you’ll be subscribed to our email list, but you can unsubscribe at anytime (although you probably won’t want to 😉).

Once you’ve downloaded the child theme, you can install and activate it, and use it as-is if you would like. Or, you can customize the name, author, links, etc. — and then add your custom styling, custom functions, etc.

2. How to Create a Divi Child Theme Manually

If you’d like to roll up your sleeves and put on your WordPress developer hat and create the child theme from scratch, then this section is for you! If you have long term plans of becoming an experienced WordPress developer, then it’s definitely recommended that you not only know how to create a child theme from scratch, but understand how it works too. That’s why we’re going so in depth with this guide!

We’re going to dive into creating a child theme from scratch. Don’t worry though, it’s actually rather easy, even if you’ve never touched code!

Let’s dive in!

Step One: Creating the Style.CSS File

At a minimum, a child theme is comprised of at least these two files: style.css, and functions.php.

We’re going to start with the style.css file. This file is for telling WordPress the details of your child theme, and can also be used to place custom CSS that you want included in your child theme.

Create the style.css file:

  • Create a folder on your computer and name it Divi-Child-Theme.
  • Next, create a file within the folder and name it style.css. To be clear, it has to be this EXACTLY for WordPress to read it correctly. To create the file you can use a text/code editor (we use Coda, but Sublime and Notepad++ are also very popular). Or you can use the default text editor tool that comes on your computer (for example: TextEdit on Mac).

You may have difficulty creating a file from scratch unless you have a proper text/code editing tool as described above. If that’s the case, we got your back! See below 🙂

BONUS: You can download a sample style.css file and edit that, if you’re having trouble creating the file from scratch! Once Downloaded, unzip then add to the folder you just created in the steps above.

  • Next, add the following to the style.css file:
  • Now customize what you just pasted above. (or customize the text if you downloaded the bonus file from above). You can customize anything you want, except for the template name (Divi). In order for the child theme to work correctly as a child theme of Divi, you must leave that as-is. But you can customize the theme author, links, descriptions, theme name, etc. to your heart’s content!

For example, this will work the same as above:

Step Two: Creating the Functions.PHP File

The second mandatory file for a child theme is the functions file. This is for enqueuing Divi’s stylesheet as well as for any additional functions you’d like to add. I’ll explain that more in a minute.

Create the functions.php file:

  • Create another file in the Divi-Child-Theme folder and name it functions.php

BONUS: Just like for the style.css file, you can download a sample functions.php file here.

  • Next, add the below code to your newly created file, and optionally add any custom functions. If you downloaded our sample file from above, you don’t need to do anything further unless you would like to add custom functions of your own.
Now that we’ve created the functions.php and style.css files, the last part is to create the screenshot. This is technically optional, but unless you want a blank space where the image should be on the WordPress themes page, then you’ll want to create a screenshot.

The screenshot dimensions should be 880x660 and can be either .jpg or.png file type. You’ll need to make sure the file name is exactly screenshot.jpg or screenshot.png, otherwise WordPress won’t recognize it.

Once you’ve added your screenshot image, then your Child Theme folder should look something like this:

Next, compress the folder to .zip file type and then upload to WordPress! You can upload to WordPress the same way you uploaded Divi: Appearance > Themes > Upload, then click Activate!

You should see something that looks like sort of like this:

And that’s it! Congrats, you’ve successfully created your own blank/standard (bare bones) child theme!

You may be thinking, but what about making customizations to the theme files? Isn’t that the whole point of a child theme?

Yes! The way it works is any file that is in your child theme that is also in your parent theme, WordPress will use that file instead. The exceptions are the style.css and functions.php files. Both the parent and the child files are used there.

Editing Template and Other Theme Files

If you want to add any custom functions to your WordPress Divi child theme, you just need to write them in your child themes functions.php. But for editing other files, there’s a little more to it.

Let’s go through this step by step.

For instance, you have created a Divi child theme. Now you want to change how single posts are displayed in the Child Theme. The single post page template is located at wp-content/divi/single.php

  • Step 1: Create a single.php in your child theme folder. But to ensure it will overwrite the parent theme we have to follow the exact file name & structure.
  • Step 2: Create a folder and place the file inside that folder. Make sure the path looks exactly like the parent theme.
    Parent Theme : divi/single.php
    Child Theme : divi-child/single.php
  • Step 3: Now you can write your own code in the single.php and it will overwrite parent file
    Using this method you can edit and overwrite any template of parent theme. You just have to make sure file name and folder path are identical.

Make sense? It’s a bit tricky to get used to, but play around with it and you’ll be a child theme customization pro in no time!

3. How to Create a Divi Child Theme with a Generator

Another popular way to create a child theme for Divi, is to use a generator. The generator will allow you to input the custom details of your child theme, and then it will automatically generate the files and even zip them for you so it’s ready to upload. There’s a few different child theme generators in the Divi community, but we’ll be using the one from our friend’s over at Divi Space, since it’s the original.

Step One: Using the Generator

Head on over to the Child Theme Generator, and fill out the form like so:

After you fill in the details and click “Generate” it will be emailed to you automatically.

Step Two: Installing the Child Theme

This may come as a given, but we’ll go through it just in case. After you receive the download link from Divi Space, click the link and download the file. Then, upload the .zip file to Appearance > Themes > Add New Then you’ll activate it.

If you unzip and open the folder that you downloaded, you’ll see a few files in addition to the standard three files we discussed earlier:

One of the files adds functionality for a login editor, which you will find in the customizer:

It’s a handy tool that gives you full control over the login page. Within just a few minutes, I was able to customize the login screen:

This can definitely be handy for adding extra branding to a client’s site!

4. Using a Plugin to Create the Child Theme

The third and final method for creating a child theme is to use a plugin. There are several free plugins that allow you create a child theme quickly and easily.

Below are some plugins to consider when using this method:

For our example, we’ll be using the plugin Divi Children by Divi4U since it’s Divi specific. Like the generator outlined above, Divi Children comes with some additional options that are worth mentioning.

To use Divi Children, follow the below steps:

  • Step 1: Download the plugin zipped file from the plugin page and save it anywhere in your computer.
  • Step 2: Upload the plugin to your site and activate.
  • Step 3: Once you have activated the plugin, find it in the plugins list and select settings or select Appearance and you will see it just above editor.

You will then see three tabs.

On the first tab, fill in the details you want for your child theme. For this example, I have called it Test 1.

The second tab lets you set an image once you have created your child theme.

The default child theme image is what you see below.

The Divi Children plugin also adds some options to the customizer for further child theme customization:

Pretty nifty huh? That brings us to the end of the child theme creation methods! As you can see, there’s multiple options, and the one you choose is up to you!

This guide isn’t over yet though! Now we’re going to get into the really fun stuff with Premium Divi Child Themes 🙂

Premium Divi Child Themes

We discussed at the beginning of this guide that there are essentially two different types of child themes. The first, which is what we’ve been discussing up until this point, is used for customization purposes so you don’t overwrite any customizations you make to theme files when Divi updates. And the second type of child theme for Divi is Premium Child Themes.

Premium Divi Child Themes are basically a completed website that you can install to give you a HUGE head start on creating the website.

Rather than starting with a blank slate, which can be not only challenging but also extremely time consuming, you get to start with a finished website with gorgeous design.

If you’ve built a website then you know it’s a lot easier to customize something than it is to design from scratch.

BONUS: We have a FREE gorgeous Divi Child Theme that you can download!

Divi Business is a multi-purpose business child theme that is suited for a wide range of project types. And again, it’s FREE! 😍

Not all child themes can be free though. After all, they are called Premium for a reason.

However, if you compare the time you save when you use a Premium Divi Child Theme, then it’s a no-brainer that they’re worth every penny.

Who are Premium Child Themes For?

Some people think that Premium Divi Child Themes are only for beginners that don’t know how to design/build websites in Divi. That actually can’t be further from the truth.

While it is true that Premium Child Themes are great for users that are new to Divi or designing their own company/personal website and don’t want to take the time to learn the ins and outs of Divi, however premium child themes are also great for professionals.

For example, there’s lots of professional web designers and agencies that will use premium child themes to drastically speed up their workflow.

It’s no secret that customizing a template/child theme is MUCH quicker than designing from a blank slate. So if a professional or agency can use a child theme to save tens of hours of work, why wouldn’t they?

I’ve personally used Premium Divi Child Themes from other Divi web designers to help me create client sites in a fraction of the time. And, we have lots of professional web designers and agencies buy our child themes for client projects too.

For example, Evol Empire Creative, a popular creative agency in the midwest US, used our eCommerce Child Theme, RoyalCommerce to create a new website for their client, Source. Eat Fit. And the result is stunning!

So in case it wasn’t clear, premium child themes are absolutely for professionals! Now let’s take a look at where you can get them.

The Best Places to Buy Premium Divi Child Themes

There’s quite a few places to buy premium Divi Child Themes, so we’ve compiled a list of several of the most popular places in the Divi Community.

Here’s the criteria we used when putting together this list:

  • They’ve been in business making child themes for at least 1.5 years. There’s a lot of companies that sprout up and create a child theme, then sort of disappear. We want to make sure we’re only recommending companies that have proved they’re in it for the long-haul, and are committed to supporting their customers long term.
  • They have a minimum of two child themes and are likely to create more.
  • They have released a new child theme within the last 6 months.
  • They have a reputation in the community for creating excellent child themes and providing excellent customer support.

So here’s the list of the best places to buy premium child themes for Divi!

1. Divi Life

That’s right, you can find Premium Divi Child themes right here on our own website! Sure, we may be a little biased, but our Divi eCommerce child theme, RoyalCommerce was the very first eCommerce child theme and to this day remains the most popular eCommerce child theme for Divi, as well as one of the most popular child themes overall! Within the last couple of years, we’ve been known for our popular Divi Plugins, such as Divi Overlays and Divi Bars. However, this year, our portfolio of high quality child themes is growing (as shown with Divi Business above), so check back often as we have A LOT of child themes (as well as new plugins) in the pipeline!

2. Divi Space

One of the best places to buy premium child themes for Divi is over at Divi Space. Not only do they have one of the largest collections of child themes, but their products are of the highest quality, backed by top notch support. Plus, the team at Divi Space are close friends and partners with us here at Divi Life! We’ve collaborated on things such as our Divi Business Expert online course, WP the Podcast, and the Ultimate Divi Bundle. We couldn’t recommend Divi Space and their products enough!

3. B3 Multimedia

B3 Multimedia has some of the best designed child themes in the entire Divi community. Each child theme is designed to pixel perfection, and looks great on all devices. B3 also does a good job catering to specific niches. For example, their Divi Estate child theme is by far the best Real Estate Divi child theme in existence!

4. Superfly

Superfly, previously known as “Elegant Child Themes” has been creating awesome child themes for Divi since the beginning! They were one of the first companies to start creating and selling child themes, and the quality of their designs has continued to get better and better. Their products are so popular, that you can’t talk about premium Divi child themes without mentioning some of their fan favorites such as Josefin, or Anthem.

4. Divi Soup

Divi Soup is the company and brand for Michelle Nunan, a well respected leader in the Divi community. Among being one of the first to create premium Divi Child Themes, Michelle continues to offer high quality products that her customers love! Divi Soup has some beautiful child themes that target specific niches such as podcasters, online course creators, coaches, and more!

4. A Girl and Her Mac

A Girl and Her Mac, aka Leslie Bernal is also one of the early child theme creators of the Divi Community! Leslie is a good friend to us here at Divi Life (in case you didn’t notice our logo on her Mac). Leslie is amazingly talented and continues to design extremely unique designs that people can’t keep their hands off of!

5. Sunflower Child Themes

Sunflower Child Themes has been creating gorgeous and functional child themes for some time now! Tammy Grant and team do a fantastic job at not just creating beautiful child themes, but creating child themes that are unique as well. Their latest creation, Krane, is a perfect example of that 🙂

That’s it! Did we miss any?

If there’s any others that meet our criteria outlined above that aren’t on our list, please feel free to let us know in the comments below!

And you may be wondering why we didn’t list any Divi marketplaces above. It’s pretty simple actually. Since marketplaces don’t support (or create) the products themselves, they don’t meet our criteria. And, the quality of the products (in both design and coding) as well as the quality of the support vary greatly from vendor to vendor.

However, they’re still worth mentioning in this guide. Below you’ll find several Divi marketplaces, listed in alphabetical order:

If you’d like a single place that shows every single Divi Child Theme in existence, we highly recommend checking out the child theme page on Divi Theme Examples.

Craig, the owner, does an amazing job of curating and organizing the list! You can look at different categories, view ratings, and more.

Wrapping Up

We hope this Ultimate Guide on the Divi Child Theme has been helpful for you! Feel free to refer back to it as many times as you’d like. And if it was helpful, please feel free to share it as well! I would greatly appreciate it.

Also, if there’s something I missed that you think should be included, or if you have some questions, then please feel free to let us know in the comments below!

And don’t forget to subscribe to our email list (form below above footer) so you can be notified when we release new tutorials and guides like this!

Have a Question or a Comment? Let Us Know Below!

4 Comments

  1. Maciej

    Thank you for the mention Tim 🙂 Anyways, it’s very informative and actual post! Great job!

    Reply
    • Tim Strifler

      Thanks Maciej! And you’re welcome! Thanks for creating awesome child themes 🙂

      Reply
  2. Tammy

    This is good tutorial about child themes Tim. Thanks for the shout out too 🙂 !

    Reply
    • Tim Strifler

      Thanks for the kind words, Tammy! And you’re very welcome 🙂

      Reply

Submit a Comment

Your email address will not be published. Required fields are marked *

We're creating more tutorials!

Subscribe and we'll notify you when we publish more tutorials and blog posts similar to this. :)

 

We protect your email & never spam.

You have Successfully Subscribed!

Pin It on Pinterest

Share This