How to easily setup a Local Development Environment for Divi

UPDATE (June 29th 2021): As of version 6.0 of Local by Flywheel they have made the PRO features FREE to anybody using the software, we think that is pretty awesome! More on that here.

One of the best tools you can use to be more efficient as a Divi designer is to set up a local development environment for projects you are starting on or ones that you are already working on. In this post we are going to talk a little about what a local WordPress development environment is, why you might want to set one up, then show you how to set one up using one of our favorite tools.


What is a Local Development Environment?

It basically means that instead of building your sites live on the internet, you build them locally on your machine. This is done by setting up a server environment similar to that which you would find on most web hosting services. This is amazing for your workflow because when you’re building a Divi site in your local development environment it looks and acts exactly the same as it would if you were building online because all the files and databases are stored locally.

Why setup a Local Development Environment for your Divi projects?

It cuts down on development time

The ability to rapidly deploy a WordPress install with Divi already activated and configured to your preferences makes the entire process very zippy.

Gives you the ability to work offline

Don’t be bound by the tethers of the internet 24/7. Since your computer is your website’s host, you can work when and where you want.

Does not impact production sites

You can test changes and updates to your production sites offline before making them live. This ensures a greater customer experience and avoids headaches with things like plugin conflicts.

Gives you a playground to test new plugins or skills you're learning

When you’re learning Divi or WordPress, it is great to have a place you can practice that does not require you to register a domain or pay for hosting. It is also a great spot to check out new plugins before rolling them out to production sites.

PRO-TIP: To find some fantastic tutorials, snippets, and guides, check out the Divi Engine Blog for some great resources!

Ok, so how do I setup a Local Development Environment for Divi?

Great question! We know it might sound somewhat complicated to set one up, but it can be pretty easy, we promise.

The 2 most commons ways to set up a local development environment are:

Local Server Stack

A local server stack, such as LAMP (Linux Apache MySQL/MariaDB PHP) or WAMP (Windows Apache MySQL/MariaDB PHP) is a server (much like the server that runs on your webserver), which you will configure on your local machine. You can get pre-packaged stacks like MAMP for Mac users, or XAMPP for both Mac and Windows users, that will take the headache out of getting everything configured.

Virtualized Environment

A virtual development environment is a development environment set up on a virtual machine. Using virtual machines allows you to copy existing Divi WordPress sites, choose your server location, and even quickly delete sites once you’re finished and they’re published online. Some popular tools to do this are Desktop Server, WP Stagecoach, and Local by Flywheel.
For this post, we are going to cover downloading and setting up a Virtualized Environment using Local by Flywheel which is 100% FREE.

Setting up a Virtualized Development Environment

To follow along, we first need to download a few things.

Downloading & Installing Local by Flywheel

Head over to the Local by Flywheel site and download it for your platform.

Once you have it downloaded, continue to install it.

Downloading & the Divi Theme

Head over to the Elegant Themes site and log into your account.

Once logged in, look for “Divi” in the Downloads tab. Click the “download” button to get the zip file. Be sure to save this somewhere you can easily find it a little later.

Getting started with Local

Step 1

When you run Local for the first time it will ask you to Create a New Site, so let’s click that button.

Local Dashboard with No Sites

Step 2

This will launch the setup wizard for our new WordPress site. It asks you to enter a name for our new site, so be sure to use something descriptive. We used “Local Tutorial”. Click Continue.

New Local Site

Step 3

In the next step, we get the option to select either the “Preferred” or “Custom” setup. We recommend going with preferred for now. Click Continue.

New Local Site
NOTE: The custom option allows you to configure the virtual server environment along with some options regarding which packages are installed. Most users don’t need to worry about this.

Step 4

Here on the last step, we set the actual WordPress settings, so enter your desired username, password, and email. These are the same settings you will use to log into the dashboard of your new local WordPress install. Click the Add Site button.

New Local Site
After a few moments, and a password prompt or two, you’ll see your site listed on the left of your window, along with all the details of your new site on the right.
You can now easily log into your dashboard by clicking on that Admin button and entering the username/password combo you set up in the previous steps.
Local Dashboard
From here things should feel pretty familiar because like we said, everything will work and look like you are on a site that is live on the internet. You should now go ahead and install the Divi Theme with the zip file you downloaded in the earlier steps.
Wordpress Login Page

Local features you will want to use

Now that you have Divi install and configured on your local development environment the real magic begins. Let’s take a look at our two favorite features Local has to offer.

Cloning Divi Sites

With Local you can easily clone any site that you have set up using the wizard. Take for example that you followed the steps so far and installed and configured Divi with your favorite plugins. Instead of having to redo all those steps, all you need to do is clone the site you made in the previous step, all it takes is few quick steps.

Step 1

Right-click on the site you want to clone in the Local Dashboard.

Step 2

Click Clone.

Step 3

Simply name the clone, and you are done, my friend! How amazing and easy is that?

Clone Divi Install in Local
Think about this for a second…ready?

Ok, let’s say you build a ton of Pizza sites and it takes you a few hours to configure and setup all the plugins. Creating a template site and just cloning it for future projects would save you all that time! This feature is a real game-changer for your workflow.

Live Previews

Yeah, this is not an error, you can share live previews of your Divi project right from Local on your local development environment and it couldn’t be easier.

Step 1

Select the site that you want to share in the Local Dashboard.

Step 2

Click on Enable next to Live Link at the bottom of the screen.

Step 3

After a few seconds, it will indicate that the site is now live. Now you can simply hit that copy button and share it with your client. So simple!

Make Divi Install Live in Local
No more weird situation where you need to push changes to a live site for a client to look at. This is especially helpful for some rapid iterations or client feedback.


We hope this introduction into the world of local development environments was helpful to your and your workflow when working on Divi projects. It can really impact the speed and efficiency of you and your team, which means you can handle higher workloads, which means you can run a more successful web design business.

Please consider checking out Flywheel and the professional hosting services they offer using our affiliate link by clicking the button below.


  1. The sites I build in Flywheel using the Divi theme look fine when I’m in the visual builder but as soon as I turn it off to preview my work it doesn’t show up. I’ve tried clearing the cache, etc. but nothing seems to work. I’ve been using Flywheel for years with no issues with Elementor, building sites from scratch or other WP themes.

    • Can you try disabling static css file generation in Divi > Theme Options > Custom CSS?

      • Same issue here. I did what you suggested, but it did not worked. Anything else?

        • The only solution is to delete everything in /wp-content/et-cache/ and refresh page. Then the changes will be reflected. I have been looking for the automatic clearing of cache as well

Submit a Comment

Explore more from Divi Engine