Designing Using Page Builders

Designing using page builders has been changing the strategy for web site design in general over the last few years. Many companies have been selling the ease of use of page builder technology to entice people to build their own beautiful web sites. WordPress is no different.

Because WordPress is so extensible through plugins, there are a number of page builder plugins available to fill the need. However, three players stand out: Beaver Builder, Elementor and Divi. All of them in general allow you to build pages in a similar way; they utilize building blocks or elements.

How do they work?

Page builders are designed and utilize Javascript to compose the page. However, you don’t need to know Javascript. The goal is to eliminate the need to know coding in general, although if you know something about CSS and HTML it can help in your favor to enhance the end result.

The builders each have over 20 types of elements or blocks from which to choose ranging from headline blocks to image and video carousels, just to name a few. The premium versions of the builders, like Elementor Pro, add additional elements or features to the basic selection which is not meager.

The Design Process

The process is this. You create a new page in WordPress and activate the page builder. Builders like Beaver Builder and Elementor are designed to be live front-end page builders that allow you to see changes as you make them.

In the editor, one starts by creating a new section. That section can have one or many columns. In those columns elements or blocks are dragged and dropped into place and then customized with text and styling.

Using Pre-made Layouts

One of the major benefits of using builder technology is the ability to take advantage of prebuilt modules, sections and pages. These layouts are available for free and are included with the builders or can be imported. Or, third party designers can design layouts and then make them available for sale.

The ability to utilize these layouts enable anyone to create a web page quickly and not be a trained graphic designer. The layouts can be used as inspiration for custom layouts or quickly customized to one’s unique needs.

Page Builder Themes

The one aspect of building web sites with a page builder is utilizing the right theme for page builders. Although all themes will work with page builder plugins, there are a handful of themes designed specifically for page builders. These four are the most popular as of today:

Each of these themes have free and premium upgrades. I highly recommend considering upgrading to the pro version for any of them as they provide additional customization features. My personal favorites are Astra and Generatepress.

Some of the page builders offer their own theme designed. However, one has to keep in mind that one project or another is going to have more effort and resources dedicated to it. In most cases, it will be the page builder element.

Carefully choose your theme and remain consistent with that theme. Try out each of the free versions and how they operate. Pick the one that fits your style the best. Like anything else, if one remains consistent and dedicated to a particular theme, it will become much faster and easier to deploy new sites rather than having to learn the ins and outs of a new theme each time.

Upcoming Changes

One of the many drastic changes that will be coming to WordPress and page building is the development of the Gutenberg editor. The Gutenberg editor will be replacing the built-in traditional word processor-like editor with the Gutenberg editor which employs block constructions similar to the page builders.

None of us know how all this is going to play out, but we know that creating pages and posts is going to become more a drag and drop concept from top to bottom. We will no longer be limited to the static design of themes.

Like this article?

Share on facebook
Share on Facebook
Share on twitter
Share on Twitter
Share on linkedin
Share on Linkdin
Share on pinterest
Share on Pinterest

Leave a comment

SAK Logo

This website uses cookies to ensure you get the best experience on our website.