Posts

Leveraging Divi 5’s New Image Group Presets (No Need For Photoshop!)

Image
Every web designer has done this at some point. You add an image to a layout, notice the crop is wrong, open Photoshop, adjust the file, export it, upload it again, and move on. Then the client replaces the image. The crop breaks again, the visual rhythm disappears, and the same manual fix starts over. Divi 5 gives you a better way to handle this with Image Group Presets . Instead of editing the image file itself, you save the way an image should behave in the layout. That includes its aspect ratio, how it fills the frame, where the focal point sits, and any other image styling you want to reuse. Apply that preset across your site, and every image follows the same visual rules while the original upload stays untouched. In this post, we’ll show you how Image Group Presets work, why they reduce the need for external image editing, and how to use them in carousels, product loops, and team sections. What Are Image Group Presets In Divi 5? Divi 5’s design system is built around reusabl...

Introducing the CSS Grid Editor for Divi 5

Image
I am excited to announce the new CSS Grid Editor for Divi 5 ! Divi 5 embraces CSS Grid . It comes with tons of flexible grid templates and all the options you could ever need to build every grid layout imaginable. Today, we are taking things a step further by introducing an interface for visualizing, editing, and building advanced CSS grid layouts. It’s awesome! Whether you’re new to CSS Grid or an experienced developer, you can use the new interface to build stunning layouts without getting lost in a maze of settings. Furthermore, thanks to Divi 5’s unique grid offset editor , layouts built with the grid editor are housed entirely within the container, which means you don’t have to worry about editing child elements, and every CSS Grid layout built with Divi 5 works with loops . There’s much to explore, so let me jump into the builder and give you the full tour. 👇 The New Grid Editor When adding a container, you’ll notice a new “Buil...

Exploring Divi 5’s New Tooltip Module

Divi 5 keeps turning common custom-code workflows into native builder features, and the new Tooltip module is a good example. It lets you add a floating popup panel beside another element and control its content, trigger, position, movement, arrow, timing, and styling visually. Instead of wiring up a tooltip library by hand, you can place a Tooltip module inside the element it describes, add text or nested modules, and decide whether the tooltip appears on hover, on click, or always. That makes it useful for short hints, feature explanations, product details, icon labels, mini promo cards, looped content, and contextual callouts that need more flexibility than a basic browser tooltip. In this post, we’ll look at what the Tooltip module is, how to add it, how its settings work, and where it can improve a Divi 5 layout without adding clutter. What Is The Tooltip Module In Divi 5? The Tooltip module is a nestable content container that appears beside a parent element. The parent el...

7 Chopped Text Designs For Divi 5 (Free Download!)

Image
Divi 5 makes it easy to create bold, editorial-style sections that use typography as the main visual element. In this free pack, you’ll get 7 Chopped Text Designs that are perfect for hero sections, landing pages, portfolio intros, product launches, architecture websites, creative agencies, editorial layouts, event pages, and more. Each design uses oversized text, cropped letterforms, layered imagery, strong contrast, grid-based spacing, and modern type treatments to create striking sections that feel custom and high-impact. Import a section, replace the content, update the imagery, and you’re ready to go. Preview Here’s a quick look at the 7 Chopped Text Designs included in the pack. The download is further down the post. Download 7 Chopped Text Designs For Divi 5 Get all 7 designs for free. Import them into your Divi Library and add them to any page in the Visual Builder. Download the Files ...

5 Useful Things You Can Do With Aspect Ratio in Divi 5

Image
A layout can be carefully designed and still feel inconsistent once real content is added. Images arrive in different shapes. Team headshots come from different sources. Blog thumbnails, embeds, and dynamic content do not always reserve the space your layout expects. That is where aspect ratio becomes useful. Instead of setting a fixed height, you define a relationship between width and height. The element can still resize across devices, but its proportions stay consistent. Divi 5 gives you Aspect Ratio and Image Framing controls that make this easier to manage visually. You can use them on images, modules, containers, and sub-elements that expose the Sizing option group. In this post, we’ll look at five practical ways to use Aspect Ratio in Divi 5 to create cleaner grids, better crops, steadier layouts, reusable shapes, and more consistent social feeds. What Is The Aspect Ratio Setting In Divi 5? The Aspect Ratio field lives in the Sizing option group inside the Design tab. ...