Category: Tutorials

Animated Shape Dividers on Scroll

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. [...]
Read more

How to create a dark mode toggle in Breakdance

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 [...]
Read more

How to add a Glitch effect with PowerGlitch

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 [...]
Read more

How to install Font-Awesome 6

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 [...]
Read more

Adding a ‘Month’ Condition

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 [...]
Read more

Polylang condition in Breakdance

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 [...]
Read more

How to create a Search results page

Step 1 - adding the templateThere is a Search Results template that is already available, so you just have to pick up that one: Step 2 - Default query settingsDesign [...]
Read more