The post Customize WooCommerce Variation Text appeared first on Divi Engine.

You can add the CSS in either a code module, Divi Theme Options, or the style.css of your Divi Child Theme. Once that is done, just add the de-text-gradient class to the advanced tab of your Divi Text module. You might have to play with the transform: translateY(-15%); to get the shadow in the right spot.

The post Divi Text Module with Animated Shadow Gradient appeared first on Divi Engine.

You can add the CSS in either a code module, Divi Theme Options, or the style.css of your Divi Child Theme. Once that is done, just make sure to wrap your text in a span tag using the code below. You might have to play with the transform: translateY(-15%); to get the shadow in the right spot.

If you want an animated version of this snippet, please check out our post on a Divi Text Module with Animated Shadow Gradient.

The post Divi Text Module Gradient with Gradient Shadow appeared first on Divi Engine.

The Sale badge might not look the best with this trick. So if you want to remove the badge from any gallery, just add this class to the advanced tab of that gallery module: remove-onsale-gallery.

The post Limit the Divi BodyCommerce PP Gallery Module Height appeared first on Divi Engine.

CSS for various filters can be found here: https://developer.mozilla.org/en-US/docs/Web/CSS/filter#syntax

The post Change the Google Map Cluster Icon in Divi Machine Multi-Pin Maps appeared first on Divi Engine.

Elevate the visual experience of your Divi website by incorporating stunning, interactive 3D effects into your header backgrounds. This Divi snippet leverages the power of Vanta.js and Three.js, two renowned JavaScript libraries, to add captivating cloud animations to sections, rows, and modules within Divi. Perfect for designers and developers looking to introduce a dynamic element to their sites, this easy-to-implement code enhances user engagement through beautifully animated backgrounds. Not only does it offer a unique aesthetic appeal, but it also provides interactive functionality, responding to mouse and touch inputs, ensuring a memorable browsing experience. Dive into the world of 3D web design with this seamless integration for Divi, and watch your website come to life like never before.

To get rolling with these, you must first add a selector to the Gutenberg Block, or Divi Section/Row/Module in the advanced tab. Then, just load the Three.js library from the first snippet, then select the Vanta.js effect you want to use, and load the accompanying script. Lastly, copy the parameter JavaScript for the effect in a separate script tag and change the selector to that of your target.

For those interested in exploring more about these awesome libraries, visit Three.js and Vanta.js for additional information and documentation on how to use them to create engaging web experiences.

The post Vanta.js & Three.js Backgrounds for Divi & WordPress appeared first on Divi Engine.

The post Numerical Indexing for Repeated Fields in the Divi Machine Repeater Module appeared first on Divi Engine.

Implementing this Divi code snippet can significantly improve navigation and usability on e-commerce sites, making it easier for customers to apply filters without needing to scroll back to the top.

The post Make Your Divi Ajax Filter Sticky on Mobile Devices appeared first on Divi Engine.

With this Divi Code Snippet, you can easily integrate a lively confetti effect into your Divi Button Module. Whenever a user clicks on a button labeled with the .confetti-button class, they’re greeted with a vibrant shower of confetti particles. This addition not only brings a burst of color and joy but also significantly enhances user engagement on your Divi-themed website. It’s an ideal way to add an element of fun and create an unforgettable interactive experience for your users!

Just add the code below and the .confetti-button class to your button on the Advanced Tab.

The post Confetti Effect When Clicking a Divi Button Module appeared first on Divi Engine.

This Divi Code snippet elevates the user experience by introducing a confetti effect to the submission of your Divi Contact Form module. Upon clicking the submit button, some vibrant confetti particles burst onto the screen, crafting an exhilarating visual spectacle. This infusion of excitement and interaction enhances the form submission process on any website built with the Divi theme.

The post Confetti Effect When Submitting a Divi Contact Form appeared first on Divi Engine.

This Divi Code snippet enhances the user experience by adding a confetti effect to a Divi Form Builder form’s submission. When the user clicks the submit button, some colorful confetti particles scatter across the screen, creating a celebratory visual effect. This adds an element of fun and engagement to the form submission process on a website built with the Divi theme.

The post Confetti Effect when Submitting a Divi Form Builder Form appeared first on Divi Engine.

The post Reverse Loop Layout Columns appeared first on Divi Engine.