January 08, 2021

When setting up a new website, it’s impossible not to think of WordPress. It’s endlessly customizable, easy-to-use, and best of all: free. But once that fresh install is ready to go, what’s the best way to start laying out your content? While WordPress comes with a standard editor, oftentimes designers need more flexibility and control over page content – and that’s where Beaver Builder comes in!

Beaver Builder is a WordPress page builder plugin that’s packed with useful features and nearly infinite customization options. Without further ado, let’s dive into some of the most useful features Beaver Builder offers.

Beaver Builder Key Features

Drag-and-drop Editing

First and foremost, Beaver Builder is a drag-and-drop visual editor. It uses a system of rows and columns to organize what it calls modules (think text block, image, headings, etc.) By dragging and dropping your modules into your content area, you have a much better sense of how your page will actually look once published. This makes it one of the most accessible and easy-to-use page builders. There’s also a preview mode that allows you to accurately view your page as if it were live. 

Templates

Another handy feature of Beaver Builder is page templates. Templates allow you to save entire page layouts for future use. For example, want to redesign your home page but want to keep the existing one just in case? No problem, you can save it as a template that can be pulled any time. In addition to letting you create your own templates, Beaver Builder comes with its own sample templates for things like landing pages, about us pages, and more. These can be used as-is or give you a great base to start building your own pages from.

Page-level CSS and Javascript

Continuing the theme of ultimate customization, Beaver Builder also allows you to add page-level CSS and Javascript. This really comes in handy when you have page-specific code edits you need to make without affecting the rest of your site. 

Responsive Editing

With the large amount of web traffic coming from mobile devices, the mobile version of a website is just as important as the desktop version, if not more so. Thankfully Beaver Builder takes this into account with features designed around responsive design. Included is a responsive editing mode that allows you to preview and edit your page layout at tablet and phone screen sizes. You also have the option to hide rows and columns on mobile, or even display a completely different row based on the user’s screen size.

Global Rows and Saved Modules

One of the most useful features Beaver Builder offers is the options to save rows, columns, or modules as “global”. This means they are saved into a library where you can drag them in anytime. Additionally, this means you only have to update them in one place and they will automatically update across the site. This is most useful for rows like a footer or pricing information, which you would always want to remain consistent across your site.

Import/Export Functionality

Need to move templates, saved rows, or saved modules between sites? No problem! Beaver Builder has an import and export feature that makes it easy to move saved layouts between sites. This is perfect for moving layouts between staging and production, or from website to website.

Custom Post Types

Aside from being compatible with your content pages, Beaver Builder can also be used on any custom post type, giving you the ultimate flexibility across your website. This also includes blog posts, allowing you to customize every corner of your site.

Extendable Functionality

If the modules included with Beaver Builder don’t meet all your needs, there are lots of helpful extensions to help extend Beaver Builder’s functionality. For example, Ultimate Addons for Beaver Builder adds modules like info boxes, modal popups, pricing boxes, and even more page templates for you to choose from. Running limited time promotions? Timed Content for Beaver Builder lets you set up an expiration date for your content. If you need it, the extension is most likely out there.

Getting Started with Beaver Builder

Ready to give it a try? To get started, simply download the free plugin. Once activated, you should see the option to use Beaver Builder on your pages instead of the standard editor. When you open up a page within the editor, you’ll want to start by laying out some rows and columns. In the toolbar, you should see some options like this:

Start by placing a row of columns onto your content area. If you end up changing your mind on the amount of columns, no problem! You can always drag new ones into place. Now that your basic structure is in place, you can start adding some modules. There are lots of options to choose from:

Once you place a module, a window will appear with customization options. For example, the text editor has an area to input text, then separate tabs for design options. These are typically settings like text color and formatting, as well as margin and padding settings. There are even options for mobile behavior, allowing you to hide certain rows based on screen size or change the stacking order on smaller screens.

From here, you can continue to drag and drop modules into rows and columns to create your perfect layout. If you ever change your mind about placement, you can always drag modules, columns, and rows into different spots on the page.

An important thing to remember is that rows and columns have their own settings too. Hover over a row and click the wrench icon in the top left corner. Here you can set a number of design options, like the width of your content (fixed or full width), row height, text color, background options, and more. Try creating a video background or a gradient and see just how easy it is to create an eye-catching page layout!

Beaver Builder Standard vs. Beaver Builder Free Version

So what’s the difference between the free version of Beaver Builder and the paid version, and is it worth upgrading? For starters, a lot of the time-saving features mentioned above are only available in the paid version. For example, the included page templates are only available with the premium version. If you have a smaller website that is largely text and images, this might not matter as much to you. But larger, more complex websites will benefit from utilizing templates.

If you’re pretty design-savvy and the page templates don’t appeal to you, you might want to consider the other premium features like the additional modules and the ability to create saved rows and columns. If you have a large site or multiple sites you manage, it might be worth upgrading to the Standard plan to get these features. Plus, you get the ability to use Beaver Builder on all your sites, as well as support from the plugin authors for a full year.

Final Thoughts

Overall, Beaver Builder is a solid page builder plugin for WordPress that gives you ultimate control and flexibility with your page layouts. Whether you’re a beginner designer trying to set up a portfolio website, or an agency managing multiple websites for your clients, Beaver Builder is an accessible option that’s easy to learn and use. The premium plans give you access to even more time-saving features that make editing a breeze. Plus, if you find you need even more features, there are lots of extensions available for anything you might need. Give it a try for your next project and see for yourself just how easy it is!

Nexcess
Nexcess

Nexcess, the premium hosting provider for WordPress, WooCommerce, and Magento, is optimized for your hosting needs. Nexcess provides a managed hosting infrastructure, curated tools, and a team of experts that make it easy to build, manage, and grow your business online. Serving SMBs and the designers, developers, and agencies who create for them, Nexcess has provided fully managed, high-performance cloud solutions for more than 22 years.


We use cookies to understand how you interact with our site, to personalize and streamline your experience, and to tailor advertising. By continuing to use our site, you accept our use of cookies and accept our Privacy Policy.