Basics
SF Forms – Select Dropdown Population
Last Updated: 12/05/2026You can populate select drop-downs in any Breakdance form by using the Smithy: Populate Select action and setting the source. Simply add a Select field to your form and give it an ID. Do not add any options, just leave the select empty. Options can come from Posts, Terms, ACF Select or a custom hook....
Simple Docs
Last Updated: 01/05/2026Basic Setup Simple Docs will turn any post-type into this: https://breakdance.com/documentation/ It works with any post or custom post type. Create your posts and a set of categories, with parent and child categories if you need. Once you have the posts we’re ready to setup Simple Docs. Select Your Post Type On the main Settings...
Smithy Factory Emailer – User Guide
Last Updated: 11/11/2025Smithy Factory Emailer is a WordPress plugin that lets you send personalized, bulk emails to your users or WooCommerce customers, directly from your WordPress dashboard. It’s designed to be easy for everyday users, but also powerful enough for advanced needs. Getting Started License Activation Main Features Menu Overview How to Use Smithy Factory Emailer 1....
Making elements work on mobile.
Last Updated: 07/11/2025AKA Why width based breakpoints don’t work anymore. If you’re a lucky fish, your elements will look great across all devices. But there are some situations where even the best designed elements struggle. I’ve put weeks of development into making these elements stable, yet I can get caught out by some responsive gotchas that can...
Video with subtitles
Last Updated: 11/11/2025Most of the controls should be familiar as this is a direct port of the Breakdance video element. However, it’s been cut down a little, as you can’t add subs to Youtube or Vimeo… so this is for locally hosted video. Adding video There are the same controls with fewer options. Add your video via...
Text Spinner
Last Updated: 07/11/2025Content Text Spinner works a little like the Breakdance dual heading element. Put some text in the Text Before field. Add as many animating words or phrases as you want with Add Item. Add the words to the Text field. Each animated word can include an icon on both sides, which you can choose with...
Slide Deeper
Last Updated: 07/11/2025Overview Slide Deeper uses Swiper.js v11.2.8. It’s built entirely on-top of the Basic Slider and all the basic functions, adding slides, styling and pagination remain. These docs will only look at what is new or changed. At every stage you can learn more by looking directly at the Swiper docs. All I’ve done is open...
Simple Post Filter
Last Updated: 07/11/2025Why another filter? There are a few filter options already but FactWP, WPGridbuilder and others are expensive and can be overkill. The Breakdance filter forces masonry and uses isotope, which loads all posts at once in order to filter them. That can mean a large FCP. I needed something simpler and lighter. SPF works by...
Scroll Morpher
Last Updated: 07/11/2025But Why!? Breakdance has a lot of animations built in… but not everything can be animated… until now. Scroll Morpher is for those rare or special moments when you want to animate a property that isn’t available in Breakdance. Previously you could set dozens of things, we had many dialogues, buttons and fields – too...
Scroll Classy
Last Updated: 07/11/2025Classy is a simple element which toggles a class on another element or itself. You can add elements inside Classy and they can then be re-styled with the class, or target another element. Classy itself doesn’t appear on the page or take any height/width in the DOM. Settings Repeat – when disabled items will be...
QR Coder
Last Updated: 02/11/2025QR Coder is built on qr-code-styling.js. You can find a playground for it and a detailed docs link too [https://qr-code-styling.com/]. Given the detail in the QRCS docs I wont be too elaborate here. I’ve basically wired up controls to match all the settings – so what you can find in the doc you can do...
Momma Tilt
Last Updated: 07/11/2025Momma is powered by Atropos.js and the best way to understand how to use it is to have a look over their docs. [https://atroposjs.com/docs] Structure Momma Tilt is similar to the Breakdance nested element. Add the Element, and then you can select Add Pane to add a layer to the tilt. Since Momma relies on...
Gooey Gallery
Last Updated: 02/11/2025Most of the styling and settings are self-explanatory. You can style every element from color to typography to make the Fundraiser Gauge your own. Content Here you can add images with the familiar Breakdance dialogue. Each image can have a Title and text (keep it short!). Simply leave them blank if you don’t want them....
Filterable Table
Last Updated: 02/11/2025The Filterable Table element uses list.js to add search and sort to a dynamic table. It can get data from manual entries, repeaters or post queries. If you know about dates and what a pain-in-the-arse they are, you can skip past that bit. Sorting dates though… always the worst! Type Data Type – Select where...
FilmBack
Last Updated: 11/11/2025FilmBack enables background film-on-scroll. FilmBack is rock-solid up front, but can get a bit tangled round the back… like cheap underwear. Bear with any quirks in the builder. FilmBack is doing some heavy lifting and occasionally falls-out with Breakdance, but a quick refresh fixes any fall-outs… like a cheap underwear. The key to using FilmBack...
Dotty Sections
Last Updated: 02/11/2025Dotty has many style sections, but they are all Breakdance native controls, as you would get with any section. Here we’ll just look at the stuff you need to know for Dotty. Dots Width/Depth – These control how large the ‘plane’ is, on which we mount our dots. Larger numbers create more dots and a...
Play Misty WebGL
Last Updated: 05/11/2025WebGL mode is the full shader version as seen on the Stripe website. The Lite version docs are here. While Play Misty will stop animating when off-screen, to improve overall page-performance, it’s best to use just one instance per-page. More are possible if you have better hosting, and don’t mind potential slow downs if people...
Play Misty – Light Version
Last Updated: 05/11/2025Light uses a simple script to create animations. Not as silky as WebGL but much lighter on the page. WebGL docs are here. Light MODE The Light switch set to On puts us in light mode, with a much simpler script driving the animation. Gradients In Light mode Misty has only a few options to...
Carouser – Image Carousel
Last Updated: 07/11/2025NEW! Carouser used to be built and driven with javascript, using GSAP and Scrolltrigger to enable some animation and mouse-controls. Now it’s been completely rewritten to use CSS to build the carousel, with a tiny script for the navigation. That’s about 70k smaller, and doing the calculations in CSS is lighter too. Creating Slides Carouser...
Slide Deeper Basics
Last Updated: 02/11/2025Overview Slide Deeper uses Swiper.js v11.2.8. It’s built entirely on-top of the Basic Slider and all the basic functions, adding slides, styling and pagination remain. These docs will only look at what is new or changed. At every stage you can learn more by looking directly at the Swiper docs. All I’ve done is open...
Baby Tilt
Last Updated: 02/11/2025Styles These are the same as standard Breakdance styles. Baby Tilt is essentially a DIV. Change layout, padding etc. as you would for any DIV element. Effects Reverse – Normally the elemnt tilts towards the mouse, this makes it tilt away. Follow Always – will tilt towards/away from the mouse no matter where the mouse...
Audio Player
Last Updated: 07/11/2025The audio player is a simple alternative to basic HTML5 embeds. It gives you a styled player that you can fully customise and have single files or feed it with a repeater. Single File Mode You can use this dialogue to add a single audio file – just click ‘choose’ and select the file from...