Oxygen Builder - WordPress pagebuilder review 2020

it's Johnny from WP Johnny here and today I'm gonna do a quick review of the oxygen builder so if you guys don't know what the oxygen builder is it's constantly being compared to the typical page builders out there like Elementor Divi WP bakery a beaver builder and all that and if you guys don't already know me I absolutely hate page builders I'm not a fan I think they're bloated I think they're clunky I think they're not that easy to use and I think the designs are not that great most of the designs and page builders are for me very generic and then also you know they sell this whole idea that oh you can do anything make any kind of cool design without coding and I think it's half true I think it's half true yes you don't have to code but is it that easy and can a beginner totally do that no I don't think so but it's you know very convenient for a lazy theme design company to you know they don't have to hard code anything they just kind of throw it up on the page builder and you buy it for 50 bucks and then you're able to edit it quickly and easy right for your your clients right who aren't so tech savvy so it's good for that but um you know a good friend of mine who's a respected developer in the community sitar kept accom kept um he's like Johnny you gotta try oxygen you got a cap you gotta try it so after all these years I finally trying it I fired it up a couple times like once or twice this is probably the third time I've ever used it and I have to say I was really blown away I was really impressed there's so much that the oxygen builder can do there's so much that it is and I think there's so much that people don't understand about it so I hope to cover a little bit of the details in this video and hopefully help you decide if that's the right tool for you so let's go straight to my test site I've got it installed so here oxygen is a plug-in right it's not a theme and then these are like the little add-on things I don't think I needed them but it came with it so why not so the first thing we're gonna do is the moment you activate oxygen it disables your theme so let me show you what I mean I'm gonna go to appearance then themes and from here so you see all these themes that I installed I previously had general press activated but the moment I activated oxygen it took over everything so what does this mean oxygen disables like the whole theming structure it becomes your theme right so this is really cool this is this is what adds to one of the main benefits that one of the first benefits that people think about oxygens they think about it as being one of the most lightweight builders so and it indeed it is a very lightweight page builder because it disables a theme other page builders scenarios out there what they do is they load the theme the theme has its own CSS j/s scripts and designs and all that and then it loads a page build on top of it which has its own CSS j/s and scripts of styles and all kinds of functions so you're loading one design one front-end design element on top of another front-end design element so it's gonna it makes your site that much more bloated scripts you know script styles and all that and in there overlapping styles and whatnot so it's a waste of code it's a waste of processing power it's not necessary so this is part of a big part of why oxygen is so lightweight because when you use other page builders not only do they load their own clutter bloated stuff but they load it on top of a theme that's already loading its own stuff the second thing about the whole visual builder thing is that oxygen is not a page builder I for me I would call it a theme builder it builds your entire theme okay so we'll get more into that but let's cut straight to the oxygen so I go here and I'm gonna just kind of click on through the settings from here we go to install a different website so when you install oxygen they're obvious there's no style unless you you pick one and you choose one I'm gonna show you what I chose I already installed it so I'm gonna go here I'm gonna go to the design library so there's a whole bunch of cool little styles and come on load it's lazy load Oh Internet's crawling somebody's downloading Lord of the Rings I swear okay so the financial one I like this one so I installed that and it already happens so I don't have to do it but let's just see the front-end see what we got and there it is right pretty cool very clean right very polished I love built-in designs and there it is and I click here what happens okay so it takes us two different oh I see because different pages have like they need short codes and whatnot alright so you can see it's it's a full-on it's everything's ready to go you know what I don't know why this didn't oh I see my okay don't know what's going on up there I want to put this on mobile of you so you can just see that the computers crawling every time I record this happens so there's a design looks nice I'm gonna put this back and let's just start playing with the back end yeah so to plate the back end I just go and I edit with oxygen you know what I'm just gonna do this and I'm gonna go here and I go here and then where's my home here it is I'm gonna hit edit here and so what the first Queen you get to is this and you choose which page templates you're working in and I'm gonna show you your the templates page so what are all these what does it do so as I so as I was saying oxygen is a is a theme builder so that means you have to build the whole and everything so let me show you this is main this is default I believe the one we want you know what why not just pull them all up okay I'm gonna go to edit oxygen with all of them so we've got homepage over here oh I hope I didn't open one too many tabs okay this is loading um usually it's not this slow but it is like maybe five seconds sometimes can feel like eight seconds or so but right now is definitely a little slower than usual yeah it's part of my computer and it's partly all the neighbors that are for the during this corona madness right come on guys all right here we are let me just let me just pop into the structure and make sure I know what's going on okay so this is the everything and this one I believe is the default okay so with other page builders they typically only work within the content area you build the custom late whatever custom thing that you want to do with your page builder it works only within the custom area and then if you want to use the page builder to do your own custom header like menu and all that or own custom footer and all that you have to install an add-on or enable some feature with oxygen it's you build the whole thing the home the footer and then of course the content in between so here this page has everything it has the the header the content and then the footer area right that's the main so the main is where you build everything and then the default page with the structured thing on it reuses you can tell it what to reuse so here the default page reuses the header and footer from the main but it uses the the content from you know however you put it so I'm gonna leave that alone just so you guys understand like the whole idea of templating okay and then of course so all these like they reuse like the default page where we use the header and footer from the main but then it has its own inner content and then the other is like depending on products or what not you decide basically you create your own layout however you like now I'm gonna go into the home page and edit the home page just so you guys can see what things we can do so first off this is what it looks like there's a front-end editor and that's it there's no front end to back end the front end the backend clicking back and forth figuring out what's going on so right off the bat I love that I think oxygen has the best visual builder interface okay other other page builders when you're working on them if you go to the back end there's like a bunch of like an outline of boxes and then little short codes and and then you don't know what the front end looks like and you don't know if you're editing the right thing because there's so many boxes and and it's and in this is me I'm very comfortable with WordPress but imagine my client right so the editor the backend editor view for me doesn't make any sense for a tool that's meant for beginners or non coders okay so I love it you get to see right away what it looks like let's talk about another thing I love everything that you added everything that you want to edit that you want to see you can the only settings panels that pops up is the one on the left okay at the left yeah okay I'm pointing the right place yeah the left so let's say I click on this text I see the primary stuff which is the basic settings related to this kind of element this kind of content item so this is a text thing so there's font and text color and size and weight then there's advanced and she's a background I can I can choose a layout the typography borders effects right all the animations and all that I can put custom scripts and styling and whatnot and these little lines right here this tells you what what has been edited what has been messed with so and that's it there's two tabs everything is two tabs okay I scroll through look at this image I click on that primary choose an image with height whatever alt text whatnot media library or choose a new by URL then I can go to advanced and then same thing so I love this right off the bat I love this so much because there's there's paint builders out there I think WP bakery one of the biggest offenders I think Divis like that too there's a couple other ones I don't even want to say where how do I close this one I guess not huh where to to edit something you have to like hover your mouse over and then like maybe a little gear a little ranch a little like gear icon there's like five six icons and you have to figure out which one to click on to open the settings and then what's even crazier the stupid Settings panel will open on top of the element right it'll open on top of my content here it'll cover the content I can't see it and yet I'm editing it and then there's like tons of tabs and then so I think the other page builders are so cluttered and then it's just stupid that you're editing settings and you can't even see what you're heading where is this you totally can't write I if I if I go here and drag the font size back and forth it happens right away so it's just so much or more intuitive it's it's superior superior user interface superior user experience and in case you don't know the oxygen builder was inspired by the web flow the web flow builder the web flow designer tool if you don't know about it it's one of the most beloved respective the finest visual website building tools out there used by many professional designers and programmers developers there's another thing that I absolutely love about oxygen I don't think I've ever seen this in any of the page builder but I have heard that I think maybe Elementor or one of them has recently added it so it's this little structured outline here so I go here and I can see the whole like layout the organization of my site so I love this because this is so friendly this is so developer friendly because code is parsed from top to bottom right does it doesn't matter you have stuff on left right on everything it from in terms of like a web browser a web site it's the code it goes from top to bottom is just read top to bottom and just to be able to see it like this this is so friendly this is this is a very familiar structure for developers for coders and then I can you know expand or I can close up I go okay I don't need to see that I can click on it I know exactly what element I'm clicking on and I can choose I can choose like let's say I want to go okay I want to work with the container that whatever's can take okay there's a div the div that contains so I can choose I can click and choose exactly what I want to work on there's another thing that's really helpful let's say I'm looking at this box and I go okay I want to select the parent box I love this little thing here I'm sure maybe other page builders have it I don't think so but I can just click this arrow and it selects the parent container right and then if I picked this little arrow right here again selects the parent container and up and up and up and I can just keep going up until I find the thing that I want which is great because other page builders there's a lot of times when I have to like hover my mouse around the edge and try to aim on the right box and then you add some padding and then you'll or it's the wrong one and then you pull your hair out okay and I'm not a page guerrilla pro I hate it but I deal with it because some of my clients have it so so be it okay may manage setting style sheets what else can I say about this you know I wrote all this down I don't remember right now but let's let me go back let me go back to my notes a little bit oh yeah the whole plugin thing I already talked about how lightweight it was I talked about the interface I love the user interface okay it's lean the div code so the out code I'm sure if you guys have ever seen like the deception video Louis Rheingold the founder of oxygen he shows you how other page builders just have like infinite Devon Devon Devon just for just for adding basic little like singular elements singular HTML elements so the code that oxygen outputs is really lean it's very clean it's not a bunch of chunk in the DOM and also later on I'll show you if I deactivate it you know why don't I just do that right now let's just see what let me go here and then we show you yeah I just didn't like this don't care and boom here you know what we needed with a blog so you guys can see so you see all the oxygen code is saved in the database and it's clean from the front-end so you don't see a bunch of div and short codes and just nasty tags all over your content that you have to go clean out it just very gracefully disappears from your your content from your front-end page design that users see okay now let's go back and turn it back on I had my beautiful site back so it's built for developers it's very developer friendly oh okay let's see about the styling and all that so I'm just gonna go to this page so see did you see right here it chooses a page template oh why don't I do that like you just told us me so you can choose which template design it's using okay and then you can enable Gutenberg I didn't see what that was and I go here and I go here come on okay very nice if I want to throw custom CSS JavaScript anywhere if I want to add stuff so let's say I'm just gonna go here you know what get the structure going there you go I want to pick this parent and I want to add whatever I want right so different containers can be text links and visual stuff cold blocks so this is cool you can put raw HTML code in there and we're also gonna use that for other stuff I'll show you later so this is really cool this is some dynamic functions you put menu comment form dynamic data this is awesome right so those uh those page builders I have like you know show the latest post that kind of thing or show posts or from a certain author or date or categories you can do it all here so it's really cool saves you extra plugins that you don't have now you don't have to install so helps on your speed helps prevent unnecessary styling and scripts and crap that has to be loaded here you go you can choose all kinds of you know more blocks here sidebar stuff I don't need that you commerce stuff there's a library and I think this is related to like the theme design okay yeah so I'm not gonna mess with any of that then this is reusable so you can make anything you want reusable let me check how that's done I think it's up here okay there you go so you can make so anything you copy this whole thing if you want or maybe just a bit of the text just copy it reuse it wherever you like there's also the whole conditions thing I love this I didn't play with it too much but this is really cool so we can decide like to show certain things or not show certain elements based on you know who the user is if they're logged in or if the post has a certain title or image or if the post is a certain date or what I mean endless functions right for like a membership site you can show different things or maybe for newer posts or older pose you have a message so there's so much there's so many all kinds of cool conditions and programming Lodge that you can do with just a visual interface right so think of it as like it's not just a visual design builder it's also a visual plugin builder in a sense that's really fantastic I mean out of this world other stuff that I liked I was going to talk to you about the templating oh okay mmm are we onto the weaknesses yet yeah I think we're on yeah we're ready to talk about things I didn't like or things I felt could be improved so oxygen is a really awesome tool I think it's a very developer friendly I think it's super lightweight it's really lean very clean the user experience is fantastic and I think it's still friendly enough for even you know maybe not beginners but just non coders who are savvy and comfortable with WordPress I think it would really enjoy this now about the downside so the first one that comes to mind is there's no undo right so if I accidentally typed something and I try to control Z okay what you can my browser allows some but let's say I move the it change the image size or whatever and and clicked around whatever there is no undo you just have to refresh you know you just have to save often and then when you make a mistake refresh it without saving but I believe sitar it has a yeast cookies got added so many like third-party add-ons for oxygen that that fix and help allies so I think he's coming up with something very soon so I think that's gonna go away so it's kind of crazy but yeah I thought was crazy that they didn't think of this to have an undo function the second the second weakness okay yeah third-party integration okay so third-party integration like you know for for beginners and newbies I want like thousands and thousands of plugin integrations and to work with this and that oxygen doesn't have as many fancy block options that that Elementor and beaver builder might have so if you care about such like customized plugins and functions okay that's one I don't think it's a big deal I don't care doesn't doesn't affect me but for a beginner that wants to like a million options Elementor will probably be the one for you next thing okay the pre-built designs so let me show you what I mean guys okay so it doesn't matter what the design is I'm gonna show you all of them have kind of the same pre-built mobile menu so I'm gonna go the first one I click on the hamburger solid white screen links in the middle X go the next one okay this one doesn't doesn't close him into hamburger okay this one solid white screen black round a background links in the middle and X and then go to this one okay solid white background links in the middle Internet so I I would have wished for a little more variety I would have loved like I would have loved if it was like one of those one of those mobile menus were like the like it slides down or maybe it pushes the whole screen over from the side so I would have like four or even more like where there is no mobile menu you guys can see I hate hamburger menus by the way I hate them so look at you can see how my site down size is it just it just goes like that it just closes like that I hate because I want people to see the options so I wish that their site design library had a few more of those options you can decide it yourself by the way it's not hard but I just would have liked to see that I think it's nice for people have a little more variety when they're when they're importing right because it's an this is a new tool not everybody knows how to build it from scratch it can feel a little overwhelming alright so that was like a con another con would be the the template thing so when you use some plugins like WooCommerce or a form plug-in or a forum plug-in or a shopping plug in whatever directory plugin you know it sometimes you'll have themes that have like pre-built template pages for those plugins and oxygen because it disables your your theming your the WordPress theme system you can't create custom templates to use with those those plugins those special pages those plugins so there are two workarounds one you can install the oxygen theme enabler by sitar cut the copy room who wrote that you can install that plug-in it'll resolve that issue another way is if you're savvy enough and I think you are just open up that page that template page in your theme copy the the PHP code and whatnot and then just go inside one of your templates I'm gonna pretend that we're already in the template so just save us time go into one of your templates and then let's just add a code block right and we're safe okay it was here I had a code block and then there it is and he's probably PHP and whatnot okay and then and then spit it into here right and that would be the same thing what was another what was another drawback ah okay yeah they're all or nothing thing all or nothing so I think that if you like to build a theme from scratch you want something super lightweight those two things fits your situation Oxygen's fantastic it will be perfect it would give you full control you build every element and that you template it every every little custom page template you're gonna have a lot of fun actually and then you'll have something super lightweight that's developer friendly and looks great and it's easy to edit right easy to edit now what if you are just a person you like your theme you like you already have a header and footer or you don't want to design the header and footer you just need a custom layout for one page in the content area for a situation like that I feel like oxygen is overkill is it worth it mmm depends right if this is easy for you to work with I think it's totally worth it but we learn a whole new system probably not for you if you just need to edit like one or two three pages in a cup a simple a customized layout if for a few pages you're better off just using guttenberg blocks right so that's my two cents other than that I'd like to show you the price I think this is awesome because Elementor and some of the other page builders they're Pro versions cost I don't know eight for unlimited anywhere from like $200 to $500 a year that goes on right now oxygen still has the crazy agency deal it's $169 lifetime unlimited updates including use as many sites as you want so this is a really incredible Pro developer probe coder Pro designer tool that I think is still easy enough for regular clients and I really like it as you can see I've only used it three times today was a third time the second time was a week ago when I made you know what I mean the first video of this and and I have to redo this video because I didn't like the first video but my point was it was really easy for me to find my way around things I the more I look at it the more I play with it the more like wow like it's it's it's so powerful and so simple the interface is clean alright guys that's all I gotta say I hope you enjoy it do check out my written review on the oxygen builder and you can see more details and nuances and also keep that post updated as changes happen thanks for watching

Channel: WPJohnny - WordPress Performance Guides & Reviews

Views: 7,288

Keywords: wordpress pagebuilder review, oxygen pagebuilder review

Id: 1bcREpWmyx4

Length: 27min 7sec (1627 seconds)

Published: Mon Apr 06 2020