# Get started with legacy theme extensions

> The archived development and preview workflow for legacy Shoplazza theme extensions built with the shoplazza te command.

:::caution Legacy Docs
This page describes the legacy theme extension development process based on the `shoplazza te` command. For the latest development process, please refer to [Create a Theme Extension](/docs/app/extensions/online-store/add-theme-extension).
:::

:::note
The Getting started guide for ​​Theme Extension Development​​ in this article is based on the use of the ​​Shoplazza CLI​​ (specifically the **shoplazza te command**).

Additionally, you can also create and develop extensions using the ​​Shoplazza CLI​​ (via the **shoplazza app command**). For more details,[ please refer to this documentation](/docs/app/developer-tools/shoplazza-cli/app-command/usage-guide).
:::

# Theme Extension Development

Theme Extension is a way provided by Shoplazza to extend and customize theme pages. Developers can use Theme Extension to extend and customize theme pages.

### Development Process

**Install Shoplazza CLI:**

```text title="cli"
npm install -g shoplazza-cli
```

**Log in to Developer Store**

```text title="cli"
shoplazza login --store https\://{shopdomain}.myshoplaza.com/
```

**Create Extension:**

```text title="cli"
shoplazza te create
```

Choose the [Extension type (Basic or Embed)](/docs/app/extensions/online-store/add-theme-extension).

* Basic Extension: Allows adjusting the insertion position in the theme editor.
* Embed Extension: The insertion position is hardcoded in the Extension (recommended for pod developers).

**Start Development:**

```text title="cli"
cd your-project
shoplazza te serve
```

Note: Select a template to develop your theme and preview. After you choose the theme, there are 2 links shown below:

Two links will be displayed:

* The first link redirects to the theme editor, where you can enable the Extension and save the theme.
* The second link redirects to the storefront for preview.

### Preview Process：

* Access the Theme Editor Preview Link in the Store Backend:
* Open the browser and navigate to the theme editor preview link in the store backend.

![](https://cnres.appracle.com/ec807225ac320b242aab2ced6458e161.png)

* Add Theme Extension in the Theme Editor:\
  Embed App: Go to App Management and enable the extension.

![](https://cnres.appracle.com/0f5aad48dbcad59e10a6f3407c1cd572.png)

* Complete Configuration in the Theme Editor and Save Draft:
* Once the configuration in the theme editor is complete, save the draft. You can then access the storefront preview link to preview the changes.

**Build Production Version:**

```text title="cli"
shoplazza te build
```

* Enter the App's client\_id and client\_secret obtained from the Shoplazza Partner backend.

**Release Extension**

```text title="cli"
shoplazza te release
```