Oxygen 2.0 Review: A Visual Website Builder For WordPress
Back in June 2017, we reviewed a new visual website builder for WordPress called Oxygen. That was Oxygen 1.0. Now, the team at Soflyy (also behind WP All Import and WP Sandbox) is back with a big update – Oxygen 2.0.
Like 1.0, Oxygen 2.0 helps you build your entire WordPress site using a visual editor. But unlike most other theme builders you’ll encounter, Oxygen completely replaces your theme. You’re not just injecting a header or a footer – you’re building your entire WordPress site.
Pretty powerful stuff! If that caught your attention, keep reading my Oxygen 2.0 review for a quick look at some of the biggest new features. Then, I’ll give you a hands-on look at how everything works.
Oxygen 2.0 Review: What’s New In 2.0?
It’s impossible to cover every single feature, but let me quickly highlight some of the biggest things that Oxygen 2.0 offers:
- Powerful layout controls – based on flexbox, Oxygen 2.0’s layout controls are super easy to use. You can quickly create both horizontal and vertical layouts, complete with alignment for all child elements, without the need to use any columns (like pretty much every page builder requires). You can also simply drag the side of an element to adjust spacing and sizing, which is really convenient.
- Drag-and-drop visual editing – Oxygen 2.0 adds drag-and-drop editing to the mix! Now, you can drag elements on the visual preview in addition to manipulating the DOM tree.
- Powerful templating – Oxygen 2.0’s template system lets you create templates for blog archives, singles, and lots more. Plus, you can have templates inherit from other templates. I’ll explain how that actually helps in the hands-on section!
- Full CSS control – you can easily apply CSS classes to multiple elements for easy updates later on. And it’s super easy to add your own custom CSS thanks to the built-in editor, including an option to add custom CSS for different media query breakpoints.
Those are the highlights in my opinion – but that’s definitely not the full feature list. You’ll see a lot more in the hands-on section.
Who Is Oxygen 2.0 Built To Help?
If you just want to build some styled pages for your existing theme, Oxygen is not meant for you.
Oxygen is meant for people who want to build their entire website – not just a couple pages here and there.
In my review of Oxygen 1.0, I wrote this:
If you’re a casual WordPress user, Oxygen isn’t really built for you (nor is it marketed towards you)
I think there’s still some truth to that. But Oxygen 2.0 also feels more beginner-friendly to me, thanks to the addition of features like drag-and-drop editing
The templating system still might feel overwhelming to a casual user. But I think anyone with a basic understanding of how a WordPress theme fits together (e.g. header, content, footer, menu, etc.) should have no problem using Oxygen 2.0 to build a website.
And – just as with Oxygen 1.0 – you can still use a page builder in conjunction with Oxygen 2.0.
Hands-on With Oxygen 2.0: Exploring The Interface
Ok, so that’s a lot of introduction. Now, let’s get hands-on with the Oxygen 2.0 interface.
Templates Make The World Go Round
Oxygen 2.0’s templating system is more detailed than what you get with a regular WordPress page builder.
Essentially, a template is a layout that you apply to specific content on your site. For example, you might have one template that you apply to posts. Another to pages, etc.
But Oxygen 2.0 lets you get really detailed. So you can have stuff like:
- Apply Template A to all posts
- Apply Template B to all posts in the Photography category
But in that scenario, posts in the Photography category would fit the criteria for both Template A and Template B. So what happens?
Well, you can use Template Priority to dictate which template should be applied in that scenario:
So there’s one cool part about templates… but it gets cooler.
You can actually have templates inherit other templates:
Here’s why that’s helpful:
You can create one template for your header and footer with a placeholder for the content. Then, you can create different templates for different pieces of content without having to remake the header/footer for each (because each content template inherits that from the header/footer template).
Here’s an example of what’s happening:
Pretty flexible stuff!
Using The Oxygen 2.0 Visual Builder
Ok, so you kind of saw the Oxygen 2.0 Visual Builder above. But let’s go more in-depth on a blank template.
When you click the + Add button in the top left, you can add design elements from five different categories:
- Basics – basic elements like sections, heading, text, image, button, etc.
- Helpers – more advanced elements like a header builder, pricing box, slider, and more.
- WordPress – lets you dynamically insert WordPress content, like a menu, sidebar, post title, post content, etc.
- Library – lets you choose from the pre-made design sets. These are basically like pre-made templates.
- Reusable – you can save your own designs as Reusable Parts and reuse them from this tab.
When you add a new element, the sidebar changes to let you style that element. You have a lot of control over styling:
And if the built-in options aren’t enough, you can always add your own custom CSS styles or selectors, including a simple drop-down to let you target your CSS styles to specific devices:
- 1 – select device
- 2 – select CSS selector
- 3 – directly add CSS styles in a full editor
Bringing In Dynamic Data
Another area where Oxygen differs from a standard page builder is how easy it makes it to import dynamic data. By “dynamic data”, I just mean your WordPress content. For example, dynamic data could be:
- Post title
- Featured image
- Post content
- Post author
Whenever you import dynamic data, you can use the Previewing drop-down to choose a specific piece of content to preview. For example, here’s what the default Hello World post looks like after adding some dynamic data elements:
But beyond that “standard” stuff, Oxygen also it easy to dynamically import custom fields.
For example, you can easily insert a custom field in a template using the drop-down in the Custom Field dynamic data element. I added a text field with Advanced Custom Fields to test it and Oxygen added it to the drop-down right away:
Beyond using the premade dynamic data widgets, you can also click the Insert Data button when you’re editing a different element (like a text or a header) to insert dynamic data that way:
Exploring The Layout Options
As I mentioned at the beginning, one of the areas where Oxygen 2.0 really excels is its layout options.
When you edit a section, you can choose the layout and alignment for all the child elements inside:
There are two main ways this approach is superior to most other page builders:
- You can create horizontal layouts without the need for columns (though there is a column element if you want it)
- You don’t need to set the alignment for each individual child element. Instead, you can control everything at a section level if you want.
Beyond that, another thing that I find really handy is the draggable spacing.
For example, let’s say you have two elements like below and you want to add space between them:
Instead of needing to dig into the margin/spacing controls like you would in most page builders, you just can just click and drag to create spacing:
Other Parts Of The Interface
Finally, if you liked the DOM tree from Oxygen 1.0, you can still access that in Oxygen 2.0:
And you can also manage CSS stylesheets and selectors at a global level by clicking on the Manage drop-down:
How Much Does Oxygen 2.0 Cost?
For now, Oxygen 2.0 maintains the same attractive pricing structure as Oxygen 1.0’s launch:
For $99, you can use Oxygen 2.0 on unlimited sites, including client sites. But here’s what really makes this deal attractive…
That $99 also gets you lifetime updates and lifetime support.
So, at least during the promotional pricing period, it’s $99 to build unlimited sites for you and clients for life.
Final Thoughts On Oxygen 2.0
I think Oxygen 2.0 makes a big step up in usability and accessibility, especially for non-developers.
The addition of drag and drop editing makes it easier to move elements around and the layout options feel really intuitive now.
I also find the new templating system more intuitive than how Oxygen 1.0 handled it. Additionally, I can’t remember whether or not Oxygen 1.0 supported inheriting templates, but I’m a big fan of this feature in Oxygen 2.0.
The pricing is attractive right now and there’s a 30-day money-back guarantee. So if you’re interested in building your entire WordPress theme using visual design, give Oxygen 2.0 a try.