fbpx
Kristen Leigh | WordPress Web Design Studio | January 2019 Monthly Review of My Web Design Studio | 3 Secrets to Quickly Building a Divi Website

quickly build a divi website

OK… I want to preface this post by saying designing a website that actually helps a business achieve their goals isn’t just a quick thing that can be done in a day. It’s a process and it takes time.

For example, I always start out by diving into the struggles faced by the business or entrepreneur and their overall goals. This is the foundation that shapes the website design. Because what’s the point of having a website that doesn’t help you achieve your goals?

That’s a trick question – there isn’t a point.

But once the design has been created using Adobe Illustrator, building the website in Divi shouldn’t take you weeks.

Here are a few secrets to help you quickly build a Divi website!

use the SITE-WIDE settings

A website that builds brand recognition is one that has a consistent look and feel. Selecting and sticking with 2-3 fonts, 3-5 colors, and one button style are examples of how to keep your look and feel consistent throughout every single page on your website.

But sometimes, you add a background color or some sort of design and all of a sudden the button you normally uses disappears because it’s the exact same color as the background. So you want some flexibility, right?

Divi allows you to do both of these things. What saves you time is using the site-wide settings and then making small adjustments on individual pages.

How to use the site-wide settings

From the dashboard hover over Appearance and click on Customize.

Kristen Leigh | Web Design Studio | How to Quickly Build a Divi Website | Appearance Customize Menu

Now you should be on a page that shows your website on the right and a menu of options on the left. In the left hand menu you want to focus on General Settings and Buttons.

General Settings

Under General Settings click on Typography. This is where you will set your fonts (both body text, headers, and links), text sizes, line heights, letter spacing, and font colors. As you make changes, you’ll see them reflected on the right of the screen using a page from your website. These will be the default settings used on all pages of your website so make sure they’re exactly what you want to be used on a majority of your website!

Kristen Leigh | Web Design Studio | How to Quickly Build a Divi Website | Typography Settings

Kristen Leigh | Web Design Studio | How to Quickly Build a Divi Website | Typography Settings

After making changes using your branding and style guide, click the Publish button at the top of the menu.

Buttons

Now click the back arrow in the left hand menu a couple of times to get back to the main menu. Once you’re there click on Buttons. You’ll want to update both the Buttons Style section and the Buttons Hover Style. Again, make sure the settings you use are what you want to see on a majority of your website – that’s the trick to quickly building a Divi website!

Kristen Leigh | Web Design Studio | How to Quickly Build a Divi Website | Button Styles

Kristen Leigh | Web Design Studio | How to Quickly Build a Divi Website | Button Hover Style

saving and using templates

Divi has the capability of savings content as templates. Sections, rows, modules, and entire page layouts can be saved in a library for use elsewhere.

How to save a section, row, or module as a template

When you’re in the Divi visual builder hover over a section (blue outlines), row (green outlines), or module (gray outlines) to see a menu of new options appear in the top left hand corner of that area. The fourth option in the menu is a down arrow with a circle around it. This is the Save Section to Library button.

Kristen Leigh | Web Design Studio | How to Quickly Build a Divi Website | Section Menu

After you’ve designed a section, row, or module you want to save for future use click the Save Section to Library button. You have the option to save to the library or create a new category to save it under to create a bit more organization.

Pro Tip: Make sure you give it a descriptive name so you know exactly what it is in the future. There’s nothing worse than having to open every template to see what they look like because the names aren’t descriptive enough!

How to use a saved template

Now that you know how to save templates, how exactly do you find them again?

While you’re building a new page on your website, you can add saved templates super easily. Determine if you want to add a saved section, row, or module first. Then, click the corresponding plus button to add a new section, row, or module.

When you click the plus button, you’ll see two options in the top menu. The second option is always Add From Library. This is where you will find your library of saved templates. Here you can filter by category (if you have any) or scroll through your saved templates. Locate and click on the template you want to use, wait, and watch it load onto the page.

That’s it! Now just add your new content to the section, row, or module. Easy as that, seriously.

duplicating an existing page

Let’s say you have blog on your website and you want all posts to follow the same structure. Why waste time rebuilding the exact same layout over and over again? Chances are you’ll forget some of the settings and have to go back and forth between an old post and the new one to get them to be exactly the same.

At the bottom of the page you’ll either see the big purple circle with 3 dots or the 7 purple circles confirming that the menu is open. You want the menu open.

Kristen Leigh | Web Design Studio | How to Quickly Build a Divi Website | Menu

Click the small purple button that has a plus sign icon in it. This is the Load from Library button. The third option in the top menu will be Your Existing Pages. Click this, find the page or post you want to use and select it. If it asks you to overwrite the current page, do it!

Kristen Leigh | Web Design Studio | How to Quickly Build a Divi Website | Load From Library

Now you have the design from an existing page or post in a matter of seconds. Easy right?

There you have it, 3 ways to quickly build a Divi website. Remember… build, not design. Take time designing your website. It’s so, so, SO important!

-Kristen

You might also like…

*Hey hey! This post contains affiliate links. I don’t promote products, tools, or services I’ve never used before or that I don’t absolutely love. By clicking the link and making a purchase, I may receive a percentage of the sale.

Kristen Leigh | Web Design Studio | January 2019 Monthly Review of My Web Design Studio | 3 Secrets to Quickly Building a Divi Website
Kristen Leigh | WordPress Web Design Studio | Secrets-to-Create-Your-Own-Website-Fast
Kristen Leigh | WordPress Web Design Studio | How to Use the Divi Theme to Build a Website Quick
Kristen Leigh | WordPress Web Design Studio | How to Build Your WordPress Website With Divi

Grab Your FREE Guide!

Kristen Leigh | WordPress Web Design Studio | 3 Ways to Increase Sales and Attract High-End Clients Using Consumer Psychology on Your Webiste

*I promise to never spam you or share your email address with anyone else!