# Configuration

## Basic configuration

***

### Corner type

**Field type**:\
Select

**Available values**:\
• default\
• rounded corners\
• round corners

**Example value**:\
`round corners`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Basic configuration"

**Technical name**:\
`twt-product-badges-corner-type`

{% hint style="info" %}
**rounded corners**\
Uses the configuration "Border radius". (see "Layout" > "Layout" > "Border radius")

**round corners**\
Uses a predefined radius for round corners.
{% endhint %}

***

### Font size

**Field type**:\
Number field

**Example value**:\
`16`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Basic configuration"

**Technical name**:\
`twt-product-badges-font-size`

## Badge: Stock badge

***

### Mode

**Field type**:\
Select

**Available values**:\
• Show stock above/below the threshold\
• Always show stock

**Example value**:\
`Show stock above/below the threshold`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Stock badge"

**Technical name**:\
`twt-product-badges-stock-badge-mode`

{% hint style="info" %}
Choose when the badge is shown: only around the threshold or always.
{% endhint %}

***

### Threshold (low stock)

**Field type**:\
Number field

**Example value**:\
`10`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Stock badge"

**Technical name**:\
`twt-product-badges-stock-badge-threshold-lowstock`

{% hint style="info" %}
A badge is displayed for products with a lower stock level.
{% endhint %}

***

### Threshold (high stock)

**Field type**:\
Number field

**Example value**:\
`500`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Stock badge"

**Technical name**:\
`twt-product-badges-stock-badge-threshold-highstock`

{% hint style="info" %}
A badge is displayed for products with a higher stock level.
{% endhint %}

***

### Coloration

**Field type**:\
Select

**Available values**:\
• default\
• default, contrast\
• default, light\
• individual coloration

**Example value**:\
`default`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Stock badge"

**Technical name**:\
`twt-product-badges-stock-badge-coloration`

{% hint style="info" %}
**default**:\
Default badge colour of Shopware 6 with white text colour.

**default, light**:\
Light shade of the default badge colour with a sufficiently high-contrast text colour.

**default, contrast**:\
Default badge colour of Shopware 6 with a sufficiently high-contrast text colour.

**individual coloration**:\
Enter an individual background colour. A sufficiently high-contrast text colour is generated automatically.
{% endhint %}

***

### Background colour (individual coloration)

**Field type**:\
Color picker

**Example value**:\
`#f1c40f`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Stock badge"

**Technical name**:\
`twt-product-badges-stock-badge-background-color`

{% hint style="info" %}
**Note**: This configuration relates to the coloration "individual coloration".

For sufficient contrast with white text, we recommend #a06b00.
{% endhint %}

***

### Show icon

**Field type**:\
Select

**Available values**:\
• don't show\
• show

**Example value**:\
`don't show`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Stock badge"

**Technical name**:\
`twt-product-badges-stock-badge-icon-show`

{% hint style="info" %}
To edit the icon please use the following snippet: twt.extension.stockBadge.lowStock.icon resp. twt.extension.stockBadge.highStock.icon
{% endhint %}

## Badge: Sold badge

***

### Coloration

**Field type**:\
Select

**Available values**:\
• default\
• default, contrast\
• default, light\
• individual coloration

**Example value**:\
`default`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Sold badge"

**Technical name**:\
`twt-product-badges-sold-badge-coloration`

{% hint style="info" %}
**default**:\
Default badge colour of Shopware 6 with white text colour.

**default, light**:\
Light shade of the default badge colour with a sufficiently high-contrast text colour.

**default, contrast**:\
Default badge colour of Shopware 6 with a sufficiently high-contrast text colour.

**individual coloration**:\
Enter an individual background colour. A sufficiently high-contrast text colour is generated automatically.
{% endhint %}

***

### Background colour (individual coloration)

**Field type**:\
Color picker

**Example value**:\
`#e74c3c`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Sold badge"

**Technical name**:\
`twt-product-badges-sold-badge-background-color`

{% hint style="info" %}
**Note**: This configuration relates to the coloration "individual coloration".

For sufficient contrast with white text, we recommend #e52427.
{% endhint %}

***

### Show icon

**Field type**:\
Select

**Available values**:\
• don't show\
• show

**Example value**:\
`don't show`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Sold badge"

**Technical name**:\
`twt-product-badges-sold-badge-icon-show`

{% hint style="info" %}
To edit the icon please use the following snippet: twt.extension.soldBadge.icon
{% endhint %}

## Badge: Free shipping badge

***

### Coloration

**Field type**:\
Select

**Available values**:\
• default\
• default, contrast\
• default, light\
• individual coloration

**Example value**:\
`default`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Free shipping badge"

**Technical name**:\
`twt-product-badges-shipping-free-badge-coloration`

{% hint style="info" %}
**default**:\
Default badge colour of Shopware 6 with white text colour.

**default, light**:\
Light shade of the default badge colour with a sufficiently high-contrast text colour.

**default, contrast**:\
Default badge colour of Shopware 6 with a sufficiently high-contrast text colour.

**individual coloration**:\
Enter an individual background colour. A sufficiently high-contrast text colour is generated automatically.
{% endhint %}

***

### Background colour (individual coloration)

**Field type**:\
Color picker

**Example value**:\
`#4aa3df`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Free shipping badge"

