Magento Page Builder Developer Guide

To get started with Page Builder development, visit the Page Builder Developer Guide. This guide provides overviews, tutorials, and how-to instructions for customizing Page Builder for end-users.

The following links provide quick access to our Page Builder GitHub code examples and a few key development topics.

Page Builder example modules

• PageBuilderExtensionSlider — Created by Bruce Denham. This module shows you how to add centerMode and centerPadding settings from the slick carousel used by the Slider.

• PageBuilderExtensionBanner — Created by Bruce Denham. This module shows you how to customize an existing content type: the Banner. This is the completed module featured in the Extend a content type tutorial.

• PageBuilderQuote — Created by Bruce Denham. This module shows you how to create a content type for a customer testimonial page. This is the completed Quote module featured in the Create a content type tutorial.

• PageBuilderGrid — Created by Dave Macaulay. This module shows you how to create a content type that recreates the layout of the Magento Luma-themed home page using a grid structure with grid items.

• PageBuilderFaq — Created by Igor Melnikov. This module shows you how to create a content type for an FAQ page that uses an accordion for the questions and answers.

Tutorials

• Extend an existing content type
• Create a new content type

How-Tos (just a few)

• How to customize the Page Builder panel
• How to add an image uploader
• How to add a storefront widget
• How to add a custom toolbar
• How to add icons and images
• How to change breakpoints

Reference

• Page Builder configurations
• Page Builder Datastore
• Page Builder events
• Page Builder Knockout bindings
• Page Builder architecture

Page Builder User Guide

To learn more about Page Builder from an end-user’s perspective, start with the Page Builder User Guide.