Here's how to automatically play an MP4 video when the popup appears. When closed, the video pauses and resumes from the same point upon reopening. Step 1: Set Up Your…
A floating label is a user interface design element where the label for an input field initially sits inside the input and then "floats" above the input when it is…
How about a script that links two sliders to build a proper thumbnail slider? While the existing ThumbSlider custom element covers basic needs, it has some constraints—it only supports images…
When you enable the GridbuilderWP option in a Post List or Post Loop Builder element, note that it can only be activated once per page due to a Breakdance limitation—not…
The plugin Hoster, by Dplugins, is a WordPress tool that allows developers to launch and manage plugin updates from a private location, bypassing WordPress.org restrictions and providing more control over…
Here's how to easily change your logo on scroll when your header is sticky. The approach involves layering two logos: the primary logo is visible initially, while the secondary logo…
If we use the entrance feature on the gallery element, it will affect the entire gallery, as expected. To create an entrance animation on the images themselves, we need to…
WP GRIDBUILDER may display a "no results found" message only when we use their own grid functionality, but not when we build the grid ourselves, with the Post List or…
Where sparkles dance and web designs breakdance Sparkly Text is a lightweight web component allowing developers to integrate eye-catching animated sparkles, making any text element shine. Customize the count, size,…
Starting with Breakdance 1.7, the RichText element can now use the good old tinyMCE editor. One small problem: the image alignment options don't work in the frontend. Here's an example…
With a few lines of code, magically done with GSAP , we can easily animate the shape dividers, which can make a pretty cool effect, especially for a hero section.…
The Parallax will only be in effect while the cursor is over the scene element, otherwise all layers move back to their initial position : Step 1 - The main…
The Post Loop Builder and the Post List elements don't have an option to turn the layout into a MASONRY one. We can only choose between a List, a Grid…
Oct 2024 update: Javascript code fix by Moussa Khelifi The CSS prefers-color-scheme media query is utilized to identify a user's color scheme preference, allowing for automatic switching between light and…
SUPA COOL REVEAL EFFECT MADE WITH THE FANTASTIC GSAP LIBS FOR BREAKDANCE BUILDER An simple and easy way to add an animated reveal effect to your texts and images. Just…
😜 BREAK DANCE Why using GSAP instead of a basic CSS animation?It's easier to manage, there are more options and the best of all : The animations will only run…
By default, the WordPress search engine doesn't include Breakdance's content because it's stored in a custom field. To fix that "issue", the best and easiest way is to use a…
There is no animation option when using WP Grid Builder (aff link) with a custom grid created with the Post List or Post Loop Builder elements.But it doesn't mean it's…
Shrinking the headerThat's the easiest part, as we don't need to add any custom CSS or magic trick. Breakdance, once again, made it really easy.Step 1Select your Header Builder element,…
With the PowerGlitch JS library, it's simple to incorporate a glitch effect into any breakdance element. The effect can be activated automatically, on hover or click. PowerGlitch A tiny library…
