# Theme Builder

Whether you're a merchant looking for a quick setup or an agency creating custom stores for clients, Smind makes theme building **fast, flexible, and intuitive**.

With **two powerful ways to create a theme**, you can choose the approach that best suits your needs:

{% embed url="<https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FjRi1aohY8I4BPjjvC9cH%2Fuploads%2Fe0hROJzuB2zWtCQd9rE1%2FTheme%20Builder%20Final.mp4?alt=media&token=15a3e71e-b5f6-4da6-8e69-2b60f4758cf3>" %}

## Option 1: Install a Pre-Created Theme

You can create a new theme using the available Pre-Created themes. Follow the steps below.

1. From our app, click **Theme Builder.**
2. Click **Start Building** button.&#x20;

<figure><img src="/files/rgnjNjBJisepSpxo7sKe" alt=""><figcaption><p>Click on "Build Theme" button to start building</p></figcaption></figure>

3. Select the pre-made theme that you want. Click **Select**

<figure><img src="/files/ZU9HvJ1uWM5sa1aLYLfA" alt=""><figcaption><p>Click on Select button</p></figcaption></figure>

4. Enter the name of theme and click **Start Building.**

<figure><img src="/files/Cxa4ZWWRQXbAhcjw8JcF" alt=""><figcaption><p>Give a name of the theme</p></figcaption></figure>

5. Once you've selected a template, you can easily customize your theme by navigating to the Theme Settings. Here, you can adjust settings like colors, fonts, layout, and other theme elements to match your preferences.
6. Click **Content Editor** to edit the content for the theme.

<figure><img src="/files/WXIH8eofsy6H6RVaDFX1" alt=""><figcaption></figcaption></figure>

## Option 2: Build with the Theme Builder

You can create a new theme by build it from scratch. Follow the steps below.

1. From our app, click **Theme Builder.**
2. Click **Start Building** button.&#x20;
3. From this screen is an layout default of theme -> You can start select template or section from library to freedom to build any page type.

<figure><img src="/files/8RVkFxNCNO4kxBNALqfw" alt=""><figcaption></figcaption></figure>

4. After create full page type you can Click on "**Save**" button -> then click on "**Content editor**" -> **Install** the theme to your store.

<figure><img src="/files/T0NEpSeyKcvTpGARrQsU" alt=""><figcaption><p>This is the default editor with friendly layout to use</p></figcaption></figure>

**On Top**: You can select the page type like Home Page, Collection Page, Product page, and Other pages

<figure><img src="/files/ciu4fuLtm7USWO8vunfC" alt=""><figcaption></figcaption></figure>

**On Left**: You can add section for **Header/Body/Footer** based on our big Library layout

<figure><img src="/files/4qE816IzDfFgtc4lUhy8" alt=""><figcaption></figcaption></figure>

## &#x20;How to use "Quick build"&#x20;

**My quick builds** are all themes you created before will be listed here for you Re-use it to save your time of customize.

1. From our app, click **Theme Builder**
2. Select the theme you want to use. Click **Quick Build**

<figure><img src="/files/BChsWkGwYmwMFu3GZyHM" alt=""><figcaption></figcaption></figure>

3. When click on "Quick build" button. You can drag and drop new sections into your theme, adjust the layout, or replace existing sections or templates with just a few clicks.

<figure><img src="/files/U4VuQCHvgBUOMfE2gfRT" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/0ZGalOB7mtwYN7MUypMO" alt=""><figcaption></figcaption></figure>

**Note:** Remember to save your changes after making any adjustments.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.smind.io/in-app/theme-builder.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.