How to Preview a Divi Cloud Item

Last Updated on September 16, 2022 by 1 Comment

How to Preview a Divi Cloud Item
Blog / Divi Resources / How to Preview a Divi Cloud Item

Once you’ve worked with Divi for a while, it’s easy to build a large library of building elements. The advantage of Divi Cloud is that we can store those building elements in the cloud to access from any Divi website at any time. This means you could have a large library to sort or search through to find the right layout. Fortunately, Divi Cloud makes it easy to preview your layouts before importing them, making your library easier to use. In this post, we’ll see how to preview a Divi Cloud item using three different methods to help you narrow down your options before importing your layouts.

Let’s get started!

Why Preview a Divi Cloud Item?

Previewing a Divi Cloud item before importing it is a great way to save time. One of the advantages of using Divi Cloud is the ability to create and save multiple variations of your layouts. As with any folder of useful website building tools, once you have several layouts, it can become difficult to know which layout is which.

The preview gives you a snapshot of the layout before importing it. This makes it much easier to import the correct layout every time. This is especially helpful if you have multiple layouts that look similar or have similar names.

Previewing makes browsing your library easier. You can search through and sort the layouts until something catches your eye, and then preview it to know if it will work for you. You’ll have an idea of what the layout looks like before importing it.

How to Easily Find Divi Cloud Items

Before we see how to preview a Divi Cloud item, let’s see how to find them. There are several methods to find your Divi layouts within Divi Cloud.

  1. First, enable the Visual Builder by navigating to any page on the front end of your Divi website and clicking “Enable Visual Builder” in your toolbar at the top of the screen.
  2. Click the purple plus icon on the Divi toolbar at the bottom of the page to open the Divi Library.
  3. Click the tab at the top labeled “Your Saved Layouts”.
  4. Next, view your Divi Cloud items. Click the checkbox labeled “My Divi Cloud” under Locations in the left sidebar.
  5. Make sure Grid View is selected unless you need to sort them by tags. This is a grid icon above the layout thumbnails on the right.
  6. Locate the layout you want to preview by searching, sorting, or filtering the Divi Cloud items. Search by keywords or favorites, select categories and/or tags to filter them, or sort them based on time, name, or favorites.

How to Preview a Divi Cloud Item

There are three ways a Divi Cloud item can be previewed inside your Divi Cloud. Let’s see how to preview your Divi layouts with all three methods.

Preview the Divi Cloud Item Thumbnail

Previewing the layout’s thumbnail is the fastest and easiest way to preview, but, since it’s a thumbnail, it’s smaller and more difficult to see the details.

  1. First, enable the Visual Builder by navigating to any page on the front end of your Divi website and clicking “Enable Visual Builder” in your toolbar at the top of the screen.
  2. Click the purple plus icon on the Divi toolbar at the bottom of the page to open the Divi Library.
  3. Click the tab at the top labeled “Your Saved Layouts”.
  4. Next, view your Divi Cloud items. Click the checkbox labeled “My Divi Cloud” under Locations in the left sidebar.
  5. Make sure Grid View is selected unless you need to sort them by tags. This is a grid icon above the layout thumbnails on the right.
  6. Locate the layout you want to preview by searching, sorting, or filtering the Divi Cloud items. Search by keywords or favorites, select categories and/or tags to filter them, or sort them based on time, name, or favorites.
  7. Once you’ve located a layout to preview, hover the mouse cursor over the layout’s thumbnail. The layout will scroll within the thumbnail where you can see a preview of the layout. Placing the cursor over the thumbnail scrolls down while moving the cursor away from the thumbnail scrolls up.

Preview a Divi Cloud Item in Layout Details

