try them out

Some few simple Breakdance Builder custom elements

We are an interactive web agency from Eastern Europe (Poland) and we build our sites on WordPres using the Breakdance Builder.
We are offering you just a few custom elements plus a neat builder tweak that we have created for our own website projects.

Available elements

Advanced Infobox

your multitask content element

This element is coming from the Image/Icon Box, but it combines them and adds tons of extra features. It lets you:

  • choose to add an image or icon (or none)
  • add a title, subtitle and text
  • add a link - either link the entire infobox or add a button
  • if you add a button, you can select to bottom align it per row if there are multiple infoboxes with different heights
  • style the complete container
  • choose the image/icon location between top, left or right + position it vertically
  • choose to make the text aligned to the heading or to the icon
  • if you have a button, you can select to align it to the bottom of the infobox in case you have multiple such elements in a row with different text lenghts
  • style every aspect of the icon, typography, spacing, including responsive options
  • did I mention that all thext fields support dynamic data?
  • and of coure it supports global settings
See details

Table Advanced

your table powerhouse wtih ACF dynamic data support

This is v2 of the table element. It lets you:

  • create tables based on dynamic data from any ACF Repeater field, incl. options page repeaters
  • style ACF Repeater based tables almost the same as manual ones (with few exceptions)
  • manually create columns and populate those with rows of static data
  • each cell data is a rich text input so you can add any content you want (incl. images, icons, links)
  • each cell content can be fully linked (other than single element links added via rich text content)
  • add a table title/cation
  • set individual colors for table head cells and each other cell or set global colors for head row and cell rows
  • can enable striped table with possibility to style the striped background
  • table is set not to exceed in width the viewport (minus section padding) - on smaller screens the table is horizontally scrollable (incl. mobile)
  • you can make each column equal width
  • you can set global cell padding or padding for head and row cells
  • style borders, separately for table, table head and row cells
  • change text aligning in head and cells
  • style typography for title, head and cells
See details

Formidable Forms styler

style your FF forms right in Breakdance

This element let's you place any FF form and style it. It lets you:

  • select any FF form created from a simple dropdown
  • show/hide form title, description, field labels and field descriptions
  • style any part of the form:
    • form itself (padding, borders, widths, background)
    • title & description (typography, padding, aligning)
    • labels (typography, padding, required asterix color)
    • fields (height, background, borders, padding, typography, focused state, placeholder color)
    • checkbox & radio fields (typography, direction, gap, checked color and and borders, size)
    • buttons (inherit global settings for primary, secondary, form submit buttons, or style custom)
See details

ACF Gallery Slider

dynamic galleries you craved for

