Breakdance VS Oxygen Builder | Ultimativer Vergleich - 2022 (2023)

Which is better, breakdance or Oxygen Builder? That depends entirely on your needs. In this article we compare two very successful page builders so you can decide for yourself which one makes the most sense.

Breakdance is a brand new WordPress page builder, which allows you to work quickly on websites thanks to its intuitive operation via drag and drop interface and the prefabricated page elements.

Fortunately, breakdancing is in the lower price range, so you don't have to worry too much about the project budget for your website.

On the other hand, Oxygen seems very similar in its range of functions, but is more established due to its product maturity and is strongly supported by the community with many extensions so far. Both editors were developed to offer an optimal WYSIWYG experience.

Bottom Line Upfront: Breakdance is a modern visual website builder for WordPress.
Breakdance is beginner friendly. If you've ever used builders like Elementor, Divi, Beaver Builder or Visual Composer, you'll feel right at home in Breakdance.

Although Breakdance is very powerful, it does not have a steep learning curve like Oxygen or some of the other "advanced" builders.

Oxygen is a plugin for WordPress that allows you to visually design your website, from header to footer, without having to write code. If you want to have complete control over the look of your WordPress website, Oxygen is exactly what you've been looking for.

Breakdance has been developed by Louis Reingold since 2019. After a development period of 3 years, the alpha version of Breakdance was released in June 2022. Parallel to the release of the Breakdance WordPress plugin, the official Breakdance Facebook group grew to over 3000 members within a few days.

During the first days of the release of Breakdance, there were uncertainties and fears among Oxygen users. Questions arose as to whether Breakdance would completely replace Oxygen Builder in the long term, as the developer Louis Reingold himself comes from Soflyy, the company behind the Oxygen Editor.

The Oxygen Builder has been on the market for a while. Version 2.0 was released in 2018 and attracted a lot of attention due to its performance and optimisation updates. For many users and developers, it was the decisive version to start developing addons and extensions for Oxygen themselves.

Currently, with version 4 of Oxygen, there is a solid ecosystem of communities and plugin developments, which means that some agencies and web designers now realise their projects exclusively with Oxygen.

With Oxygen's visual editor, web pages can be created in particular detail and at the same time close to the code.

The installation of Breakdance cannot yet be realised via the WordPress plugin search, but it is still relatively simple.

On the official page of Breakdance you can purchase the current version of Breakdance. On the Breakdance Builder website there is also a free access to try out directly.

After you have logged into your WordPress panel, you can upload the ZIP archive of Breakdance in the Dashboard under the Plugins tab.

After that, click on the button "Install now" and then click on another button "Activate plugin".

Breakdance provides the user with the freedom to choose whether to use Breakdance together with a WordPress theme or completely independently without a WordPress theme.

The installation of Oxygen is basically very similar to the installation of Breakdance. To install the Oxygen Page Builder plugin, you first need to purchase it from the official Oxygen Builder site and then upload and install it via the WordPress Dashboard, just like with the Breakdance plugin.

Unlike Breakdance, Oxygen does not leave the user the choice of whether or not to use Oxygen in conjunction with a WordPress theme. In any case, Oxygen deactivates WordPress' own theme function so that the website can be designed exclusively via Oxygen.

Breakdance offers a beginner-friendly UI by default. Elements can be moved and inserted centrally and in the middle of the screen by drag and drop. The element selected with the mouse is marked with a frame.

On the left side of the screen you will find the menu to add or edit items.

On the right-hand side is the menu for displaying the current website structure or changing global settings such as fonts and colours of the website.

Breakdance, like the current version of Oxygen, offers the use of hotkeys and shortcuts such as '"Ctrl + C" and "Ctrl + V" to copy and paste an element in one place.

Breakdance offers the possibility to manage different headers, footers, popups and blocks in the WordPress dashboard with the Fullsite Editing feature.

In contrast to WordPress, these are sorted directly by their categories and can be assigned to any sub-pages or globally. For example, the use of different footers on the entire website is significantly simplified.

As soon as WooCommerce is installed within the WordPress site, prefabricated elements such as products, product lists, checkout page, shopping cart or e.g. order tracking page can be used and adapted for the website.

Editing the individual elements works similarly to Elementor. The most important properties and features can be adjusted intuitively and quickly via the menu navigation.

Breakdance makes it easy to create an otherwise complex mega menu.

A variety of icons are available for the design of the dropdown elements, as well as the possibility of using images or other graphic elements.

In addition, further sections and columns can be added to the dropdowns.

