Anthony Keal
Menu
Available for contracted work
Get in Touch

Why I switched from Elementor Pro to Oxygen Builder

Written by Anthony Keal on May 9, 2020
7 min read (1308 words)

I have been using Elementor Pro to build simple WordPress websites for small businesses for roughly one-and-a-half years. But, that all changed three weeks ago when I discovered Oxygen Builder.

By chance, I was on Facebook when an Ad appeared for Elementor Pro. I already had a pro license, but I decided to peruse the comments. Someone had written "Oxygen is better" and an Elementor rep had replied with this GIF.

I thought to myself, "Ooooh, a feud? This could be worth checking out. I wonder if any of the competitive products have legs to stand on". I was doubtful but curious.

Oxygen builder though, what was it? A dodgy plugin? Something only hardcore devs would enjoy? A quick Google search brought me to a reputable-looking website and little did I know that I was going to watch a 45-minute video on the homepage (the video below), check out the price and then drop Elementor altogether for future projects.

So, what was it specifically that made me make the switch? Let's run through it all.

Less bloat. Say goodbye to div-ception!

The video above does a great job of comparing Oxygen Builder to other page builders such as Beaver Builder, Divi, and Elementor in an unbiased way.

Don't get me wrong, I've used Elementor for a long time now, and there are ways to make it quick, but it's generally something I'd look into after the site was built (aside from trying to make the structure as clean as possible and by optimising images) by utilising browser caching and CSS/JS minification. By writing skinny code from the get-go; however, Oxygen gets the fundamentals right as you are building the page.

For example, one of my irritations with Elementor was the amount of code that it took to render straightforward content on the page (and it seems that Divi and Beaver Builder are not much better). If you drag a heading onto the page and inspect the code, it's always nested in a tonne of div's. It's like div-ception! Don't get me wrong, some nesting is to be expected when dealing with page builders, but Oxygen does a fantastic job of writing clean code on the fly.

Screen Shot 2020 05 15 at 7.14.26 pm
This code is from an Elementor project of mine. I just wanted a H1 in a pretty straightforward title bar.

Clean code translates to faster sites which gives the end-user a much better experience, helps with conversion optimisation and has SEO benefits.

CSS classes in the builder.

In Elementor, they have made it pretty easy to style multiple elements. You get one looking the way you want it and then copy/paste the styles to other elements. It's easy enough, but say you want to restyle it again. You have to go through the process each time. Throughout a site build, it's a huge time waster. Additionally, copy/pasting the same styles to multiple elements on the page creates duplicate code. Bloat!

The alternative is to add classes to elements and then style them using custom CSS, but that takes you out of the page-builder workflow. It feels tacky and sort of defeats the purpose of a page builder.

In Oxygen, the workflow is different. Each element on the page has a unique ID (naturally), but you can also add classes. You can then apply whatever styling you like to the class in the builder apply it to other elements on the page. If you change your mind on how something looks, you edit the class, and the styles change across the board and in real-time while you are still in the builder. Oxygen has found an excellent way for you to add classes without taking you out of the page-builder workflow. It's faster; it's leaner, it's better.

Screen Shot 2020 05 15 at 7.29.01 pm
In Oxygen, you can style the individual element by styling the ID (blue) or create and style a class (green) to apply design changes across the board. Learning curve alert - Always look at this panel to see what you are editing, the ID or a class.

Lifetime licensing. What!?

All Oxygen pricing tiers come with a "Lifetime Unlimited License", and plans start at only US$99. That means no renewal fees ever and access to support and core updates for life. From what I can find out there, this positions them as the most affordable well-equipped page builder.

The highest "Agency" tier which allows you to create an unlimited amount of websites was only US$169 at the time I purchased it. As the owner of a digital agency that creates many sites, I was sold. Pricing models like this don't exist anymore.

Screen Shot 2020 05 15 at 7.32.21 pm
Because I'll live to be 150, Oxygen is only going to cost me $1.12 per year of my life.

As a side note, I had just renewed my annual Elementor Pro license for another year which cost me US$199.

Gutenberg Integration

Oxygen integrates seamlessly with the WordPress Gutenberg editor so your clients can make content changes in a simple, easy-to-use interface. They can also write new content utilising the features of Gutenberg (content blocks!). Additionally, with Oxygen's Role Manager, you can restrict users with particular permissions from having access to the Oxygen editor.

We all know that if clients can break it, they'll probably break it, right?

Screen Shot 2020 05 15 at 7.51.16 pm
Editing my Homepage in Gutenberg without touching Oxygen

The Awesome Community

I've only been part of the Official Oxygen User Group on Facebook for almost a month, and I've found it to be convenient. There are multitudes of questions being asked at any given point and heaps of friendly users helping out with suggestions.

I generally find that users there have a keen interest in making fast sites that don't use too many plugins, which is a breath of fresh air from a lot of other "there's a plugin for that" WordPress communities.

You'll find information on new releases, case studies, and more. It doesn't take long of being active in there to get you thinking like an Oxygen Builder.

Note: The Learning Curve

It should be said that Elementor has a lot going for it. I harped on about it to anyone that cared to listen until I found Oxygen Builder. It has a vast array of elements that can be dragged out from the sidebar and onto the page. I feel it's quicker to throw pages together, but at the expense of thought out page structure and speed.

When I first used Oxygen Builder, I felt it wasn't as intuitive because I couldn't drag elements from the sidebar or copy and paste styles as I can in Elementor, but that's by design. It will take a little while to get used to it. Not allowing you to drag and drop elements onto the page makes you stop and think about exactly what container that element will sit in. Not allowing you to copy and paste styles between separate elements makes you consider using classes to style multiple items.

