One of the most important things you can do when customizing your Divi website is to use a Divi child theme. A Divi child theme allows you to make all the changes you want to your Divi website without worrying about losing your changes the next time there’s a Divi update.
In this guide, we’ll look at what child themes are, why you need them, how they’re different from layout packs, and how to create your own and sell them. We’ll even include a look at some popular Divi child themes in several price ranges.
What is a Divi Child Theme
A child theme is a WordPress theme that inherits its functions and styling from a parent theme, allowing you to make changes to the child theme without affecting the parent theme. You can style them with CSS sheets, embed shortcodes and JavaScript, and add your own PHP. You can make a child theme for any WordPress theme, including Divi and Extra.
The child theme is installed like a normal theme, but it doesn’t have the core functions within its own files. It takes those functions from the parent theme. This means the parent theme must be installed in order for the child theme to work. Child themes can even add pages, menus, and embed or install plugins.
There are two types of child themes:
Blank child themes look exactly like the parent theme (they have no edits in their style.css or functions.php files). They provide a starting point where you can make changes or even create a child theme package that can be reused on other websites. You can create them by hand, with a child theme generator, download them, or create them with plugins.
Pre-designed child themes have already been designed and made into an installable package. They include elements such as pages, menus, styling, embedded code, etc. They’re basically a turn-key package that can create specific types or general websites. You simply activate it, import the styling according to the installation instructions, and add your content. You can also use them as a starting point and customize them further to create your own design. They can be updated separately from the parent theme. You can also use them on multiple sites if the license agreement allows for it.
Why Should You Use a Divi Child Theme
One of the advantages of WordPress is that we have access to the code. We can add CSS to the style sheet, add JavaScript to the theme’s functions, customize the PHP, and lots more.
The problem with making changes to these files is they will be written over when the theme updates. This means we would lose all of the edits we’ve made in the code. In order to keep the edits, we would have to stop updating the theme.
This is why we shouldn’t make our edits in the original, or parent, theme. Instead, we should create a child theme and make our edits in that theme’s files. Child themes have their own CSS style sheets, functions, etc. You can make all the changes you want and when the parent theme updates the code in the child theme remains intact.
Another advantage is the ability to reuse or change Divi child themes. You can create a design you like in one child theme, and then upload another child theme to try a different design without losing the original design. You can also create an installable package and upload the child theme to other Divi websites.
Being able to reuse the child theme opens up a lot of possibilities to save design time and even sale your designs. This is one of the greatest advantages of Divi. Divi has a large marketplace with professionally designed child themes that give you a great place to start with your website design.
Of course, it’s possible to use Divi without a child theme. If you’re just changing the layout, colors, or adding CSS to the theme customizer, then a child theme isn’t critical. Many recommend using a child theme regardless of the types of changes you’re making, and there really isn’t a good reason not to.
Difference Between a Divi Child Theme and a Layout Pack
Divi child themes are much different than Divi layout packs. While child themes include style sheets, PHP, menus, etc., and are installed like a regular theme, Divi layout packs are imported into the Divi Library and are used like any layout that’s built into Divi or saved in the library.
Layout packs can include the design for every page you need, but you have to create the page and import the layout to it from the library. You’d also have to build the menu yourself.
They can include styling within the page elements and some include CSS that you can paste into the theme customizer or the page itself.
You can mix and match layouts, sections, or modules from multiple layouts easily. They provide a great place to start in your website design, but in order to make changes to the CSS style sheet or add code, you still need a child theme.
How to Make a Divi Child Theme
There are several ways to make a child theme for Divi. Let’s take a look at a few easy methods. These methods work with both Divi and Extra. You’ll have to identify which theme the child theme is for.
Manual Method
To create the child theme manually you’ll need a text or code editor such as Notepad, Notepad++, Sublime, Brackets, etc. You’ll also need an image editor if you want to include a theme image for the theme’s menu to display.
If you’re customizing the files and uploading them as you make changes, you’ll need an FTP client such as FileZilla.
Create a folder on your computer and give it the name of your child theme. Be sure to use a unique name. If the name is shared by another theme WordPress will try to update your child theme when that theme has an update. Inside your child theme folder create three files: functions.php, style.css, and screenshot.jpg (or png). Add an ‘includes’ folder for other files such as JavaScript.
Create a file called functions.php. Add the code below.
<?php
function my_theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
Here’s how it looks in Brackets. Unless you want to add PHP, this is all you’ll need for this file.
Create a file called style.css and paste in the code below.
/*
Theme Name:
Theme URI:
Description:
Author:
Author URI:
Template:
Version:
*/
/* =Theme customization starts here
------------------------------------------------------- */
Enter the information for each section. Here’s a look at what the sections are:
Theme Name – make sure to use a unique name that isn’t used in the WordPress depository or any other marketplaces. WordPress doesn’t know the difference. If you use the same name as any other WordPress theme, then WordPress will want to update your child theme when that theme updates.
Theme URI – this is the webpage that shows the theme. It’s optional.
Description – this is a short description just to remind you of what this child theme is. If you’re creating the child theme for a client then you’ll want to be as descriptive as possible and use this area to describe the project.
Author – this is any name you want to go by in the world of Divi. It isn’t required, but it is helpful if you share the theme or if you’re creating it for a client. This way they know who to contact if they need more work done, making this a good marketing strategy.
Author URI – same as the author name, it isn’t required to add your web address, but it can be handy if someone needs to find you.
Template – this identifies if the child theme is made for Divi or Extra. It’s important to use the correct parent theme or the files won’t work.
Version – I always leave this at default, but you use this any way you need to.
Here’s my example in Brackets.
Create a JPG or PNG image. Lots of sizes work, but 800 x 600 is an ideal size. Name it ‘screenshot’.
Once you’ve created your files zip the folder. It’s now ready to upload. If you want to make changes to these files after you’ve uploaded the child theme you can upload the individual files via FTP.
Divi Child Theme Makers
A Divi child theme generator does the same work as the manual method, but all you need to do is fill in the information in a form and select an image. The generator creates the blank child theme that you can download.
The child theme generators are web-based. There are several available on the web designed specifically for Divi and Extra. Here’s a look at a few generators and how to use them.
The Divi Cake Child Theme Generator is a simple generator that creates the style, functions, and screenshot files. It works with both Divi and Extra. All of the fields with asterisks are required.
Child Theme Name – use a unique name so WordPress doesn’t try to update your child theme when a theme with the same name updates.
Version Number – use any version number you want.
Author Name – Add your name here. This is helpful if you’re creating it for a client or want to remember that you created it.
Author URI – this is your web address in case someone wants to contact you.
Parent Theme – this determines if the child theme is made for Divi or Extra.
Theme Screenshot – this is where you upload the image that will display in your themes menu in the WordPress dashboard. Create a JPEG or PNG image up to 2MB.
Child Theme Description – this is a short description just to remind you of what this child theme is. If you’re creating the child theme for a client then you’ll want to be as descriptive as possible and use this area to describe the project.
Your Email – this is the email address that the child theme will be sent to.
The zipped file will include the functions.php, screenshot, and the style sheet. You’ll need to unzip the child theme if you want to modify these files before uploading to your Divi website. If you’re adding code, then I recommend testing the code on a test site before uploading it to your live site.
The functions.php file includes some comments and the basic PHP functions.
The CSS stylesheet includes the information you entered in the theme generator.
Divi People
The Divi and Extra child theme generator from Divi People includes the same basic information as the previous theme generator but adds a few more fields giving you more control. It’s based on dvppl-child-theme from github, and it’s currently still in beta. I tried it and it works great.
Here are the new fields:
Theme Slug – rather than generating the slug for you based on the child theme’s name, you have full control over the slug.
License – specify any license you want to use for your Divi child theme.
License URL – include the URL for the license of your choice.
The child theme is downloaded to your desktop, so your email address is only used if you want to subscribe to the newsletter.
It adds a few new features that are not usually seen in a child theme generator. The features are disabled by default so you can enable the features you want. Enabling them creates a new set of folders with files you can customize, which gives you a lot more control over your Divi or Extra child theme. The features include:
Remove Divi Project – removes the project custom post type that’s sometimes used for portfolios.
Login Page Customizer – creates a custom login page for your child theme.
Support SVG – adds SVG support to the child theme.
Global Heading Customizer – styles the H1-H6 headings.
Divi Hooks Customizer – hooks your custom content or code, such as shortcodes or JavaScript, in the Divi hook locations.
The downloaded file includes the expected style, Functions, and screenshot files, and then adds a CSS, includes, and js folders, and a changelog text file.
The ‘includes’ folder has the files for your hooks, global headings, login, and SVGs. You can add them here before uploading or customize in the theme editor. Including them in the downloadable child theme saves some customization time.
The theme editor includes all of the folders and files including styles, functions, CSS, js, includes, hooks, and index. You can edit them here or edit them offline and upload via FTP or copy and paste.
Installing the Child Theme
Installing a child theme is the same as installing a parent theme with one exception: pre-designed child themes require an extra step in order to import the layouts. Here’s a look at how to install the child theme for both blank and pre-designed themes.
Installing a Blank Child Theme
With Divi activated, upload and activate your child theme like any other theme.
The child theme will then be active and show the title and image you chose. If you didn’t add an image it will look like the one on the bottom left in this image.
It will show the theme details that you added in the CSS style sheet. The site itself will not change unless you’ve added styling or code to the files before uploading them.
You can now make changes to the CSS style sheet and the functions PHP file. When Divi updates, your code will remain intact.
You can also upload or modify the style sheets and function files from your host’s cPanel or via FTP. To find the files, in your host’s cPanel go to File Manager > your domain (if you have more than one installed on the server) > wp-content > Themes > your child theme.
Installing a Premade Child Theme
Install the child theme in the same way and for a blank child theme, but once the child theme is activated you need to import the data. There are several ways this can work. One popular method is to include a new menu item with the name of the child theme. This can be in the dashboard, within the Divi menu, within Settings, etc. In this example, hovering over the menu item shows a link called Import Demo Data.
This opens a page with information about the demo. In this case, the child theme requires plugins. The plugins are identified and it includes a link to install them, activate them, or dismiss the notice. To install the demo content click Import Demo Data. Wait for the import to finish and your website will then look like the demo (some include placeholder images). Replace the demo content with your own and your site is ready.
How to Earn with Divi Child Themes
You can earn extra income with your Divi child themes. Well-designed child themes are in demand. They save the buyer both money and time because they don’t have to hire a professional designer and they can get their website started faster. They can also get features that are not available in layout packs.
Selling your child themes helps build your brand. There are two easy ways to sell them: in the marketplaces and from your own website. Let’s look at how they work and the advantages and disadvantages of both options.
Marketplaces
Selling from the marketplaces reduces your marketing and hosting costs. Buyers often go to an online shop to search for child themes. These marketplaces get lots of traffic and they put a lot of effort into getting that traffic.
You upload your files, images, descriptions, keywords, set the prices, and provide support. They provide a dashboard where you can see your sales stats and manage you’re your products. You’ll also have a profile page for information about you and your contact information.
They handle the sale, answer sales questions, include your child themes in their marketing materials, and host the files for download. They market through multiple channels including their websites, email, social media, and more.
The marketplace will get a portion of the sale, which is usually somewhere around 30%. Also, your products are placed with many other child theme developers, so it might be difficult to stand out from the crowd. Also, the customers are not your customers so you can’t build relationships with them directly.
Your Own Shop
Selling from your own shop means you don’t have to share revenue with the marketplaces. You have direct access to your customers so you can market to them through email and social media. You can build your social media following and email list.
You can target your customers based on their buying habits, allowing you to run sales and make special offers based on what they’ve purchased before.
This requires an extra level of marketing and you’ll have to build the store into your website. The online store is easy to build with plugins such as WooCommerce or Easy Digital Downloads.
Divi Child Theme Examples
There are lots of excellent examples in the marketplaces. Here’s a look at a few that are available here on this website.
Bright
Bright was made with agencies in mind. It features a slide-in for contact forms or other Divi modules, an image grid with hover effects, a CTA in the menu, a custom footer, and 14 pages. Pages include a squeeze page, 404 page, a thank you page, and lots more.
Price $67 | More Information
Brand
Brand is a multi-purpose child theme with demos for landscapers, veterinarians, and chiropractors. It’s designed to show your services with conversions in mind. It includes a custom top bar, CTA in the menu, services menu, custom footer, animations, a contact form in the header, and 12 main pages, and a 404 page.
Price $67 | More Information
Majestic
Majestic is a multi-purpose child theme designed for local business. It includes a custom top header, slide-in contact form, custom footer, CTA in the menu, services menu, animations, 9 main pages, and a custom 404 page.
Price $67 | More Information
Webly Pro
Webly Pro is a multi-purpose child theme with business websites in mind. It includes a slide-in contact form, custom header, custom footer, CTA in the menu, 12 main pages, 404 page, squeeze page, and animations.
Price $67 | More Information
Mammoth
Mammoth is a multi-purpose child theme designed with service business in mind. It includes 11 pages, 404 page, animations, hover effects, custom footer, CTA in the header, custom category page, and more.
Price $47 | More Information
Advice
Advice is a multi-purpose child theme with small business in mind. It includes 8 main pages, a 404 page, animations, CTA in the header, custom header, custom footer, sticky menu, and more. Add any Divi modules in the header and footer.
Price $37 | More Information
Conclusion
Divi child themes provide a lot of benefits. A few benefits we’ve covered in this guide include:
- You won’t lose your customizations when Divi updates.
- They can include features not found in layout packs.
- They’re easy to make.
- You can purchase pre-designed child themes and save time and money on professional designs.
- You can even reuse and sell your Divi child themes.
You don’t even have to know what goes into creating them or understand how they work in order to use them. Considering how easy they are to make with Divi child theme generators and use, there’s no reason not to use them.
If you’re looking for professionally designed Divi child themes to help you get a head-start on building your website, there are lots of great choices available here in the Divi Marketplace.