Starter Kit

Overview

Starter Kit is a foundation for you to build off of to create your Store with Shogun Frontend.

📘

Requirements

Before you start, consider reading React, Chakra UI, and Storybook documentation.

Setting up

Contact your Shogun rep or Shogun support to get your store with Starter Kit.

After your store is populated with Starter Kit Components and Sections, you can start creating Pages, Templates, adding Sections to Pages/Templates, and so on.

Creating Pages

For a better experience, you need to create a few Pages.

Page name

Page path

Homepage

/

404

/404

Cart

/cart

Search

/search

Account

/account

Register

/account/register

Login

/account/login

Orders

/account/orders

Address

/account/address

Forgot Password

/account/recover-password

Reset Password

/account/reset-password

To create a page:

  1. Click on the Pages icon from the sidebar.
  2. Click ADD PAGE on the top right corner.
  3. Enter the PAGE NAME, for example: Homepage.
  4. Enter the PAGE PATH, for example: /.
  5. If you want, you can select a Frame from the Frame dropdown.
  6. Click ADD PAGE.

Creating Templates

For a better experience, you need to create 2 templates: Products and Collections.

  1. Click on the Templates icon from the sidebar.
  2. Click ADD TEMPLATE on the top right corner.
  3. Enter the TEMPLATE NAME, for example: Products.
  4. Select the Template CMS under the USE TEMPLATE FOR dropdown, for example: Products. Reminder: you can only associate one CMS Group per template.
  5. If you want, you can select a Frame from the Frame dropdown.
  6. Click ADD TEMPLATE.

Adding Sections to Pages and Templates

Check the Starter Kit Sections documentation on which Sections need to be added to Pages and or Templates

Creating variables

To leverage Starter Kit's flexibility, some Sections allow customization via variables. Check them out on the Starter Kit Sections documentation.

API Reference

Coming soon:


Did this page help you?