Skip to navigation

Lab - Navigate Page Builder

Plan: Stencil Developer

Lesson 4 of 23 · 15 min

This lab is optional. It’s a quick tour of Page Builder’s interface before you start building with the Widgets API.

In this lab you will

  • Open Page Builder for your sandbox store
  • Browse the built-in widget templates available in the widget palette
  • Drag a widget into a region on a page
  • Configure the widget’s settings

Prerequisites

  • BigCommerce store (sandbox or live)
  • Active BigCommerce store with user permission to edit Template Files

Open Page Builder

  1. Open the store control panel and go to Storefront > My Themes
  2. Click Customize on your active theme to open Page Builder

Browse the Widget Palette

  1. Click the Widgets icon in the left-hand menu
  2. Browse the list of built-in widgets available to drag onto the page

Drag a Widget into a Region

  1. Navigate to a page in the editor preview that has an available region, such as the home page
  2. Drag a widget, such as Image or Text, into a region on the page
  3. Configure the widget’s settings in the panel that opens
  4. Save your changes

Throughout this course, you’ll use the Widgets API to build your own custom widgets, which appear and behave in Page Builder exactly like the built-in widgets you just explored.