> ## Documentation Index
> Fetch the complete documentation index at: https://dev.smile.io/llms.txt
> Use this file to discover all available pages before exploring further.

# BigCommerce Stencil

BigCommerce storefronts using Stencil themes can use our explainer page template to get started with a simple loyalty landing page.

### 1. Download `files4.zip` from GitHub

Start by [downloading the zip](https://github.com/smile-io/code-samples/blob/main/bigcommerce-stencil-files/files%204.zip) containing the explainer page sample.

Then, login to your BigCommerce account and go to **Storefront** > **My Themes**. Under **My Themes**, select **Advanced Options** and **Download Current Theme**.

Open your terminal and run `cd ~/Downloads/` followed by the file name, e.g. `cd ~/Downloads/Cornerstone-1.9.1`

After entering this, you should: `sudo npm install`, which will prompt you for your password.

### 2. Bundle the Explainer Page files and the Theme files

While this is installing, go to your **Downloads** and open the `files 4.zip`. Select **Assets and Templates**, and merge them into your downloaded theme file.

When this has finished loading in terminal run: `stencil bundle` to bundle the theme together. If you receive a warning in terminal while the files are being bundled such as this:

`**failed -- The following template(s) are/is missing: components/pages/page-header**`

Open the `loyalty-explainer-page.html` file located in **Templates** file in a text editor (such as Atom or Sublime Text) and scroll to line 28 and delete:`**{{> components/pages/page-header page_title=page.title}}**`

### 3. Upload the Explainer Page

When the theme is bundled select **Upload Theme** on your BigCommerce Dashboard, just below where your **Current Theme** is located.

Upload the changed theme file to your **Current Theme**.

### 4. Customize the Explainer Page

Once the file with the added **Assets and Templates** is uploaded to your theme, select **Customize**, scroll down on the sidebar to the bottom and select **Edit Theme Files**. From here you will be able to make customizations to the Smile.io Explainer Page from your BigCommerce Dashboard.