Forms can be edited directly in the visual editor with Breakdance. It is no longer necessary to install an additional form plugin.

Many users are already used to creating forms in Breakdance through Elementor.

The integration of Google ReCaptcha or a DSGVO-compliant data protection confirmation is not particularly difficult.

Due to a completely new codebase and the abandonment of bloat, the operation of Breakdance in the back-end feels fast for developers. With a small plugin archive of just under 30 MB, Breakdance is an absolute lightweight among page images.

Opening the Page Editor takes only a few fractions of a second, which makes it particularly convenient to quickly switch back and forth between pages to be edited in different ways.

For the power user, Breakdance offers features such as working dynamic data and ACF or display conditions, as well as a flexbox layout engine.

For working with conditions, Breakdance has, as usual with oxygen, an intuitive menu in which the individual conditions can be clearly clicked together and managed.

In order to make the workflow as pleasant as possible for the developer in the long term, there are a number of functions and shortcuts in the Breakdance Builder.

The following functions stand out:

• Undo / Redo
• Revision History
• Import / Export settings
• Copy and Paste
• Cross-Page Copy / Paste
• Maintenance mode
• Replace URL for easy domain migration
• Switch quickly to HTTPS
• Dark Mode
• PHP 7.4 / 8.0 compatibility

With Oxygen, elements can be assigned to an ID or class. This has the advantage that you can work very well with CSS stylesheets and selectors in order to process entire groups of elements uniformly and consistently.

For beginners, the learning curve is very steep at this point and makes it a little more difficult to get started. In the long run, however, this is a very good concept, as the learning effect of working with CSS and selectors is fundamental for web development.

For the header of a website, Oxygen provides ready-made elements that make it easy for the developer to quickly design menus, logos or contact buttons neatly in a header.

In contrast to Breakdance, such headers must be stored in Re-usable Parts or Templates when reused.

Understanding and using the Oxygen Template Engine to reuse elements is not too difficult, but on the other hand it is not beginner-friendly either.

Colours in Oxygen Builder can be managed globally for the whole page in one place. The colour selection menu makes it easy to create new global colours.

Colours can also be easily integrated into the page template from an existing corporate design as hex or RGB codes.

Creating colours with a transparency value between 0 and 100 works smoothly.

Those who want to give their customers or website users the possibility to add elements to the pages themselves by drag and drop will like the Gutenberg integration of Oxygen.

Blocks designed with Oxygen can thus be used through the familiar Gutenberg editor in WordPress. Changes made to such blocks also change all existing instances of the block used.

Like breakdancing, developers can work with dynamic data from the WordPress database in Oxygen Builder.

This includes data from:

• Advanced Custom Fields
• Toolset fields
• Contribution data
• User data
• All data with a return value of a PHP function

Due to the increased popularity of the Oxygen Builder, a number of add-ons from various developers have been launched, which can significantly extend the range of functions of Oxygen.

Many of them provide Oxygen with completely new possibilities and functions in the design of websites and some come with many prefabricated design elements and templates to extend the library of Oxygen.

For example, while the Swissknife Pro add-on improves the workflow of Oxygen, Oxymade offers the integration of Tailwind CSS components.

Verdict

Those who want to give their customers or website users the possibility to add elements to the pages themselves by drag and drop will like the Gutenberg integration of Oxygen.

Blocks designed with Oxygen can thus be used through the familiar Gutenberg editor in WordPress. Changes made to such blocks also change all existing instances of the block used.

Basically, creating websites in Breakdance is easy and goes quickly. You install the plugin, decide whether you want to work with a WordPress theme or not, and can get started right away, for example by editing your home page with the Breakdance editor.

Now add a few more elements, perhaps customise them and after saving, the result is already there.

It hardly gets any faster than that.

Almost all prefabricated elements are responsive by design and display well on mobile devices.

New subpages can be created classically in WordPress via the "Create pages" dashboard. In the WordPress dashboard, a special button appears for each page with which such a page can be edited with Breakdance.

For example, to create a menu, we go to WordPress as usual under "Design" > "Menus into the settings. The menu defined in this way can be used in a menu item within Breakdance.

Elements that are repeated, such as the footer or the header, can be outsourced to templates so that they only have to be created once and appear automatically on all pages.

Oxygen also has a very quick approach to creating new websites. After installing the plugin, you are asked whether you want to work with a ready-made design set of elements or create a blank page.

If you choose one of the many ready-made designs, various sample pages and templates are created immediately. These also contain global colours and various CSS classes that can be used.

As with breakdancing, you create new subpages in the WordPress dashboard under "Pages" > "Create new page".

