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…
The CSS prefers-color-scheme media query is utilized to identify a user's color scheme preference, allowing for automatic switching between light and dark modes. Additionally, user preferences can be retained using…
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…
Ukiyo will add a nice parallax effect on our images, with just one line of Javascript. Here is how it works with these two images. The first one without any…
To display a random image, from a gallery, we are going to use the Gallery field type from ACF and some custom PHP code.Step 1With ACF, let's add a new…
Breakdance includes Font-Awesome v5 in his Icon Library. Which contains +1150 icons.Font-Awesome v6 has 340 new icons, so if you wish to install this new version, here is how to…
In the Slider settings, we can set an aspect ratio for the images.Unfortunately, there is no option to change it for different breakpoint.But the good thing is that the slider…
Here is a little trick to make your slider loop continuously.It will work with all elements that have a slider feature : Gallery, Basic Slider, Advanced Slider.... COPY SECTION Step…
This snippet will add a new Month condition, in the Date & Time section: add_action("breakdance_register_template_types_and_conditions", function () { \Breakdance\ConditionsAPI\register([ "supports" => ["element_display", "templating"], "slug" => "bd-month-condition", // MUST BE UNIQUE…
The original idea is from Alexander Buzmakov, with his version for Oxygen.Here is now a version for Breakdance. This snippet will add a new condition, called Locale: And then you…