The Tech Zone

In older versions of Divi, you’d find separate fields in the Advanced tab to add CSS IDs and Classes. In Divi 5 , those fields are no longer there. But nothing’s actually missing. Everything moved into Attributes under the same Advanced tab. You can still add IDs and Classes exactly like before, plus any other custom attributes you need. The difference is how it’s organized: one unified space instead of scattered fields. In this post, we’ll walk you through adding CSS classes and ID attributes using Custom Attributes . What Are Custom Attributes In Divi 5 Custom Attributes let you add any HTML attribute, like IDs, classes, ARIA labels, or data tags, directly to your Divi elements from the builder. It’s a way to control how elements behave, get styled, or get read by browsers and assistive technologies. In older Divi versions, you had dedicated fields for CSS ID & Classes . They handled basic styling needs, but that’s all they could do. Now, there’s a dropdown Attributes o...

I am excited to introduce Nested Modules for Divi 5 , which will significantly enhance the versatility of Divi elements and lay the foundation for an advanced component-based menu builder. Now, you can add modules inside other modules, with infinite nestability. Build custom layouts inside sliders, tabs, accordions, and everything else. Add a button to your menu, insert an opt-in form into your blog’s grid, and much more. This is a powerful upgrade. 💪 Check out the following video to see the new feature in action. 👇 Infinite Nestability For All Elements In the settings panel of all native Divi elements, you’ll find a new Elements option group. Click Add Element to add a new row or module inside the current element. As shown in the video below, I can add a button to a blurb module or build a custom layout using rows inside a tabs module. In fact, you can add a slider inside a toggle inside an accordion, which, while entirely silly, illustrates the freedom Divi gives you to bui...

With Divi 5’s Lottie Module, you can tie motion to the scroll, letting visitors control how the animation plays as they move down the page. This makes sections feel interactive and works well for timelines, hero banners, or sales campaigns where you want to highlight a message with movement. In this tutorial, we’ll walk through how to set up a scroll-based Lottie animation in Divi 5 and share a few examples you can adapt to your own designs. What Is The Lottie Module In Divi 5? Lottie is an open-source animation format developed by Airbnb that renders vector animations in real time using JSON. Rather than exporting animations as heavy videos or pixelated GIFs, you can use JSON files that stay crisp at any size, load quickly, and scale smoothly across devices. The Lottie Module in Divi 5 enables you to integrate these animations directly into your layouts. Subscribe To Our Youtube Channel To get started, simply add the Lottie module and upload a JSON file, or paste the Lottie ...

Divi 5 is here. Not in some distant future, not in a limited capacity. It’s here now, it’s being used on many production sites, and it’s waiting for you to start using it. Now, the question isn’t whether to migrate to Divi 5. It’s when. And that is in your hands until the official release. The Public Beta phase means we’ve reached a level of stability and feature completeness that we’re genuinely confident in. This isn’t beta in the traditional sense where you’re signing up to find bugs. This is a mature, tested product that we’re making available to everyone, on your timeline, with backward compatibility that is fully in place. Find out everything you need to know about the Public Beta below. What The Public Beta Means For You Public Beta is finally here. After months of rigorous testing through the Public Alpha phase, we’ve reached the milestone we’ve been working toward: Divi 5 is ready for widespread adoption! Subscribe To Our Youtube Channel The five-phase release strat...

One of Divi 5 ‘s newest features, the Inspector , allows you to inspect and edit element attributes, such as colors, fonts, and presets, in a single, intuitive panel. Regardless of your skill level, this feature is a must-have for creating stunning, consistent websites with ease. Let’s dive in. What Is The Divi 5 Inspector? The Divi 5 Inspector is a powerful, Figma-inspired tool integrated into the Visual Builder, designed to make working with Divi easier and more productive. It allows Divi users to inspect and manage element attributes (colors, text, media, presets, and more) with a single, centralized panel. As a result, the Inspector streamlines the design process, allowing for bulk edits and providing a clear, organized overview of your project’s design elements. Its user-friendly interface mirrors the intuitive workflow of modern web design tools, making it accessible and efficient for new Divi users and seasoned pros. Key Features Of The Inspector The Divi 5 Inspector is p...

Time for another Divi 5 freebie! This time around, we’re providing you with 6 Off Canvas Menus, each available in two versions. Default (inherits your global styles) and Prestyled (ready-made look). Import them to your Divi 5 Library, assign them in the Theme Builder, and customize them to your needs. Preview Let’s take a look at all 6 Off Canvas Menus in this pack. The download is further down the post. Download 6 Off Canvas Menus For Divi 5 Get all 6 Off Canvas Menus for free in both Default and Prestyled versions. Each Layout is ready to import into your Divi Library and can be used within your Global Header template. Download the Files Download For Free Join the Divi Newsletter and we will email you a copy of the ultimate Divi Landing Page Layout Pack, plus tons of other amazing and free Divi resources, tips and tricks. Follow along and you will be a Divi master in no time. If you are already subscribed simply type in your email address below and click downlo...