This is dynamic content gallery slider based on images fetched from an ACF Gallery field. You can:

  • select any ACF Gallery, including options page based galleries
  • you can set images to be linked via URLs placed in the description field in you media library
  • show image captions (from the media library's caption fields)
  • configure the slider the same way as you do with the core Advanced Slider element
  • set all slider settings similarly to the core Advanced Slider (images per view, autoplay, infinite, images per move, full navigation customization of arrows and dots, etc.)
  • set image aspect ratio, padding, filters, hover filters, hover zoom, captions typography
  • can add responsive settings (eg. images per view per breakpoint)
See details

Title & text

your simple dual text element
This element is extremly simple, but proved useful to me. It's just a heading and some text. It lets you:
  • add a title and text
  • specify the title tag
  • style the complete container, typography and spacing
  • all text fields support dynamic data
  • supports global settings
See details

Dynamic texts

use combinations of fixed and dynamic texts in one paragraph
This element lets you create one big paragraph of text with parts being fixed text and parts being any dynamic content. It lets you:
  • add any number of text elements via a repeater
  • each text element can be set as fixed text or dynamic value
  • each dynamic part can be styled differently
  • each text item can be linked
  • you can override global link styling
See details

Simple counter

element with an animated counter and heading
This element lets you create an animated counter with a heading. It lets you:
  • select the start and end of the counter
  • you can add a prefix and suffix of the counter number
  • you can add a headnig below the counter
  • each element can be styled separately, including responsive options
  • you can override global link styling
See details

Accordion content advanced

when you lack customization with your accordion content element

This element is an extention of the Accordion Content element with multiple extra features. It lets you:

  • add an image or icon that will be shown on the left of each accordion title
  • you can add a title, but also a title append text
  • the title append text can be displayed next to the title or below
  • you can style the icon or image freely
  • you can style the title button part (backgrounds, borders, hovers), as well as the expanding panel (brackground, borders)
See details

Price Box

pricing lists made easy and flexible

This element is useful when creating any price listing. It allows you to:

  • set an item title (field is dynamic)
  • select a leading icon or image shown on the left, or an indent to keep price elements' titles with and without an image vertically aligned
  • set the item price (field is dynamic)
  • set the price currency
  • set if the currency is on the left or right of the price and if they are spaced or not
  • add an item description (field is dynamic)
  • style... everything

This element replaces the previous Restaurant Menu, but backward compatibility is ensured (old element will still work if used before).

See details

Text over Media

create a box with text overlaying any media background

This element is useful when creating simple boxes where you want to combine some content overlayed on a media background. It allows you to:

  • set any type of box background (image, gradient, video, slideshow)
  • add an overlay
  • box size can keep the size of the source background content
  • add an overlaying content box (via rich text editor) with a background
  • position the location of the content box on the background
  • position the text inside the content box
  • and style... everything else
See details

Image V1

the original Breakdance image V1 element

This element is the old Image V1 element from Breakdance pre 2.1. It allows you to:

  • add link to image
  • add lightbox effect
  • add captions

You can't however (as opposed to V2):

  • add image from URL
  • use ALT text same as set in Media Library

Keep in mind that the reason for Breakdance to move to Image V2 was significantly decreasing the markup footprint (1 tag deep in V2 vs. 5 in V1) at the cost of functionality, that can be achieved differently (eg. via the Wrapper Link).

Rich Text editor popup draggable

when your rich text editor is in your way

Actually this is not an element, but a builder tweak adding a neat feature to the behaviour of the Rich Text element, or rather all Rich Text editor popups in any element. By default the are fixed in size, cannot be moved, they cover the content. Wouldn't it be great to be able to move it to the side and make it eg. vertical? Well, with our tweak you can do this now! It lets you:

  • click and drag the rich text editor popup anywhere on the screen
  • you can resize it to any size you want from any of the bottom corners
  • in case it somehow breaks your site, you have an option to disable this functionality from the WordPress dashboard in Settings > General
  • the dark overlay covering the page behind is removed for better content visibility
See details

BD and TranslatePress body class

when you want to use custom CSS when builder is open

The Breakdance Builder is being opened in an iframe and its <body> tag does not have any unique class that let's you identify that the builder is open. So if you would like to add any CSS conditionality that recognizes when the builder is open, you cannot easily do it. Same with the TranslatePress multilingual plugin, which behaves in the same way. With this tweak you can change this now! It lets you:

  • enable the option to add a .breakdance-editor-open class on the <body> tag inside the builder's iframe allowing you to custom style the builder or do some conditionality like 'if the builder is open that do this' (so you could do via your CSS something like html[lang="en-GB"] body&:not(.breakdance-editor-open) .some-section-class { display: none; };
  • enable the option to add a .translatepress-editor-open class on the <body> tag inside the TranslatePress multilingual plugin's iframe allowing you to custom style the translation editor or do some conditionality like 'if the builder is open that do this' (for example hide some content in the main language, but show it in the editor to translate - you can use for example in your CSS: html[lang="en-GB"] body&:not(.translatepress-editor-open):not(.breakdance-editor-open) .some-section-class { display: none; } if you would like to combine both above;
  • you can enable these classes in the WordPress dashboard in Settings > General (disabled by default)
See details

Custom WP admin dashboard

when you grim over the looks of the WP backend

The current looks of the WordPress backend was implement in version... 3.8 in... June 2013! What?! Yes, really. It hasn't changed for that last 11+ years. Users all over suggested that this should be modified again, as it does not really stand up to the current UI design and that it looks a little... old school. Of course, like every thing, it has its fans. However when looking into any roadmap of WordPress, we don't see any plans for a new UI. So plugins like Ultimate Dashboard, Adminify or UI Press have their place and offer wide arrays of customization to the dashboard, offering many times plenty of extra features. But first - they cost significantly, and secondly - they add to the total plugin list which may not be a good way to go each time. So here is a simple solution for Breakdance users - a purely CSS based backend customizer which gives you a significant change in how the dashboard can look like. Nothing too fancy, but makes a difference.

See details

How much does it cost you?

Considering the ammount of work it took to develop this plugin, it's being sold with a bargain price.
The previous donation based option did not meet enough generosity, so we're switching to a paid option, although priced extremly afforable.
Happy building :)

