Magento 2.4 Page Builder

Magento 2.4 Page Builder

With the release of Magento Open Source 2.4.3 and Page Builder, Adobe has come up with a feature rich system to create high quality content accessible by all. With the extensibility of Page Builder, the addition of more features in future releases of Magento 2 Open Source is something that all store owners can look forward to.

The Magento 2 Page Builder extension’s key features include:

• 1) Advanced content tools
• 2) Full-page layouts for CMS pages, products, and categories
• 3) Real-time editing from the workspace
• 4) Drag and drop page design
• 5) Rich assortment of content types
• 6) Custom product attribute input types

Page Builder is now available as a bundled extension in Magento 2 Open Source. Previously only available to commerce customers, Page Builder is now the default content editing tool for Magento Open Source 2.4.3 as well as Adobe Commerce 2.4.3.

Page builder overview video by Adobe Business.

Page Builder replaces the standard TinyMCE editor in the following Admin areas:

• 1) CMS Page
• 2) CMS Block
• 3) Category Description
• 4) Product Description
• 5) Many third party extensions

Page Builder comes with a number of features that are designed to improve quality, and reduce the time and expense of producing custom pages including:

• 1) Advanced content tools
• 2) Full-page layouts for CMS pages, products, and categories
• 3) Real-time editing from the workspace
• 4) Drag and drop page design
• 5) Rich assortment of content types
• 6) Custom product attribute input types

Content Types

The Page Builder facilitates creating content using pre-built drag-and-drop controls defined as “Content Types”. Content is managed effortlessly. By dragging and dropping content types onto the stage the process of creating content-rich pages is made significantly more accessible. Each content type comes with a number of settings and options translating to outputs that would traditionally be facilitated by adding code to a stylesheet or script.

Layout

Out of the box the Page Builder offers an enriched grid system for the organisational units of a page. The Row, Column and Tab content types come with options to adjust alignment, add padding and margins and assign different types of background including parallax.

Elements

Text, heading, button, divider and HTML content types are found under the elements tab and can be added to any layout container on the stage. The HTML content type retains the functionality of the TinyMCE editor found in previous versions of Magento allowing semantically correct HTML and custom widgets to be added directly. This is particularly useful for store administrators who are looking to upgrade their sites and want to retain the effort that had been put into building custom widgets. The Pagebuilder content types will complement any previously built widget portfolio.

Media

Media content types image, video, banner, slider and map are all available and can be added to any of the layout content types on the stage.

Add Content

There is also the option to add predefined blocks, dynamic blocks and products. Products can be selected by category, SKU or a user defined condition.

Out of the box the page builder allows for construction of some fairly complex pages. If this should fall short of a project's requirements then with some developer assistance, the option to add custom content types is available.

One caveat
With all the power, flexibility and possibilities of the Page builder, store owners should be wary of falling into the trap of making too many unique pages. Magento has recognised this and provided a supporting function in the form of templates which can be used to replicate a base set up of a particular page style.

Templates
A Template act’s as a container that can save Page Builder content of existing pages, blocks, dynamic blocks, product attributes, and category descriptions. Creating new content templates can save time and effort ensuring that you have a common starting point for building similar pages.

Get in touch to get started on your next Magento build.