# Overview

Learn how to configure themes using the new Theme Editor - [Click here to view the overview and documentation](/commerce/docs/manage-website/appearance/theme-editor/overview)

**How to access Themes on Fynd Commerce**

Commerce Panel → Sales Channel (select application) → Theme → Store Design

Fynd Commerce  supports multiple themes which you can use to customize the appearance of your website and mobile app.

On the Fynd Commerce  theme page, themes are organized into three sections:

1. Active Theme: This section displays the currently applied theme on the website.
2. Theme Draft: Themes that have not been published on the sales channel and are currently undergoing customization or editing.
3. Theme Collection: This category includes all themes that have been added from the theme marketplace.


## Changing your Theme

Follow the instructions to add another theme on your sales channel:

1. Go to the desired sales channel.
2. Click **Appearance**.
3. Click **Themes**.
4. You can see the collection of themes under theme collection section. You can choose the theme you want to add on the sales channel. Or, add the theme from the themes marketplace.
5. Click **Create Draft**.
6. Click **Edit** to customize your theme. Refer to the *Customizing Your Theme* section below to learn about how to edit themes.
7. Click **Publish**.


### Adding a Section to the Theme Editor

1. In the theme editor, click on the **Add Section** option.
![QG1](https://cdn.pixelbin.io/v2/doc/original/moonlight/v1.9.5/3.png)


center
em
Figure 8: Add Section
br
1. You can select from three types of sections:
  1. Default Sections
  2. Global Sections
  3. Extension Sections


![QG1](https://cdn.pixelbin.io/v2/doc/original/moonlight/v1.9.5/4.png)

center
em
Figure 9: Type of Sections
br
1. Provide a unique name for the section.
2. Enter the title that will be visible to users within the section.
3. You can choose to mark the section as global. When a section becomes a global component, it resides separately from the default sections and any modifications to the global component will reflect at all the places where the component has been used in the storefront.


![QG1](https://cdn.pixelbin.io/v2/doc/original/moonlight/v1.9.5/5.png)

center
em
Figure 10: Section Details
br
### Adding Blocks Within a Section

1. Within a section, you can add blocks. Choose from:
  1. Default Blocks
  2. Extension Blocks
2. Provide a name for the block to identify its content or function.
3. After selecting and naming the block, click **Save**.


![QG1](https://cdn.pixelbin.io/v2/doc/original/moonlight/v1.9.5/7.png)

center
em
Figure 12: Save
br
For more details about blocks, refer [here](https://partners.fynd.com/commerce/docs/partners/themes/reactjs/blocks/).

You can customize the themes in your **Theme Drafts**. However, removing a theme from drafts will also take away the customizations, and you may have to add a theme from **Explore Marketplace** once again.

## Upgrading Your Theme

Click **Update** to upgrade your theme to the latest version. This action will generate an updated copy of the theme.

Whenever an update is available, it's recommended to upgrade all the themes present in your **Theme Drafts**.

## Adding SEO Information

1. Themes allow you to add SEO information to every system pages, such as brands, collections, home, categories, and many more. Choose the system page from the drop-down and click the overflow icon `⠇`.
![QG1](https://cdn.pixelbin.io/doc/original/searchlight/platform-panel/settings/general/seo/10.png)
Figure 14: Choosing System Page

2. Click **Update SEO**.
![QG1](https://cdn.pixelbin.io/doc/original/searchlight/platform-panel/settings/general/seo/11.png)
Figure 15: Updating SEO

3. Enter a title and description for the selected system page. Alternatively, you can use AI-powered (Artificial Intelligence) **Generate** or **Generate Using Custom Keyword** options to create title and description automatically.


No matter how long the title and description is, search engines will show only upto 50-60 characters of the title, and 155-160 characters of the description in the search results. Therefore, you should consider adding the most relevant keywords in the beginning.

### Why can't I see the 'Update SEO' option for some pages?

Few pages do not have an option to configure an SEO. Say for example, the collection listing page doesn't have an **Update SEO** option because there's already an option to [add SEO information while creating a collection.](/commerce/docs/marketing/collections#adding-seo-information)

![QG1](https://cdn.pixelbin.io/doc/original/searchlight/platform-panel/settings/general/seo/13.png)

center
em
Figure 17: Missing SEO Option
br
## Theme Details & Support

For more information about themes or to contact the theme support person for queries, concerns, or inquiries, follow these steps:

1. Navigate to Company Settings.
2. Click on **Themes**.
3. Select **Details** on the theme for which you want more information.
4. The themes will open in the theme marketplace.


![QG1](https://cdn.pixelbin.io/v2/doc/original/searchlight/platform-panel/themes/theme11.png)

center
em
Figure 21: Theme Marketplace
br
Here, you can access documentation related to that theme, find release notes, contact details, developer information, and more.