BB-test

Beaver Builder

Pirates love this Beavery page builder.

Beaver Builder WordPress Pagebuilder

I could make a joke about beavers. But I won’t. Because Beaver Builder is awesome.

Beaver Builder Overview

Ahoy, WordPress adventurers! Setting sail on the vast seas (or beaver dammed lakes) of web design can be daunting, especially when you don’t have the right tools. Enter Beaver Builder, your trusty shipwright in the digital realm. This drag-and-drop page builder is like the finest ship in the page building fleet. With true front end editing, you can be sure that what you build is what you get.

tl:dr

A great front end page builder with a great community and outstanding support.

Where to Find Beaver Builder

There is a free version on the WordPress Repository
The pro version of Beaver Builder has a whole host of extra features and well worth it.

What Does Beaver Builder do?

Beaver Builder is a true front end, what you see is what you get page builder. Beaver Builder uses modules which you simply drag onto the page where you want. The free version includes Audio, Button, Heading, HTML, Icon, Photo, Sidebar, Text Editor and Video modules. Whilst it might include less free modules than other page builders, these core, free modules can get you surprisingly far.

We all know what page builders do, so let’s get onto the nitty gritty of what makes Beaver Builder so special.

Top Features of Beaver Builder

True Front end Builder

I’ve said it before and I’ll say it again but Beaver Builder is a true front end, what you see is what you get editor. There are no nasty surprises when you publish and then go and look at the front of the site (I’m looking at you Gutenberg).

Stellar Support (Pro Version)

One of Beaver Builder‘s strongest points is it’s outstanding support. These pirates (said with love) really support their crew. Support is as brilliant, tip top and as shipshape as it comes.

There is also a great Facebook community if you don’t have the pro version. Experts are happy to chime in if you need help and it’s a one of the best WordPress communities out there. It means that even if you have the free version, support is there for you.

Drag and Drop Design

Beaver Builder is as intuitive as plotting a course on a map for a seasoned pirate. Move elements around with ease, drag modules and rows where you need them.

Unobtrusive

I love unobtrusive in WordPress. My mind is usually full of dozens of ideas at the same time, all fighting to get out, so the Beaver Builder UI is perfect for me. You have full screen editing with the option to either have module options in a small (but can be made larger) pop up, or fixed to the screen edge. By using the pop up it allows you to have your whole design on the screen, with nothing else to distract you.

As an aside, whilst editing you can also see the footer. Until I tried Gutenberg, I didn’t realise how important this is for me when designing. The footer is part of the overall design and being able to see it whilst designing is a big bonus.

Intuitive

Page builders are a personal choice, so where one person may find it intuitive, another may prefer another builder’s UI. Having tried most builders out there, for me nothing has been as intuitive as Beaver Builder.

Fabulously Stable

When you are updating 100’s of client sites (or even just one or two sites) this is where Beaver Builder’s strength lies. Beaver Builder updates don’t break sites. Or on the infinitesimally few times it does, they have a fix within hours.

Responsive Editing

Beaver Builder‘s responsive editing is top notch. It’s another fine example of what you see is what you get and it’s really easy to toggle with a keyboard shortcut of R.

For both Beginners & Pros

Whether you’re only just getting your WordPress sea legs, or a seasoned sailor who wants to extend Beaver Builder‘s potential with code, Beaver Builder will suit your needs.

How it Works & Looks

The Beaver Builder interface is simple and intuitive. The blue + at the top right is your main port of call as it opens the options that you’ll use most regularly.

Rows

Drag a row into place where you want it, with the number of columns you want within that row. You can drag rows within other rows (which really creates columns within columns, but it’s called a row in the interface) which means that it’s really easy to build complex layouts quickly. Of all the builders I have tried, this is one of Beaver Builder’s stand out features as it makes it so much easier than most builders.

Beaver Builder Rows Interface
Beaver Builder Rows Interface

Modules

The modules tab shows the modules. No surprises there captain. And for the free version you definitely won’t be needing a bigger boat.

Beaver Builder Modules Interface
Beaver Builder Modules Interface

Beaver Builder has a few available add ons. The two main ones are PowerPack for Beaver Builder and Ultimate Add Ons for Beaver Builder (posts coming soon) If you install them, then the under the modules tab there is also a drop down which shows the extra modules.

Beaver Builder Power Pack Add On UI
Beaver Builder Power Pack Add On UI
Beaver Builder Ultimate Add Ons UI
Beaver Builder Ultimate Add Ons UI

Templates

Beaver Builder doesn’t include a huge amount of templates but there are a few available. If you choose a a template you will be asked if you want to Replace the Existing Layout or Append the new layout so be careful what you choose. By Appending the new layout it drops it to the bottom of the page below your current content. If you are new to WordPress this can be a good way of adding new rows that already have a predefined layout and deleting those rows you don’t need.

Beaver Builder Templates UI
Beaver Builder Templates UI

Beaver Builder don’t offer full starter templates. For these you will need to go to Astra and their Starter Templates where you will find a really good selection of both free and pro ready made Beaver Builder websites. Make sure you choose Beaver Builder from the drop down. If you type “free” in the search box, it will bring up all the free Beaver Builder starter templates.

List View

