Now WordPress PageBuilders Become SiteBuilders

There is no doubt there is a lot of competition in the WebBuilders marketplace. There are at least 10 very good WordPress PageBuilders. WordPress is now used on 29.2% of the world’s websites. Yet it is  undergoing a PHP to JavaScript makeover with Gutenberg. Gutenberg , you see, is more than a Javascript based new Visual Editor in the WordPress core system. Gutenberg is targeted to become an overall Website Builder or SiteBuilder. Users of Gutenberg in the near future are promised  they will be able to use Gutenberg to build not just content on  pages and posts but the overall websites headers, sidebars, and footers. Web Designers will be able to layout a unique look to every page and post on their website if hey want.

What does this mean for WordPress Web Designers and Developers?

Soon every  Web page  can have its own specific layout and  style, from head to foot. They don’t have to conform to the classic Header-Content-Sidebar-Footer layout that has dominated Web Design since the beginning of the Internet 25 years ago. Designers can deliver innovative Landing pages or standard Report summaries quickly. Each page [or group of pages] with the new SiteBuilders can be designed with its own set of  Portfolio Layouts or its unique Story-Telling Look or its standard Analysis Report Formats.

And the same drag & drop, easy to use PageBuilders UI tools that have revolutionized building  WordPress Page Content will be key parts of the  SiteBuilders. Think Visual Composer,  Beaver Builder, Divi 3, Elementor, SiteOrigin PageBuilder to name just the top 5 most popular WordPress PageBuilders. Right now  3 of these PageBuilders are being transformed into any-layout Web PageBuilders  or SiteBuilders.

Transformation of PageBuilders into SiteBuilders

Beaver Builder has become one of the more popular WordPress PageBuilders in the past 4 years. In 2017, Beaver Builder  introduced an addon, Beaver Themer which allows users to design unique headers and footers.
Here we see Beaver Themer being used to design a unique header which will be used for all portfolio pages. Beaver Themer uses the familiar  Beaver Builder IDE tools and components to edit headers, footer and other web page components.  Beaver Themer is sold as a separate extension to Beaver Builder for $147US for unlimited usage [but yearly renewal?].

But Beaver Builder is not alone among the top WordPress PageBuilders in transforming its PageBuilder into an overall webpage SiteBuilder. The oldest and sales leading [2 million copies being used worldwide] Visual Composer has added a premium version that will allow users to edit the header, footer and sidebar on a Web Page

Premium Visual Composer has a FAQ page that helps  answer a number of questions. First and foremost, the Lite version will remain free and will receive a regular series of updates and will be a part of  the Premium edition. But it is not clear if the Lite version will be able  to load the many free WP Bakery PageBuilder addon plugins available in the WordPress library. Currently it does not.

The Premium edition is designed to be able to edit headers, footers and sidebars. In fact, the intention is for the Premium edition to be able to bypass any existing theme haeders, footers and plugins [selectively is not clear yet]. Then users replace headers, footers or sidebars with their own designs including templates they can custom make.

Finally, the Premium edition will have both a  Hub and a new API. The latter will allow users own to create their own Visual Component  elements and stylings while the Hub will be the source of free templates and element contributed by users as well as their own staff. Here is a look at the new Visual Composer IDE: Some of the Hub add-ons allow for customizing header, footer and sidebar.

Elementor is another top WP PageBuilder [300,000 downloads and over a dozen free 3rd party add-ons plugins] which already has SiteBuilder capabilities using some of those add-ons. However, the add-ons require either some core code changes or the use of multipurpose themes which can turn off headers, sidebars and/or footers selectively. However, the strong rumor is that Elementor will have its own Theme Builder which will allow users to edit not only  headers, sidebars and footers but also some added sitewide customizations.

Also there are a number of WordPress PageBuilders like Thrive Architect that allow for custom editing of header and footer layouts in special backend operations. Also, one could argue that multipurpose themes like Generate Press Pro  and others allow for a number of sitewide editing capabilities including customization of headers and footers.

Finally, it is important to consider JavaScript frameworks like Mobirise and Bootstrap Studio which are SiteBuilders that  support extensive creating, editing  and customization of any webpage element. the javaScript frameworks  sometimes have special sitewide editing features that make them competitive with overall WebBuilders [WebBuilders = Site Wide UIs plus plugin and Admin operational features like backup, security, and performance tuning like SquareSpace, Weebly and Wix].

Implications for Website Design and Development

Clearly WordPress PageBuilders are responding to the writing on the UI IDE wall; they are becoming SiteBuilders able to assist in design and  editing anywhere on a WordPress webpage.  Gutenberg triggered the need  by setting a  sitewide web page design goal which it is currently far from attaining. But WordPress PageBuilder vendors can see the competition from JavaScript SiteBuilders and general WebBuilders, so the smart ones are gearing up for long term competition.

But even more compelling is that in the intensely competitive  WP PageBuilder market, the vendors are looking for any advantage. Thus they are now adopting advanced UI IDE features such as:

1. inline text block editing and styling
2. image, text block and object group moving and resizing
3. in-place image and video refinement and resizing
4. use of popup or slide-in modals triggered by scrolling, timing and hover/click events
5. multilayer overlapping blocks appear and disappear on Hero Landing Pages with user control of the animations
6. advanced Layout and Styling Queries live surveys prior to  generating a Design with multiple options for user customization.

In sum, the next few years should see even better DIY, “No Programming Required” UI tools emerging in both the WordPress but the broader Website Development field. What is even more impressive is that these tools will deliver websites that are responsive in both senses of the word – mobile ready plus speedy and performant.