My advice is to stick with it. Don't get cold feet too quickly. You'll wonder why you hadn't made the switch sooner.

In conclusion

If you have a knowledge of CSS and care for fast load times and lean page structure, Oxygen is definitely for you.

If you're a CSS beginner, I wouldn't worry too much about the learning curve if you have a couple of days to check it out. There are heaps of pre-designed "design sets" that you can import onto your page. I'd put aside some time to look at how they are structured. Start by making subtle design changes to them, and you'll get the gist of the editor.

All in all, I'm thrilled I found Oxygen Builder. It's changed the way I build websites, and I'm sure it will do the same for you.

Anthony Keal is a Senior Digital Producer based in Melbourne, Australia. He is also a Digital Designer and has skills in Front-end development, Marketing, Digital Strategy, and Search Engine Marketing.

Leave a Reply

Your email address will not be published. Required fields are marked *

29 comments on “Why I switched from Elementor Pro to Oxygen Builder”

    1. I wonder the same thing Matija. ? If I stop paying and let the license expire, I'm assuming future updates stop but that's all? Not a huge deal, but not great considering there's a vulnerability in Elementor at the moment. Who knows what's down the track.

      I need to suss this out.

  1. Great sharing! I have Divi, Elementor Pro, and Oxygen license. The best builder definitely Oxygen Builder!

  2. Nice article but you missed the biggest thing of all which is being able to add your own php and JS onto the templates / pages. That along with being to totally manage all aspects of the wordpress templating system and tight integration with ACF. Its a developer's dream.... except of course until you mess up and find you cant undo... but that's another story ..lol

  3. Nice article and agree.

    Elementor is the apple of the web world. Looks awesome, but attempts to lock you down within an environment of nonsense.

  4. Hi Anthony,
    What a breath of fresh air this was. When I saw the title in Facebook, I just had to click.
    My story goes a little different, as I had already dropped their Elementor Pro annual licencing after getting rude responses from their support people, just stringing out their numerous bugs with clangers like "Did you try deactivating your plugins one at a time?" Duhhhh! So, I switched to Divi, and I guess I'm stuck with their lifetime membership until I die or they close.
    Then I discovered Oxygen, just like you, and I asked @Elijah Mills a bunch questions. So I dipped my toe into the $99 package--wIll upgrade soon. I'm loving it.

    fyi, I'm also born and bred in Melbourne, expat in the Caribbean for the past 20 years.

    1. Hi Michael, Thanks! I'm so glad you came to read it. I don't know how I've managed to stay away from Divi. I've never used it. And, I've been hearing more and more horror stories of shocking support at Elementor - is it that bad? I wonder what is going on. Great to have another Melbournian in the community. I'll bookmark your email for any potential collabs.

  5. Anthony, this is a great write-up. I bought the Lifetime package a year ago and just now opened it today because I'm in the same boat and currently working on a large E project. After this project, I think I'm also done with it. I've asked their devs on GitHub time after time for a "Lite" version of E. You know? Taking out all the divs because I could care less about animations. If I want animations then I'll create them myself via CSS. Anyways, they just say "Elementor is for designers and non-coders..." blah blah blah. They aren't listening.

    So, I bought OxyToolbox a little over a week ago and it comes with an Undo extension. I highly suggest you check it out 🙂 @ https://oxyplugins.com/downloads/oxy-toolbox/

    1. Thanks, Chris. And, thanks for the Oxy Toolbox suggestion. This is one of the next things on my list to do - check out the common plugins that people are using to speed up their workflow in Oxygen. An undo button sounds fantastic. I'm also very surprised it's not a native feature. I've given the link a bookmark and will definitely check it out.

  6. i'm a user of both Elementor Pro and Oxygen. To be fair, Elementor does allow the creation of templates, which in a sense can reduce the amount of styling work needed.
    but yes, Oxygen allows the assigning of classes on the fly which makes the workflow much, much faster

  7. Nice, and good luck with it! I'm also a bit newbie to Oxygen, still learning how to do stuff, and so far I don't have experiences with Elementor or Divi (I tried them, but even when I'm more a designer, and not considering myself a developer, it felt very limited). Anyways, I'm still working on my first Oxygen site (learning curve ehh?), and this site I'm working on a bit different from the classic Bootstrap structured sites, doesn't have to much fixed sections, and I'm trying to have as much freedom in Gutenberg as possible. Meaning, I'm using a plugin called Layout grid, so I define my own column sizes in Gutenberg, not in Oxygen. So for example, I create a block in Oxygen, and include that block into a column in Gutenberg, in the size I need it, and can create very flexible layouts. What I'm trying to say, it's really nice to be able to create blocks that fills up any sized columns, giving me a lot of freedom for building complex, non symmetrical, out of the grid designed pages. Oxygen is not perfect, it still has bugs and missing features, but I think it's already ahead of many page builders with their limited possibilities.

    1. Hi Marton,

      This sounds pretty interesting. I'd love to see this in action. I'll check out the plugin!

      I figure as long as you're working full-width in Oxygen, you can make any layout you want but perhaps I am wrong.

  8. Thanks for this article. Exactly what I was looking for. I've built my website on Elementor too but it's so damn slow, I really need to switch. How would you describe the process from switching from Elementor to Oxygen? If we take Gutenberg, do we really need Oxygen? And how hard was it to delete Elementor to a new setup? I'm a bit concerned that a switch is a hell of a work. Would be great if you could quickly look at my website https://imiblockchain.com built with Elementor Pro and let me know how much workload it would be to switch to Oxygen. Thanks in advance