How to Transform A Divi Layout Using Divi AI

Posted on August 14, 2023 by 5 Comments

How to Transform A Divi Layout Using Divi AI
Blog / Divi Resources / How to Transform A Divi Layout Using Divi AI
Play Button

Divi AI is a powerful new feature right within the Divi Builder that helps create fresh content for your website in seconds. From generating professional copywriting to one-of-a-kind images, this new tool will speed up your design process and give you the extra boost of productivity you’ve been looking for.

In this post, we’re going to explore the ways you can transform any premade Divi Layout using Divi AI. Let’s get started!

What is Divi AI?

Divi AI is a powerful and intuitive web design assistant that understands Divi. It can write content, revise content, and generate unique images for your website. You can create custom content from prompts or even ask Divi AI to generate content based on the context of the page, section, or module you’re working in.

What’s Possible with Divi AI

The options are endless with Divi AI! For a complete look at all that Divi AI can do, check out this list of features.

Auto-Generate Contextual Content

Not sure what to design next? Use Divi AI to generate context-specific website copy and images. Divi AI analyzes existing content and website details to recommend the content you should add next.

Auto-generate content with Divi AI

Create Unique Images

Divi AI also has the power to create unique images for your page design. You can generate images with prompts or by having Divi AI learn from your page and the context around your image to generate something highly relevant with just the click of a button.

Create Unique Images with Divi AI

Create Fresh Copywriting

Bid farewell to writer’s block! Whenever you face uncertainty about your next writing topic, turn to Divi AI. It evaluates your page’s content and provides fresh ideas to keep your creativity flowing.

Create fresh copywriting with Divi AI

Edit and Revise Existing Copywriting

Divi AI is like having your own Copy Editor on call, 24/7. Improve your existing content by using Divi AI to adjust the tone, modify the length, improve clarity, or add creativity to your copy. Navigate through variations, experiment with styles, and tailor your content to engage your audience.

Revise and rewrite existing copywriting with Divi AI

How to Transform a Divi Layout Using Divi AI


Subscribe To Our Youtube Channel

Now it’s time to get into the fun stuff! Today we’re going to transform a premade Divi layout using Divi AI. First, we’ll need to select our layout.

Add a Divi Layout to Your Page

A great way to use the power of Divi AI is by transforming premade layout packs. Every week the designers here at Elegant Themes release custom-designed pre-made layout packs that are completely free to use. Layout packs are a great way to get started designing your website, and Divi AI can help you quickly customize the content so that it’s unique to you or your business. For more, here is a step-by-step tutorial on how to add a premade layout to your page.

Divi Premade Layout

For our purposes, we’ll be using the Coaching Layout Pack. To add a premade layout to your page, expand the Divi toolbar and click the purple + icon to load the Divi Library.

Premade Divi Layout

Type “coaching” into the search bar and select the Services page layout.

Type coaching into search bar

Select “Use This Layout” to load it to your page.

Select use this layout

Now that we have a premade layout added to our page let’s explore the ways you can transform it using Divi AI!

How to Add Copy to Your Divi Layouts with Divi AI

Divi premade layout packs come with placeholder content. Using Divi AI, you can add text modules and ask Divi AI to generate fresh copywriting based on the context of the content on the rest of your page. Since layout packs are each based on a specific theme, Divi AI will then generate unique copy based on that theme’s page content.

How to Generate New Copy Automatically

Let’s generate some short descriptions for the services section of this page. We’ll start with the One on One service.

How to Generate New Copy Using Divi AI

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

Open module settings

To auto-generate text, click the “Auto Generate Text With AI” blue button. Because this is a Blurb module, Divi AI will also automatically generate an image to go with it in case you decide to use an image instead of an icon.

Click the button to auto-generate AI text

Next, the AI-generated results will pop up. Since we’re editing a blurb module, Divi AI will generate a piece of content for each section in the blurb module. If you like the generated text, then click the blue “Use This Text” button. Or, you can choose to modify the text further by clicking the dropdown and selecting the action you want AI to take. You can also refine your result by writing further instructions in the Refine Result input field.

Click the blue Use This Text button

And here is the final result! Divi AI was able to automatically generate contextual content based on the rest of the page content. Pretty neat, right?!

Final result

How to Create New Copy Using the Divi AI Text Generator

There’s also another way to generate copy with Divi AI: by providing prompts. Let’s try this method with the Couple Therapy blurb module.

Open up the module settings and hover over the body text area. You’ll see an AI icon popup in the textarea box.

AI Icon in textarea

Next, click “Write With AI”.

Write with AI

Up will pop the prompt window where you can select the Content Type, write your prompt, tell Divi AI what context to consider, and further customization options like the tone of voice, keywords, content length, and language.

