Source: https://divicake.com/blog/divi-layout-packs-how-to-use-and-customize-them/

[Blog](https://divicake.com/blog/)/[Blogging](https://divicake.com/category/blogging/)

# Divi Layout Packs: How to Use and Customize Them

By Divi Cake·31 August 2024·Updated 19 August 2026·6 min read

Divi Layout Packs: How to Use and Customize Them

We may earn a commission from affiliate links in this post. [Disclosure policy](https://divicake.com/affiliate-disclosure-policy/)

On this page

- [Applying a Premade Layout in Divi: Step-by-Step Guide](https://divicake.com#applying-a-premade-layout-in-divi-step-by-step-guide)
- [Using Premade Layouts in Divi: Enhancing Your Website Design](https://divicake.com#using-premade-layouts-in-divi-enhancing-your-website-design)
- [Final Result After Successfully Downloading and Applying the Premade Layout](https://divicake.com#final-result-after-successfully-downloading-and-applying-the-premade-layout)
- [Customizing Your Divi Layout](https://divicake.com#customizing-your-divi-layout)
- [Customizing the Blurb Module Layout: Icon and Text Adjustments](https://divicake.com#customizing-the-blurb-module-layout-icon-and-text-adjustments)
- [Customizing Icon Alignment and Shape in Divi Blurb Modules](https://divicake.com#customizing-icon-alignment-and-shape-in-divi-blurb-modules)
- [Final Results: Customizing Images, Text, and Icons in Divi](https://divicake.com#final-results-customizing-images-text-and-icons-in-divi)
- [Conclusion](https://divicake.com#conclusion)

Are you looking to easily apply and customize [Divi’s](https://divicake.com/go/divi/) premade layout packs? You’re in the right place! In this blog post, we will guide you step by step on how to use and personalize these layouts to create stunning pages for your website. Starting from the WordPress dashboard, we’ll walk you through every detail, ensuring that you can seamlessly [transform your Divi site using its powerful visual builder](https://divicake.com/blog/getting-started-with-divi-using-the-divi-builder/) and customization features. Whether you’re a beginner or seasoned user, this guide will help you get the most out of Divi’s premade layout packs.

## Applying a Premade Layout in Divi: Step-by-Step Guide

Make sure you are logged into your [WordPress](https://divicake.com/blog/wordpress-tutorial/) dashboard. Hover your mouse over your website name (in this case, mine is “My Divi Practice” on a local server, but yours will show your actual domain). Click on “Visit Site” as shown in the image below. Once the site opens, select the page where you want to apply the premade layout. For instance, if it’s the “Home Page,” click on it in the menu, as shown in the illustration. Next, click Enable Visual Builder to access the visual editor. Scroll down, click on the Plus icon, and continue with the next step for further guidance.

Navigating WordPress to enable Divi Visual Builder and select a page for layout customization.

Applying a Premade Layout in Divi: Step-by-Step Guide

Read More: [25 Best Free Divi Layouts in 2024 (Download Today)](https://divicake.com/blog/free-divi-layouts/)

## Using Premade Layouts in Divi: Enhancing Your Website Design

In this step, we will build upon the previous one. After clicking on the Plus icon, you will see three options: Premade Layout, Your Saved Layout, and Your Existing Page. Choose Premade Layout, where you will find various options to select from, as shown in the next step. Pick one that fits your website’s needs. After selecting a layout, click on the green button labeled Use This Layout. The layout will begin downloading, and you can monitor the progress bar. Once the download is complete, we will show you the results in the next step.

Selecting and downloading a Divi premade layout to customize your WordPress page.

Using Premade Layouts in Divi: Enhancing Your Website Design

Read More: [Getting Started with Divi: Using Divi Layouts](https://divicake.com/blog/getting-started-with-divi-using-divi-layouts/)

## Final Result After Successfully Downloading and Applying the Premade Layout

In the image below, you can see the result after successfully downloading and applying the premade layout packs to your Home page. This example demonstrates how the layout transforms your page’s appearance. You can follow the same steps for every other page on your website to achieve a consistent, professional look across your site.

Result of applying a Divi premade layout pack to a WordPress Home page, showcasing the transformed, professional design.

Final Result After Successfully Downloading and Applying the Premade Layout

Read More: [11 Divi Layouts and Child Themes for Spa and Wellness Websites in 2024 (Free & Premium)](https://divicake.com/blog/spa-wellness-divi-child-themes-layouts/)

## Customizing Your Divi Layout

In this step, we’ll guide you through customizing your Divi layout to match your desired design. [Divi](https://divicake.com/go/divi-404-error-page-layout-bundle/) is renowned for its user-friendly drag-and-drop system, which simplifies the customization process. To begin, double-click on any text module to access its settings, where you can enter your preferred title and description. For more text modifications, hover over the module settings icon, click on it, and go to the Content setting to change the text from domy to your own text. If you want to change colors and design of text you must go to Design Settings.

Next, customize the background by locating the background settings within the module options. You can choose from several options, including background color, background gradient, background image, or background video, depending on what best suits your design requirements.

In the Design section, you can further tailor the module’s appearance, including adjustments to text, images, and layouts, aligning them with your website’s aesthetics. For advanced users, the “Advanced” settings offer the ability to incorporate Custom CSS, which allows for more intricate design customizations.

For a deeper understanding of these features and how to utilize them effectively, refer to our comprehensive Divi customization guide.

Customizing Divi layout with text settings, background options, and advanced design features.

Customizing Your Divi Layout

Read More: [9 Divi Layouts and Child Themes for Fashion Websites in 2024](https://divicake.com/blog/divi-layouts-child-themes-for-fashion/)

## Customizing the Blurb Module Layout: Icon and Text Adjustments

In this section, we’ll show you how to customize a single module that includes both an icon and text which is Blurb. While we previously discussed how to change the text, here we focus on adjusting the icon within the module. To begin, click on the black module settings icon and navigate to the [Content Setting](https://divicake.com/blog/getting-started-with-divi-content-settings/) to edit your text. Once your text is updated, switch to the [Design](https://divicake.com/blog/design-image-galleries-with-divi-step-by-step-guide/) [Setting](https://divicake.com/blog/getting-started-with-divi-design-settings/) and locate the Image & Icon settings, as illustrated below.

Here, you can select a new icon or image, adjust the alignment, and customize the color to match your site’s design. After making these changes, you’ll have a customized module that fits seamlessly into your page. We will continue with more advanced steps in the next section to enhance your Divi layout further.

Customizing a Divi module with text and icon adjustments, including selecting a new icon, aligning, and coloring.

Customizing Divi Icon and Text Modules

## Customizing Icon Alignment and Shape in Divi Blurb Modules

Now, scroll down to find the Alignment option, where you can choose between three alignment settings: Left, Center, or Right. Adjust the alignment based on your design preference. Additionally, there is an Icon On/Off toggle, allowing you to display or hide the icon depending on your needs.

Further customization is available through the Icon Shape option, where you can select the best shape for your icon, as shown in the image below. By following these steps, you can tailor the entire premade layout module by module, creating a cohesive design for your website.

Adjusting icon alignment (Left, Center, Right) and shape options in Divi, including toggling icon visibility.

Customizing Icon Alignment and Shape in Divi

Read More: [Grow a Free Divi Layout Pack for Business Owners](https://divicake.com/go/grow-a-free-divi-layout-pack-for-business-owners/)

## Final Results: Customizing Images, Text, and Icons in Divi

The final result is shown below in the screenshot, where we’ve successfully customized the images and text to match our website seamlessly. We’ve also changed the icon’s color and shape to suit our design needs. This demonstrates how easily you can transform a premade Divi layout into a personalized website. With practice, you’ll master this process in no time, achieving your desired results effortlessly. Keep practicing, and you’ll be customizing your website like a pro in no time!

Customized Divi layout with updated images, text, icon color, and shape

Final Results: Customizing Images, Text, and Icons in Divi

Read More: [Hair Salon Home Page Divi Layout](https://divicake.com/go/hair-salon-home-page-divi-layout/)

## Conclusion

In this guide, we’ve explored how to effectively use and customize Divi’s premade layout packs to enhance your website’s design. From the initial setup in your WordPress dashboard to the final touches on individual modules, you now have a comprehensive understanding of how to make these layouts your own.

You began by navigating to the WordPress dashboard and applying a premade layout to a specific page. We detailed how to access the visual builder, select a layout, and monitor its download progress. This foundational step is crucial for setting up your page with a professional look quickly and efficiently.

Next, we delved into the customization process, demonstrating how to tailor the layout to match your website’s unique needs. Using Divi’s intuitive drag-and-drop interface, you learned how to modify text, adjust backgrounds, and utilize the design and [advanced settings](https://divicake.com/blog/getting-started-with-divi-advanced-settings/) to refine your page’s appearance. This flexibility allows you to align the layout with your branding and content requirements seamlessly.

We covered the customization of icon and text modules, demonstrating how to change and align icons, update text, and adjust module settings to enhance the look and functionality of your page. Finally, we showcased how these customizations transform a premade layout into a personalized, cohesive design, illustrating how Divi’s tools enable you to create a polished and professional website tailored to your preferences.By applying these techniques and practicing regularly, you’ll gain confidence in using [Divi’s layout packs](https://divicake.com/blog/divi-layouts-packs/) and customization options. Your website will not only look visually appealing but also effectively represent your brand and content. Keep experimenting with these features to continuously refine and elevate your website’s design.

Read More: [LevelUP – Divi](https://divicake.com/go/levelup-divi-layout-for-course-sites/) L[ayout for Course Sites](https://divicake.com/go/levelup-divi-layout-for-course-sites/)

About the author

Written by Divi Cake.

## Submit a comment

Comments are read before they appear. Your email is not published.

Comment

NameEmail

Company website

Submit commentSubmit commentSubmit comment

The comment form needs JavaScript for its spam check.

Thanks. Your comment is waiting for review and will appear here once it is approved.

## Do you need help with …

- [Divi websites](https://divicake.com/divi-website-development/)
- [Divi plugins](https://divicake.com/divi-plugin-development/)
- [Fix a site](https://divicake.com/fix-existing-site/)
- [Beyond Divi](https://divicake.com/beyond-divi/)
- [Technical SEO](https://divicake.com/technical-seo/)
- [SEO content](https://divicake.com/seo-content/)

## Save Annually on Divi

[Save 69% on Divi VIP](https://divicake.com/go/divi-vip/)[Save 69% on Divi Cloud](https://divicake.com/go/divi-cloud/)[Save 69%, Divi Team](https://divicake.com/go/divi-teams/)

## WordPress Hosting & Tools

[100% off on Kinsta for 1 Month](https://divicake.com/go/kinsta/)[Get up to 62% off Bluehost hosting.](https://divicake.com/go/wordpress-hosting-blue-host/)[Save Up to 15% on Rank Math](https://divicake.com/go/rank-math/)[Get 50% OFF on all WPForms plans](https://divicake.com/go/wpforms/)

## More in Blogging

[

Selling Divi websites and child themes

Blogging10 min read

### How to Make Money Selling Divi Websites and Child Themes

How to earn from Divi three ways: building sites for clients, selling finished websites through a brokerage or marketplace, and packaging child themes for sale.

29 September 2026](https://divicake.com/blog/selling-divi-websites-and-child-themes/)

[

Top reasons to choose a pre-built theme for your website

Blogging10 min read

### Top Reasons to Choose a Pre Built Theme for Your Website

Why a pre-built theme is often the faster and cheaper way to launch a site, compared with a custom build on cost, responsiveness, customization, SEO and support.

21 September 2026](https://divicake.com/blog/reasons-to-choose-a-pre-built-theme-for-your-website/)

[

Why Web Designers Use Divi Theme to Build Better Websites

Blogging7 min read

### Why Web Designers Use Divi Theme to Build Better Websites

Design agencies pick Divi for its visual builder, reusable layout packs, and faster client handoff. Here is what Divi for web designers changes day to day.

14 April 2026](https://divicake.com/blog/why-web-designers-use-divi/)