**Technical name**:\
`twt-product-badges-shipping-free-badge-background-color`

{% hint style="info" %}
**Note**: This configuration relates to the coloration "individual coloration".

For sufficient contrast with white text, we recommend #008199.
{% endhint %}

***

### Show icon

**Field type**:\
Select

**Available values**:\
• don't show\
• show

**Example value**:\
`don't show`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Free shipping badge"

**Technical name**:\
`twt-product-badges-shipping-free-badge-icon-show`

{% hint style="info" %}
To edit the icon please use the following snippet: twt.extension.shippingFreeBadge.icon
{% endhint %}

## Badge: Discount badge

***

### Content

**Field type**:\
Select

**Available values**:\
• % (default)\
• -25 %\
• 25 % saved\
• -35 €\
• 35 € saved

**Example value**:\
`% (default)`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Discount badge"

**Technical name**:\
`twt-product-badges-discount-badge-type`

***

### Round number

**Field type**:\
Select

**Available values**:\
• 0.12 (default)\
• 0.1\
• 0

**Example value**:\
`0.12 (default)`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Discount badge"

**Technical name**:\
`twt-product-badges-discount-badge-round`

{% hint style="info" %}
Round the value either up or down (1.5 to 2).
{% endhint %}

***

### Coloration

**Field type**:\
Select

**Available values**:\
• default\
• default, contrast\
• default, light\
• individual coloration

**Example value**:\
`default`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Discount badge"

**Technical name**:\
`twt-product-badges-discount-badge-coloration`

{% hint style="info" %}
**default**:\
Default badge colour of Shopware 6 with white text colour.

**default, light**:\
Light shade of the default badge colour with a sufficiently high-contrast text colour.

**default, contrast**:\
Default badge colour of Shopware 6 with a sufficiently high-contrast text colour.

**individual coloration**:\
Enter an individual background colour. A sufficiently high-contrast text colour is generated automatically.
{% endhint %}

***

### Background colour (individual coloration)

**Field type**:\
Color picker

**Example value**:\
`#e74c3c`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Discount badge"

**Technical name**:\
`twt-product-badges-discount-badge-background-color`

{% hint style="info" %}
**Note**: This configuration relates to the coloration "individual coloration".

For sufficient contrast with white text, we recommend #e52427.
{% endhint %}

## Badge: Topseller badge

***

### Coloration

**Field type**:\
Select

**Available values**:\
• default\
• default, contrast\
• default, light\
• individual coloration

**Example value**:\
`default`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Topseller badge"

**Technical name**:\
`twt-product-badges-topseller-badge-coloration`

{% hint style="info" %}
**default**:\
Default badge colour of Shopware 6 with white text colour.

**default, light**:\
Light shade of the default badge colour with a sufficiently high-contrast text colour.

**default, contrast**:\
Default badge colour of Shopware 6 with a sufficiently high-contrast text colour.

**individual coloration**:\
Enter an individual background colour. A sufficiently high-contrast text colour is generated automatically.
{% endhint %}

***

### Background colour (individual coloration)

**Field type**:\
Color picker

**Example value**:\
`#f1c40f`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Topseller badge"

**Technical name**:\
`twt-product-badges-topseller-badge-background-color`

{% hint style="info" %}
**Note**: This configuration relates to the coloration "individual coloration".

For sufficient contrast with white text, we recommend #a06b00.
{% endhint %}

***

### Show icon

**Field type**:\
Select

**Available values**:\
• don't show\
• show

**Example value**:\
`don't show`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: Topseller badge"

**Technical name**:\
`twt-product-badges-topseller-badge-icon-show`

{% hint style="info" %}
To edit the icon please use the following snippet: twt.extension.topsellerBadge.icon
{% endhint %}

## Badge: New badge

***

### Coloration

**Field type**:\
Select

**Available values**:\
• default\
• default, contrast\
• default, light\
• individual coloration

**Example value**:\
`default`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: New badge"

**Technical name**:\
`twt-product-badges-new-badge-coloration`

{% hint style="info" %}
**default**:\
Default badge colour of Shopware 6 with white text colour.

**default, light**:\
Light shade of the default badge colour with a sufficiently high-contrast text colour.

**default, contrast**:\
Default badge colour of Shopware 6 with a sufficiently high-contrast text colour.

**individual coloration**:\
Enter an individual background colour. A sufficiently high-contrast text colour is generated automatically.
{% endhint %}

***

### Background colour (individual coloration)

**Field type**:\
Color picker

**Example value**:\
`#2ecc71`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: New badge"

**Technical name**:\
`twt-product-badges-new-badge-background-color`

{% hint style="info" %}
**Note**: This configuration relates to the coloration "individual coloration".

For sufficient contrast with white text, we recommend #00892d.
{% endhint %}

***

### Show icon

**Field type**:\
Select

**Available values**:\
• don't show\
• show

**Example value**:\
`don't show`

**Path to the configuration**:\
Tab "Content" => Block "Product badges" => Section "Badge: New badge"

**Technical name**:\
`twt-product-badges-new-badge-icon-show`

{% hint style="info" %}
To edit the icon please use the following snippet: twt.extension.newBadge.icon
{% endhint %}


---

# 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.themeware.design/manual/content/product-badges/configuration.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.