> This page is for Developer.

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.bigcommerce.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.bigcommerce.com/_mcp/server.

# Lab - Navigate Makeswift

Plan: Stencil Developer

Lesson 5 of 23 · 15 min

> **Warning**
>
> Makeswift on Stencil is currently in Beta, and this lab is optional. Features and availability are subject to change. To enable the beta and connect Makeswift to your storefront, see [Makeswift on Stencil](https://docs.makeswift.com/product/docs/guides/makeswift-on-stencil).

**In this lab you will**

* Open Makeswift for your sandbox store
* Browse the native components available in the component drawer
* Drag a component into a region on a page
* Configure the component's settings

**Prerequisites**

* BigCommerce store (sandbox or live) with the Makeswift beta enabled
* Active BigCommerce store with user permission to edit Template Files

## Open Makeswift

1. **Open** the store control panel and go to the **Channel Manager**
2. **Select** the Makeswift-connected channel and click **Edit in Makeswift**

## Browse the Component Drawer

1. **Open** the component drawer
2. **Browse** the native Stencil components available to drag onto the page, such as Accordion and Card

## Drag a Component into a Region

1. **Navigate** to a page in the editor that has an available region, such as the home page
2. **Drag** a component into a region on the page
3. **Configure** the component's settings in the panel that opens
4. **Save** your changes

Throughout this course, you'll build your own widget templates, which appear in Makeswift as native components in the component drawer, just like the ones you just explored. Of the topics in this course, only widget templates and regions apply to Makeswift.