You can also preview the Divi Cloud layouts in a larger window that you can scroll through. This preview shows a large image of the layout and it is great for giving you a detailed look at the layout before using it.

  1. First, enable the Visual Builder by navigating to any page on the front end of your Divi website and clicking “Enable Visual Builder” in your toolbar at the top of the screen.
  2. Click the purple plus icon on the Divi toolbar at the bottom of the page to open the Divi Library.
  3. Click the tab at the top labeled “Your Saved Layouts”.
  4. Next, view your Divi Cloud items. Click the checkbox labeled “My Divi Cloud” under Locations in the left sidebar.
  5. Make sure Grid View is selected unless you need to sort them by tags. This is a grid icon above the layout thumbnails on the right.
  6. Locate the layout you want to preview by searching, sorting, or filtering the Divi Cloud items. Search by keywords or favorites, select categories and/or tags, or sort them based on time, name, or favorites.
  7. Once you’ve located a layout to preview, click on the layout’s thumbnail. This opens the Layout Details view and shows the layout in a larger window. It shows the layout on the left and a thumbnail list of more layouts on the right.
  8. Hover over the layout in the large window and scroll to view the layout. You can scroll up and down within this window.

Preview a Live Demo

Finally, you can preview the layout as a live demo on your website. The live demo is completely interactive and responsive. This gives you the best view of the layout before using it.

  1. First, enable the Visual Builder by navigating to any page on the front end of your Divi website and clicking “Enable Visual Builder” in your toolbar at the top of the screen.
  2. Click the purple plus icon on the Divi toolbar at the bottom of the page to open the Divi Library.
  3. Click the tab at the top labeled “Your Saved Layouts”.
  4. Next, view your Divi Cloud items. Click the checkbox labeled “My Divi Cloud” under Locations in the left sidebar.
  5. Make sure Grid View is selected unless you need to sort them by tags. This is a grid icon above the layout thumbnails on the right.
  6. Locate the layout you want to preview by searching, sorting, or filtering the Divi Cloud items. Search by keywords or favorites, select categories and/or tags, or sort them based on time, name, or favorites.
  7. Once you’ve located a layout to preview, click on the layout’s thumbnail. This opens the Layout Details view and shows the layout in a larger window on the left of the Divi Cloud screen.
  8. Select the green button under the layout’s image labeled “View Live Demo”. This temporarily imports the layout and closes the Divi Cloud window so you can view the layout on your website. It looks the same as it would if you imported the layout, and you can click, hover, scroll, see the animations, etc., and more.
  9. Alternatively, you can right-click on the thumbnail on the first screen or the layout’s image in the Layout Details screen and select “Live Preview” from the popup menu. This works the same as clicking the green “View Live Demo” button.
  10. Click the X in the upper right corner of the screen to close the preview and return to the Divi Cloud layouts window.

Ending Thoughts

That’s our look at how to preview a Divi Cloud item. Previewing is a great way to browse your Divi Cloud library. There are several methods to preview layouts which include viewing a thumbnail, viewing a larger image, and seeing the layout on your website. Each of the methods has advantages in speed, details, and interactivity. All three methods are worth trying to help you narrow down the exact Divi layout you want to use on your website. I recommend using them in the order we’ve shown there here to find your Divi Cloud layout in the fastest way possible.

We want to hear from you. Do you preview your Divi Cloud items before importing them? Let us know in the comments.

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

Get a Free Butcher Shop Layout Pack for Divi

Get a Free Butcher Shop Layout Pack for Divi

Posted on April 15, 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 Butcher Shop Layout Pack that’ll help you get your next Butcher Shop...

View Full Post
Get a Free Online Learning Layout Pack for Divi

Get a Free Online Learning Layout Pack for Divi

Posted on April 8, 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 Online Learning Layout Pack that’ll help you get your next website up and...

View Full Post

1 Comment

  1. The preview functionality for Divi Cloud items does not work for me in Chrome or Firefox. Is ET using third-party cookies to enable this feature? I have never seen the Divi Cloud preview function working, and all I get is a blank placeholder when I look at Divi Cloud items. This is on over a dozen websites as I use Divi professionally as a web designer.

Leave A Reply

Comments are reviewed and must adhere to our comments policy.

Join To Download Today