Posts

New Gradient Editor, Gradient Variables, Text Effects and More

Image
We just released a bunch of new gradient-related features for Divi 5 ! Gradient options have been consolidated into a new gradient picker panel, and with the introduction of a new gradient field type, gradients are now easier to manage than ever. You can copy, paste, extend, find, replace, and inspect gradients as a unified attribute. What’s more, we added support for gradient variables. Use the same gradients throughout your website, and manage them easily in the variable manager. Plus, gradients can now be used to fill text, along with new text-stroke and image-fill settings. There’s much to explore, so let me jump into the builder and give you the full tour. 👇 New Gradient Options Divi 5.7 is all about gradients. We added new ways to both manage and use gradients. Gradient Field Type The new gradient field combines gradient attributes into a single manageable field. Now you can interact with gradients in the same way you interact with other attributes. Copy, ...
Post a Comment
Read more

How To Create Better Focus States For Accessible Forms In Divi 5

Image
Styling a form well takes effort. You choose the colors, adjust the borders, refine the spacing, and eventually the form looks right. But that is only the resting state: the version visitors see before they interact with it. The moment someone clicks or tabs into a field, the focus state takes over. If you have not designed that state, the browser fills in the gap with its own default outline. Sometimes that default is visible enough. Often, it is too thin, too low-contrast, or out of place with the rest of the design. Divi 5 gives you visual control over form focus states without custom CSS. With the new form field options , Focus mode, Design Variables , and Presets, you can build focus styles that are clearer, more consistent, and easier to reuse across your site. Why Focus States Matter For Accessible Forms A focus state shows which field or control is currently active. This matters for anyone using a keyboard, switch device, voice control, screen reader, or other assistive te...
Post a Comment
Read more

How To Build Custom Woo Cart Pages In Divi 5

Image
The default WooCommerce cart works, but it is not always easy to shape around your brand, your products, or the way your customers make decisions. That is where a custom cart page can make a real difference. With Divi 5 , you can build a cart page visually using native WooCommerce modules, rather than relying on a generic layout or custom code. In this guide, we will show you how to create a custom WooCommerce cart page in Divi 5, style the cart products and totals, add trust signals, include optional cross-sells, and refine the layout for mobile. Why You Should Customize WooCommerce Cart Pages Most store pages have one job: move shoppers to the next step. Product pages push visitors toward the cart. The cart page pushes them toward checkout. By the time someone reaches the cart, they have already said yes to something. The remaining job is to make the next step feel clear, safe, and easy. WooCommerce’s default cart page gives shoppers the essentials: cart items, quantities, t...
Post a Comment
Read more

11 Gutterless Layouts For Divi 5 (Free Download!)

Image
Divi 5 makes it easy to create polished full-width layouts with strong visual impact. In this free pack, you’ll get 11 Gutterless Sections that are perfect for landing pages, hero areas, portfolios, service pages, product highlights, restaurant websites, agency layouts, architecture studios, and more. Each section removes the gaps between columns and content blocks to create bold, edge-to-edge compositions with clean alignment, striking imagery, and modern structure. Import a section, replace the content, update the images, and you’re ready to go. Preview Here’s a quick look at the 11 Gutterless Sections included in the pack. The download is further down the post. Download 11 Gutterless Sections For Divi 5 Get all 11 sections for free. Import them into your Divi Library and add them to any page in the Visual Builder. Download the Files Download For Free Join the Divi Newsletter and ...
Post a Comment
Read more