$39

One time payment
Unlimited websites
Unlimited updates

Direct link

Purchase instructions

When you buy the plugin via Payhip, make sure to check the "Send me product updates and offers via email" checkbox if you want to get product updates. 

After purchase you will get a "Thank you for your Innova Elements purchase" email from Payhip with a download button. It's advised to go with the "Add the above product to your customer account so that you can view all your orders from one place" process - this will give you easy access to the product and updates.

After installing and enabling the plugin, the custom elements will appear in the Breakdance Builder element list under section Innova Elements, while any twaeks are available in Settings > General in the 'Innova Elements Settings' section.

Changelog

v1.0 Available elements: Advanced Infobox, Dynamic Texts, Simple Counter, Accordion Content Advanced, Rich Text editor popup draggable and resizable tweak

v1.1 Added tweak to add a .breakdance-editor-open class to the builder's iframe body tag when BD editor is open (now the <body> of the frontend page and the <body> of the builder's iframe do not differ so no way to identify by class or id when the editor is open). Same tweak for the TranslatePress plugin (class .translatepress-editor-open), as it has the same issue with the <body> tag. Fix: the draggable RichText window had issues with vertical scrolling - now fixed.

v1.2 Added new element: Restaurant menu item. Added new feature: customizable custom admin dashboard.

v1.3 Replaced Restaurant Menu element with a more flexible Price Box module (backward compatibility ensured), added Breakdance's old Image V1 module that includes all extra features (at bigger markup cost), fixed custom dashboard CSS with content width.

v1.4 New element 'Text over Media' that allows you to create a box with any background media (image, gradient, video, slideshow) with a colour overlay and add a content overlaying layer (via rich text); changes in the PriceBox element (now you can add a text/button link, fixed issues with connector display; changes in the Advanced Infobox element (you can add also a text link, besides button and linking entire box).

v1.5 New element 'Table Advanced' (v1) that allows you to create manual tables with powerful content and styling options; Price Box's price typography fix.

v2.0 Total plugin rewrite according to best WP practices for file structure, logic and security. New element: ACF Gallery slider. Plugin settings moved to submenu under Settings. Fixes: custom dashboard, Text over Image element background sizing on mobile.

v2.1 New element: Formidable Forms form styler. New Table element data source: ACF Repeater (incl. options pages repeaters).

 

Provide feedback

You are very welcome to provide feedback - whther you find a bug, you would like to see additional features in the existing elements or you have an idea for a new element. Just write to us.

Hire us

If you represent an web agency or are a freelance web designer and you are looking for help with your projects, whether it's some partial work on an ongoing project, building a complete site based on some ready design or even custom designing a new complete site, we are here for you.

Just go to the main site and there's a contact form. You can also write to us at hello@innova.uno.
This is an automatic Google Translate translated page, so not all wording is perfect.
© Copyright - innova.uno. All Rights Reserved.