Type in your AI prompt

Content Type

Tell Divi AI what type of content you want it to write: Paragraph, Title, Button, Blog Post, or Social Media Post. For our example, we’ll select Paragraph.

Content type options

What are you writing about?

Here you can type in the topic you are writing about and what you want Divi AI to create content for.

Content prompt

Added Context

Tell Divi AI what context (or no context) it should write in: This Page Content, This Section Content, This Module Content, No Context. By specifying what content you want Divi to reference, you’ll have more control over your contextual content. Let’s select “This Page Content.”

Add contextTone of Voice

Choose the tone of voice you want Divi AI to use. Options include, Creative, Informative or Funny.

Tone of Voice

Must Use Keywords

For SEO purposes, here you can tell Divi AI what keywords you want to be included in the text.

Must-use keywords

Content Length

Here you can tell Divi AI how long or short you want the content to be.

Content length options

Language

By default, Divi AI will write content in the same language as the prompt it’s given. However, if you’d like Divi AI to write in another language, you can select one from the dropdown here.

Divi AI language options

Click “Generate Text”

Once your settings are configured how you like, click the “Generate Text” button at the bottom to put Divi AI to work!

Generate Text

If you are happy with the generated text, you can click the “Use This Text” button to insert the text into the module. However, you can further customize the AI-generated text in the “Modify With AI” section. You shorten or length the text, check the spelling and grammar, rewrite it for experts or beginners, and so much more. You can also give more direction to the AI generator by typing in the “Refine Result” section and then clicking the “Regenerate” button.

Use this text button

In addition to all these options for customizing and refining the AI-generated text, you can go back to your initial prompt by clicking the white back arrow at the top left of the window that says “Content Results”. There, you can refine your settings and generate new text.

Go back to results

Once you generate another result, you’ll see an option to toggle between those results right underneath the AI-generated text. That way, you can compare and contrast your results and select the text you like the best and assemble it together for your own unique paragraph.

Rewrite and Revise Copy

Rewriting and revising copy with Divi AI is very similar. To do so, we’ll navigate to a text module that has existing content. Open up the module’s settings to edit the content.

Rewrite and Revise Copy

There are two ways you can access the AI options. First, by clicking the blue “Auto Generate Text With AI” blue button at the top, or second, by clicking the AI icon within the text editor.

Auto Generate Text With AI

If you’d like Divi AI to auto-generate revised text, then click the blue button. You can further customize the results in the Content Results window using the options and settings explained above.

Adjust AI content settings

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

Improve With AI

Paste the text into the editor, configure the style and settings you want to use, and then click “Generate Text.”

Generate Text

Generate Custom Images

No more spending hours on stock image sites to find the perfect image for your design. With Divi AI, you can generate custom images unique to your website! Here’s how you can generate a custom image using Divi AI and the Image Module.

First, open up the image module settings and hover over the image to see the AI icon. Click it to load the AI options: Generate With AI, Improve With AI, or choose from Quick Options like Generate & Replace, Reimagine, or Change Style. Let’s select “Generate With AI.”

How to Generate Custom Images with Divi AI

The first option is to select the style of image you want to generate.

Select image style

There are a variety of styles to choose from. You can create an image that is photographic, like a digital painting, concept art, a vector graphic, 3D renders, drawings, abstract art, comic book, watercolor, painting, anime, or cartoon.

Image style options

Next, write a descriptive prompt of the image you want to generate. You can even use AI to help generate a prompt by clicking the AI Icon in the text area.

Write your prompt

You can even upload a reference image to provide more context; however, this is optional. If you do use a reference photo, you can set the influence of the image by percentage. The less influence you assign the photo, the more influence your written prompt will have.

Upload a reference photo

If you don’t upload a reference photo, you’ll have the option to choose the aspect ratio of the generated image: Square, Landscape, Portrait, or Custom Size.

Choose image aspect ratio

You can even set the size (width and height) of the image.

Choose image width and height

Once the fields are filled out, click the “Generate Image” button and let the AI magic do its work!

Generate Image Button

On the next screen, you’ll see four generated images. If there is an image you like and want to use in your page design, click on the image and select “Use This Image.” You can also save the image to your media library by hovering over the image and clicking the downward arrow icon in the top right corner of the image. That way, you can save alternate image versions for future use!

AI Generated Images

If you’d like to continue refining your images, you can do so in several ways. First, you can select a generated image and ask AI to generate more images like that one.

Generate more images

In the Modify Selected Image area, you can even change the image type to another format, like a painting or vector image.

Change image type

If you want to refine your prompt, you can do so in the New Description area. Type in your new prompt and hit regenerate to generate new images.

Regenerate

Once you have the image you want, click the “Use This Image” button to insert the image into your content!