By clicking on the 3 lines at the top right of the toolbar you get a list view. This is handy if you’ve set z index, a negative margin or added some code that means you can’t click on a module to edit it. You can also use it for dragging elements on a longer page. You can rename the row or module in the “label” section of the Advanced tab. It would be great if the heading module automatically pulled in the heading for the name of the block. Below is a Beaver Builder list view compared to the Kadence list view (for a post on this site). I haven’t renamed either of these but you can see that the Kadence list view is much more useful.

Beaver Beaver list view UI
Beaver Beaver list view UI
Kadence list view UI
Kadence list view UI

Tools

It’s easy to miss this drop down at the top right hand side of the toolbar. I won’t go through everything but there are a couple of treasures hidden in here worth a special mention.

Beaver Builder Tool UI
Beaver Builder Tool UI

Duplicate Layout

The duplicate layout option is brilliant. It does what it says on the (tuna) tin. It will create a new page called “Copy of page name.” You can simply rename the page and go straight into the builder. This is particularly useful on services pages where you have the same layout.

Shortcuts

The P and R shortcuts are just brilliant.

Layout CSS & Javascript

Sometimes you just want to add code to a single page rather than have it load sitewide.

Global Settings

I always set this up before building. In here you can create your site wide settings for things such as global row, column and module padding/margin, default row width and default content width and breakpoints for the builder. You can even paste SVG code to add new row shapes to the shape dropdown if you want.

Downsides

The main downside that people mention about Beaver Builder is the speed of release of new features. The Beaver Builder community has been divided on this, with many people (including myself) preferring the stability to the frequent addition of new features. Having said that, I do believe that they have been too slow in implementing some much needed features such as global colour palette and CSS grid and Flexbox. At the time of writing all these features are currently in Alpha still (I’ve just checked and it’s been in Alpha for almost 2 months at the time of writing) so they won’t be released for a long time yet. I feel that these should have been implemented a long time ago and that Beaver Builder has really fallen behind the competition with these. It’s hard to believe at times that it’s the same team who released the revolutionary at the time Beaver Themer. Themer was the first page builder to introduce the ability to edit all parts of the site and in many ways it’s still better than a lot of the copies that followed. Where has that ahead of the game, swash buckling spirit gone? It feels like they only make the big leaps when they release brand new products.

It would be remiss of me not to mention another usual criticism of Beaver Builder. The “bells and whistles.” I’m not going to give this much space because it does pretty much everything you could possibly want in a page builder. I feel it’s the right balance of everything you need without cluttering up the interface with a few things like fancy animations that you need once in a blue moon that can be done with css.

Beaver Builder’s copy and paste function is, I’m afraid, a bit like a scabby sea bass. Instead of one click to copy and one click to paste as other builders and Gutenberg blocks have, with Beaver Builder it’s click > open module, click > go to advanced tab, click > export, click > open the module you want to copy to, click > paste, click >import. Just writing that makes me lose the will to live. Sometimes it’s just quicker to make the changes without copy/paste. It’s not until you use other builders that really appreciate how much better the copy/paste functionality could be.

Pro Features

Extra Modules

As expected, the pro version of the plug includes a lot of extra modules.

Beaver Builder Pro Modules
Beaver Builder Pro Modules
Beaver Builder Pro Modules
Beaver Builder Pro Modules

Save Rows, Modules and Columns

This alone for me would be worth upgrading to the Pro version. You can save a row, column and module and then use it on any page. It can be saved globally, in which case if you change it in one place it changes it everywhere. Or just save it and then change the parts you need. This is a huge time saver and something I can’t image not having.

Save Templates

This can be found in the Tools area. This is really an enhanced version of the Duplicate Layout option in Tools. By saving a layout, you can access it on any page. Your own template will be saves to the general templates area.

Templates

The Pro version has extra templates. Personally I find them lacking and the Astra templates are much better. But if you don’t want to use Astra, then you have a backup with the Beaver Builder templates.

Woocommerce Modules

If you have Woocommerce installed then you’ll find a nifty Woocommerce module that allows you to add a single product, multiple products, an add to basket button and various other Woocommerce elements to a page. It’s pretty nifty.

Beaver Builder Woocommerce options
Beaver Builder Woocommerce options

Beaver Builder Pro Pricing

Beaver Builder is a bargain. All options are for unlimited sites and there is a whopping 40% discount on renewal.

Standard

£99 a year for unlimited sites

Pro

$199 a year for unlimited sites. Also includes the Beaver Builder Theme and Multisite compatibility

Agency

$399 for unlimited sites. Offers Multisite Network Settings and White Labelling

Ultimate

Also includes the fabulous Beaver Themer and 6 months of Assistant Pro. I will add at this point that as a long time user of BB I had no idea that they had packaged Themer in on a package. Their builder rocks like a ship on an open ocean but their marketing sucks like a limpet!

The developers

Beaver Builder was founded by Justin Busa, Billy Young and Robby McCullough (possibly Brent Jett as well?). They founded it to solve the problems they had in their own agency. Originally they called it Fastline Media (hence the class .fl used in Beaver Builder) but then decided to, erm, bring in the beavers. These old salt developers are exactly the kind of developers this site loves to support.

Summary

With Beaver Builder, you’re not just building a website; you’re crafting a vessel fit for the grandest adventures on the digital seas. Whether a novice sailor or a seasoned captain, this plugin ensures smooth sailing. Chart your course, raise the anchor, and embark on your Beaver Builder journey today! You won’t be disappointed and will find that the Beaver Builder crew are one of the finest in the vast ocean that is WordPress.