> For the complete documentation index, see [llms.txt](https://knowledge.themeware.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://knowledge.themeware.design/knowledge-base/introduction/editing-themeware.md).

# Editing ThemeWare®

In this article you will learn how to edit ThemeWare®, that is, how to configure it.

You edit themes, and therefore ThemeWare®, in the **theme administration**. There are two ways to get there:

1. The first way is to click on "**Content**" and then on "**Themes**". (**Note**: In the Shopware Cloud you will find the "Themes" area directly in the main navigation.)\
   You then see all installed themes. Click the theme in question, or ThemeWare®, to get to the theme configuration and edit the theme.
2. The other way is to select your **sales channel**. Then click on the tab "**Theme**" and there on "**Edit theme**". This takes you straight to the theme configuration and you can edit the theme.

## Example

> **Example**: The first thing you notice in the storefront is the **USP bar**. In this example we change the background colour of the USP bar.

Open the administration of your shop

1. Switch via the main navigation to the "**theme administration**" (1) (2) ("Content" => "Themes")
   * **Note**: In the Shopware Cloud you will find the "Themes" area directly in the main navigation.
2. Now click on your ThemeWare® theme to start editing
3. The USP bar is an extension, so we switch to the tab "**Extensions**" (3)
4. Scroll down a bit and open the block "**USP bar**" (4)
5. Scroll down a bit further to the section "**Colour configuration**"
6. Clicking the button to the left of the input field "**Background colour (Header)**" opens the "colour picker" (5)
7. We select the colour `#e2f4fd`
8. Save the theme configuration (6)
9. Switch to the storefront and reload the page

You have now changed the background colour of the USP bar.

{% hint style="success" %}
**Tip**: If a change does not take effect in the storefront, refresh the storefront once using the following tutorial: [Refreshing the storefront](/knowledge-base/tutorials/miscellaneous/refreshing-the-storefront.md)
{% endhint %}

{% hint style="success" %}
**Tip**: You do not have to click your way through the tabs to find a setting. With the Config Finder you simply type "`usp background colour`" and immediately see only the matching configuration fields: [Find configuration](/knowledge-base/introduction/find-configuration.md)
{% endhint %}

{% hint style="info" %}
**Note**: There is a separate article about the USP bar later on.
{% endhint %}

#### Screenshots

![](https://1979975522-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F178YilsPBIFHBAxTvcMo%2Fuploads%2FDfqGnU4hMjP6gai6hxHJ%2Fconfig--twt-usp-bar-color.png?alt=media\&token=0b6bc169-4432-4293-99de-ee8001f2b3b2)

**After**

![Example](https://1979975522-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F178YilsPBIFHBAxTvcMo%2Fuploads%2Fgit-blob-aac5a32b06eaf7caac949328fbcba6adc837c893%2Ftutorial--usp-bar.png?alt=media)

***

## Further information

If you have further questions or any problems, you can find more information in our detailed tutorial: [Editing ThemeWare®](/knowledge-base/tutorials/administration/editing-themeware.md)
