How to Give Your Divi Layouts a Fresh New Look with Divi AI

Rifat Divi Tutorials Feb 23, 2024

Divi is one of the most popular WordPress page builders, providing users with an intuitive drag-and-drop interface to create beautiful websites. With the release of Divi 4.0, Elegant Themes introduced an exciting new feature - Divi AI. This artificial intelligence tool allows you to generate unique content, images, and more with just a few clicks.

In this post, we'll explore how Divi AI can be used to easily transform any existing Divi layout into something fresh and original. Whether you're looking to give an older layout a new look or want to create multiple variations of a layout for different pages, Divi AI makes it simple.

Divi AI and Its Possibilities

Divi AI is an artificial intelligence tool that has been integrated into the Divi page builder to assist users with website design and content creation. With advanced AI capabilities, Divi AI aims to make web development easier by generating contextual content, images, and layout suggestions.

The key benefit Divi AI provides is its ability to automatically generate content based on an analysis of the existing layout and page content. By understanding the context of where content will appear, Divi AI can produce relevant text and images tailored to that section or page with just a few clicks. This removes much of the guesswork from content creation.

Create Amazing Websites

With the best free page builder Elementor

Start Now

For example, if you are building a landing page, Divi AI can analyze the layout and main messaging to write compelling header and body text fitting that specific page goal and theme. Or if you need an image for your "About Us" page, Divi AI can generate a unique photo based on details it gathers from the page and your business.

Divi AI also helps edit and refine existing content. It can rephrase sentences, adjust tone and style, expand or condense word count, and more based on your prompts. This makes updating and optimizing content faster compared to manual editing.

The AI assistant additionally provides creative ideas and suggestions if you ever face writer's block. By examining aspects like your brand, keywords and current content, it can offer new topics and angles to explore.

In summary, Divi AI taps into artificial intelligence to understand website contexts and user intentions. This unlocks powerful possibilities for automatic, high-quality, customized content generation and layout recommendations to accelerate web design. Divi AI acts as your own personal AI web design expert.

How To Use Divi AI To Redesign Divi Layouts

The exciting part is using Divi AI to transform a premade Divi layout. First, let's select the layout we want to customize.

Adding Divi Layouts to Your Page

An excellent way to leverage Divi AI is by using it on premade layout packs. The Elegant Themes designers release free, custom-designed layout packs weekly. These packs provide a fantastic starting point for your website design. With Divi AI, you can swiftly tailor the content in these layouts to fit your unique needs and business.

We'll use the Coaching Layout Pack for this example. To add a premade layout, expand the Divi toolbar and click the purple plus icon to open the Divi Library.

Type "coaching" into the search bar and choose the Services page layout.

Click "Use This Layout" to add it to your page.

With the premade coaching layout now on our page, we can start transforming it using Divi AI's capabilities

Now, let's use Divi AI to generate short descriptions for the services section of this page. We'll start with the one-on-one service.

Access the module settings by hovering over the module and clicking the gear icon.

To auto-generate text, click the "Auto Generate Text With AI" blue button. Since this is a Blurb module, Divi AI will also automatically generate an image alongside the text in case you want to use an image instead of an icon.

The AI-generated results will then pop up. For a blurb module, Divi AI produces content for each section. If you like the generated text, click "Use This Text". Or you can modify the text further by selecting actions from the dropdown and refining the result in the input field.

And here is the final result! Divi AI automatically created contextual content based on the existing page. It's very powerful!

You can specify which context Divi AI should use for generating text: This Page Content, This Section Content, This Module Content, or No Context. Choosing the content reference gives you more control over the contextual content. Let's select "This Page Content".

Next, pick the tone of voice for Divi AI to employ - Creative, Informative, or Funny.

For SEO, you can provide keywords to be included in the text.

You can also set how long or short you want the content to be.

By default, Divi AI will match the language of the prompt. But you can select another language from the dropdown if desired.

Once your settings are configured, click "Generate Text" and Divi AI will get to work!

If you're happy with the generated text, click "Use This Text" to insert it into the module. You can further customize the AI text under "Modify With AI" - shorten/lengthen, check spelling/grammar, rewrite for different audiences and more. The "Refine Result" section lets you provide more direction to regenerate text.

You can go back to your original prompt via the "Content Results" back arrow. Refine settings there and generate new text options to compare and choose the best parts from.

Rewrite & Revise Copy

Rewriting and revising copy with Divi AI works very similarly. To do this, go to a text module with existing content. Open the module settings to edit the text.

There are two ways to access the AI options. First, click the "Auto Generate Text With AI" blue button at the top. Second, click the AI icon within the text editor.

To auto-generate revised text, click the blue button. You can further customize the results using the options in the Content Results window.

To use the "Improve With AI" feature, copy the existing text, click the Divi AI icon, and select "Improve With AI".

Paste the text into the editor, choose the desired style and settings, then click "Generate Text".

Custom Images With Divi AI

Divi AI lets you generate custom images for your site without spending hours searching stock sites. Here's how to create an image with Divi AI using the Image Module:

First, open the image module settings and click the AI icon to access the options: Generate With AI, Improve With AI or Quick Options like Generate & Replace, Reimagine etc. Let's select "Generate With AI".

Choose the desired image style - photographic, digital painting, vector, 3D, abstract art, anime etc. Next, write a prompt describing the image you want. Click the AI icon in the text area to help generate a prompt.

You can upload a reference image for context, but it's optional. Set the influence percentage - lower means your prompt has more influence vs. the reference image. If no reference image, pick the aspect ratio.

Set the image size (width and height). Once done, click "Generate Image".

You'll see four generated options. Click an image you like and select "Use This Image". You can also save images to your media library by clicking the arrow icon.

To refine, select a generated image and ask AI to produce more like it. In Modify Selected Image, change the image type/style.

Refine your prompt in New Description and regenerate. When ready, click "Use This Image" to insert into your content.

Make Images With Divi AI That Match Premade Layouts

If you want to keep the style and feel of your current layout, replacing the existing images can disrupt the design. With Divi AI, you can swap out the images on a premade layout while maintaining the original image style.

For example, here's a screenshot of the Bake Shop premade layout:

The paragraph structure and length remain the same. Please let me know if you would like me to rephrase the content in any other way.

Let's say we want to use this layout for a coffee shop website instead. We could replace the pretzel images with coffee-related images having a similar style and color palette.

To do this, select an existing image as the reference. Add a short description like "cup of coffee" and reduce the reference image influence to 20%. Then generate a new image.

The paragraph structure and length are unchanged. Please let me know if you would like me to rephrase in any other way

Repeat this process for the other images on the page. Tweak the copy using AI as required. Now you have a new website with a style matching the premade layout.

Wrapping Up

In summary, Divi AI is an incredibly useful tool for boosting efficiency and creativity when designing Divi websites. The more you utilize it, the better it understands your site and generates even more remarkable results. Stay tuned for more Divi tutorials, as we've only just started to uncover the immense potential of harnessing Divi AI's capabilities!

Divi WordPress Theme