Use This Image

Pro Tip: How to Create New Images that Match the Style of Your Premade Layout

If you like the current style and feel of your current layout, adding new images might throw off the entire design. With Divi AI, you can replace the existing images on your premade layout and keep the original style and feel of the original image.

For example, here is a screenshot of our Bake Shop premade layout.

Let’s say we wanted to use this layout to create a website for a coffee shop. We could replace these pretzel images with coffee-related images that have a similar style and color.

To do this, simply select and use one of the existing images as a reference image. Then add a short description, like “cup of coffee,” and bring the reference image influence dial down to 20%. Then generate a new image.

Repeat the process for the rest of the images on the page. Adjust the copy using AI as needed. And you have a new website with a similar style as the premade layout.

Final Thoughts

Divi AI is a powerful new tool for enhancing your efficiency and creativity while designing Divi websites. The best part is the more you use it, the better it gets to know your website and produces even more amazing results. Stay tuned for more Divi AI how-to’s this week, as we’re just getting started showing you how to harness the power of Divi AI!

Get 40% Off Divi AI During Our Introductory Sale!

For the next week, we are offering 40% off Divi AI. Anyone who purchases Divi AI before the sale sends will save $115 per year and lock in those savings for life! Plus, all of your team members can use Divi AI at no additional cost. Get the discount here 👇

Divi AI Launch Discount Sale

Divi Marketplace

Are You A Divi User? Find Out How To Get More From Divi! 👇

Browse hundreds of modules and thousands of layouts.

Visit Marketplace
Divi Marketplace
Divi Cloud

Find Out How To Improve Your Divi Workflow 👇

Learn about the new way to manage your Divi assets.

Get Divi Cloud
Divi Cloud
Divi Hosting

Want To Speed Up Your Divi Website? Find Out How 👇

Get fast WordPress hosting optimized for Divi.

Speed Up Divi
Divi Hosting
Premade Layouts

Check Out These Related Posts

Divi Product Highlight: DiviGrid

Divi Product Highlight: DiviGrid

Posted on April 27, 2024 in Divi Resources

DiviGrid is a plugin that adds 30+ new modules to the Divi Builder. With these additional modules, you can build complex layouts to showcase your content in interesting ways. This plugin includes several plugins that make it easy to display content in a grid, ideal for showcasing features,...

View Full Post
Get a Free Coffee House Layout Pack For Divi

Get a Free Coffee House Layout Pack For Divi

Posted on April 22, 2024 in Divi Resources

Hey Divi Nation! Thanks for joining us for the next installment of our weekly Divi Design Initiative; where each week, we give away a brand new Layout Pack for Divi. This time around, the design team has created a beautiful Coffee House Layout Pack that’ll help you get your next Coffee House...

View Full Post

5 Comments

  1. I am BLOWN AWAY with the Divi AI. Who needs ChatGPT anymore??? Images too??? WOW!! Kudos to Divi!!!

    One question… In the example of the bakery to coffee… Rather than changing the four images at the top one by one, would there be a way to tell AI to change all four image modules to coffee shop-related images? Like maybe in the row settings??? Just came to mind while watching. LOVE all the tutorials coming out. This is just all so amazing!!!!

  2. Really looking forward to using this. But… is there any risk of copy right infringement with the AI generated images?

  3. I’ve been working with my DiviAI subscription for a few days and looking at the tutorials.

    I’m finding it difficult to get the stable difusion images to look real when asking for a full body image and or an action shot like swinging a golf club.

    Also, I can’t imagine a client accepting pictures of food, beverage, staff and interiors that don’t match the brand, products, or the actual interior of the business. Sure, scales of justice and law book would work – but those are quite generic. Anyone feeling me? Or am I missing something.

    I definitely like it to fill image placeholders for things that would match an industry while I’m comping a site for a client. It really will give them/us an idea of what assets need to be sourced.

    And of course the content writing is super fantastico! I like to run the AI and clean it up with branded content/details. It’s the ultimate thesaurus.

    • Hey Carmine, As for images that match brands and products, you’d be surprised what you can create using a reference image and playing with the influence percentage. Obviously, it’s AI and not “on-location,” but it can come up with some interesting things.

      I like to think of AI images as being some middle ground between stock photography (which would have zero correlation with specific products, locations, or brands) and custom photography. To that end, it is very helpful when thought of in those terms.

  4. Why are lifetime members being left out of having these features? Lifetime members of Divi should be grandfathered into having the AI features for free. Please consider giving lifetime members access to Divi AI and sent a cutoff date for those that miss out? Read the comments on all the AI posts, lifetime members want their access to AI.

Leave A Reply

Comments are reviewed and must adhere to our comments policy.

Join To Download Today