All subpages in a WordPress installation get an extra button through the plugin, which makes editing with oxygen possible.

In the editor itself, you will find various elements in the left-hand menu which can be placed in the page by dragging and dropping.

The structure panel on the right-hand side, which can also be found in the Breakdance Builder, gives a good overview of all the objects that are located within a page.

The very large selection of modern and intuitive design elements within the design library enable a quick implementation of web design ideas.

Own elements and even whole sets can be saved in self-created design libraries and reused for other web projects.

When using Breakdance, you have a live preview of what you are doing. Changes you make to areas or elements are immediately visible in the output. You can quickly get a feel for how elements will look with certain settings.

Many pre-designed elements have very good labels and can be found quickly via a search field. The search results are delivered quickly and the user interface responds very quickly. Loading times when opening the editor are extremely short.

How many small pages you want to create will get their money's worth with Breakdance.

Developers who work with WordPress projects only irregularly will find their way around Breakdance again and again and quickly.

In order for other editors or customers to be able to find their way around the website and its operation, there is usually no need for further plug-ins for special simplification. With Breakdance, one is not overwhelmed with functionalities in the user interface. The most important functions, such as adding an element or saving a page, are immediately obvious.

Like Breakdance, Oxygen offers the same advantages through the live preview. However, Oxygen follows the basic approach of development with CSS classes, which is similar to Webflow.
Elements assigned to a class can be changed individually via their states such as "Hover".

Those who are not yet familiar with the concept of CSS selectors such as IDs or classes will have some problems with Oxygen at the beginning. Settings for objects such as the colour and size of a headline are separated by classes and IDs nested in two levels.

Developers working with CSS frameworks such as Tailwind CSS can apply classes to HTML elements much more intuitively, which leads to a very pleasant workflow that Breakdance cannot offer.

The output of plug-ins, such as an external contact form by Forminator, can also be individually styled in Oxygen with the selector detector.

SEO integration: Breakdance VS Oxygen

Breakdance

Oxygen

Verdict

Given the current state of development of both plug-ins, it is impossible to say exactly which of them really performs better. Our own experience shows that both page builders offer very good conditions for successful SEO.

Breakdance can use elements that appear over and over again on a website as a Global Block or Template save.

Within the editor and in the WordPress dashboard, the created elements can be easily accessed to edit or insert them into the page.

As Breakdance evolved from the workflow of Oxygen, the editors do not differ significantly when creating pages.

Oxygen also works with templates. These can be found in the WordPress Dashboard under Oxygen > Templates.

The templates created in this way can be assigned to different pages where they are to be displayed. In order for the page-specific content to be loaded, the "Inner Content" element must be placed within a template.

Example of a simple template structure:

• main template- with header, footer andInner Content. Applies everywhere withOther -> Catch all.
• Page template- inherits the main template, has aInner Content. Applies to all pages withSingular -> Page.

Both editions offer similar management of templates and reusable parts/global blocks. If you are familiar with the templates in Oxygen, you will quickly become familiar with the templates in Breakdance.

In both page builders, the templates can also be assigned to a page within the WordPress page editing. On the whole, the template administrations differ only visually.

There are two versions of Oxygen available, Basic and Ultimate. In both cases, you get a lifetime licence, which can be used for as many of your own sites as you like and offers lifelong updates.

Basic- $129

Ultimate- $149

The difference between these two versions is that, above all, you get a larger selection of prefabricated elements for WooCommerce and the Composite Elements Pack, among others. If you want to use the Gutenberg Editor in between, you are also better off with the Ultimate version.

Verdict

Those who have not yet used either of the editors should definitely take the opportunity to familiarise themselves with the free alpha version of Breakdance in order to gain a deeper insight.
From a price/performance point of view, the Oxygen Builder is the cheaper offer. We assume that the Breakdance Editor will receive many more features in the future and thus live up to its future price.

Pros & Cons Compared: Breakdance VS Oxygen

Breakdance advantages and disadvantages

Oxygen advantages and disadvantages

Oxygen Builder and Breakdance are both great tools for the visual development of websites in WordPress. We are convinced that both tools can be used to develop visually appealing and performant websites.
We see Oxygen and Breakdance as two completely independent products that do not aim to replace each other. In terms of complexity, Breakdance is aimed at newer users and the Elementor target group.

Oxygen is designed to cater to the enthusiastic beginner and experienced web developer, especially with its CSS class-oriented workflow.
Anyone who plans to work with WordPress sites on a daily basis or has a certain ambition as a beginner should reach for the more mature product Oxygen.