Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
The "Custom announcement" extension is an info element that can be displayed on product pages or in the checkout.
Status message can be displayed here. The element is suitable, for example, to inform about changed shipping times due to vacation or absence.
Note: The announcement is displayed if it is enabled in the theme configuration (either everywhere, only on product pages or only in the checkout), the "twt.extension.customAnnouncement.content" snippet is filled and – if set – the current date is within the configured start/end period.
Go to the "Extensions" tab
Expand the "Custom announcement (on product pages and in the checkout)" block
Set the configuration "Show custom announcement" to the desired mode ("show", "show (only on product pages)" or "show (only in checkout)")
Save your changes after editing
Edit the text using the following snippet:
twt.extension.customAnnouncement.content
Show custom announcement
Defines where the announcement appears: "show" (everywhere), "show (only on product pages)" or "show (only in checkout)".
Start date / End date
Tab "Extensions" => Block "Custom announcement (on product pages and in the checkout)" => Show custom announcement
Tab "Extensions" => Block "Custom announcement (on product pages and in the checkout)" => Section "Basic configuration" => Start date / End date
twt.extension.customAnnouncement.content
Limits the display of the announcement to a period.
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:


The new badge highlights new products – in the product box on listing pages and on the product page (gallery or buybox).
New
The "New" status is determined by the Shopware core. ThemeWare® has no control over this.
Go to the "Listing pages" tab
Expand the "Product badges (in the product box)" block
Scroll to the section "Badge: New badge"
Enable the configuration "Show new badge"
Save your changes after editing
Go to the "Product pages" tab
Expand the "Product badges (in the image gallery or buy box)" block
Scroll to the section "Badge: New badge"
Tab "Listing pages" => Block "Product badges (in the product box)" => Section "Badge: New badge" => Show new badge
Tab "Product pages" => Block "Product badges (in the image gallery or buy box)" => Section "Badge: New badge" => Show new badge
listing.boxLabelNew
Note: Shopware standard snippet (not a ThemeWare® snippet).
twt.extension.newBadge.icon
Save your changes after editing
Note: May be replaced by a theme configuration.
Note: The badge is displayed if Shopware marks the product as "New" – provided the new badge is enabled. The ThemeWare® badge only appears if the ThemeWare® mode is selected in the "New badge (Product badges)" setting; otherwise Shopware's default badge is used.
Note: This feature is in beta and may still change in an upcoming update.
The quickview feature adds a button to the product box in listings that opens a quick view of the product in a modal.
Go to the "Others" tab
Expand the "Beta" block
Set the configuration "Quickview" to "yes"
Save your changes after editing
Tab "Others" => Block "Beta" => Quickview
twt.extension.quickview.title
The Teaser text is a short, free text per product (e.g. "New", "Organic", "Limited") that you can show in the product box above or below the product name.
You maintain the text per product via a custom field. It is displayed as soon as you set a product box "Slot" to "Teaser text".
Switch to the "Listing pages" tab
Open the "Product box
Set "Slot above the product name" or "Slot below the product name" to "Teaser text (custom field)"
Save your changes after editing
You maintain the text per product via the "Teaser text" custom field.
Tab "Listing pages" => Block "Product box" => Section "Content" => Slot above/below the product name
"Teaser text" (Products)
You can find more information about the "Teaser text" custom field here:
With product badges you highlight products in the product box (listing pages) and on the product page (gallery or buybox) – e.g. as sold, new, discount, topseller, free shipping or with the stock.
Note: The product badges are independent of one another – depending on the product data and configuration, several badges can appear at the same time. For each badge you decide separately whether it is shown in the product box on listing pages and/or on the product page (in the gallery or in the buybox), provided the badge is enabled and the product meets the corresponding condition.
You can find the configuration in the tabs "Content", "Listing pages" and "Product pages":
Tab "Content" => Block "Product badges"
Tab "Listing pages" => Block "Product badges (in the product box)"
Tab "Product pages" => Block "Product badges (in the image gallery or buy box)"
Tab "Content" => Block "Product badges"
Tab "Listing pages" => Block "Product badges (in the product box)"
Tab "Product pages" => Block "Product badges (in the image gallery or buy box)"
The delivery time note shows the delivery time of an available product in the buybox. If a product is out of stock but can be restocked, the note "Ready for shipping in …" can be shown instead.
Go to the "Product pages" tab
Expand the "Delivery information (in the buy box)" block
Scroll to the section "Delivery time"
Enable the configuration "Show 'Delivery time'" and/or "Show 'Ready for shipping in …'"
Save your changes after editing
Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Delivery time" => Show 'Delivery time'
Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Delivery time" => Show 'Ready for shipping in …'
detail.deliveryTimeAvailable
detail.deliveryTimeRestock
The Shopping Experiences Header is a special header display where the header overlays the top area of a shopping experience (CMS page). It is especially suitable for overlaying images, videos and sliders.
On the home page the header overlays the shopping experience directly; for listing pages you additionally enable it via a custom field.
Important: So that the element behind the header is visible, the background color of the header and its elements should be set to "transparent" or "rgba(0, 0, 0, 0)".
Go to the tab "Header"
Expand the block "Shopping Experiences Header"
Set the configuration "Shopping Experiences Header" to "enabled (Header overlays the Shopping Experience)"
Save your changes after editing
On listing pages you control the Shopping Experiences Header per category via the custom field "Show 'Shopping Experiences Header'":
inherit from theme configuration – uses the global setting from the theme configuration
no – disables the Shopping Experiences Header for this category
yes – enables the Shopping Experiences Header for this category
Tab "Header" => Block "Shopping Experiences Header" => Shopping Experiences Header
"Show 'Shopping Experiences Header'" (listing pages)
You can find a tutorial on how to use the "Shopping Experiences Header" in our Knowledge Base:
The topseller badge marks highlighted products – in the product box on listing pages and on the product page (gallery or buybox).
Topseller
The "Topseller" status is determined by the Shopware core. ThemeWare® has no control over this.
Go to the "Listing pages" tab
Expand the "Product badges (in the product box)" block
Scroll to the section "Badge: Topseller badge"
Enable the configuration "Show topseller badge"
Save your changes after editing
Go to the "Product pages" tab
Expand the "Product badges (in the image gallery or buy box)" block
Scroll to the section "Badge: Topseller badge"
Tab "Listing pages" => Block "Product badges (in the product box)" => Section "Badge: Topseller badge" => Show topseller badge
Tab "Product pages" => Block "Product badges (in the image gallery or buy box)" => Section "Badge: Topseller badge" => Show topseller badge
listing.boxLabelTopseller
Note: Shopware standard snippet (not a ThemeWare® snippet).
twt.extension.topsellerBadge.icon
The sold badge marks sold-out products – in the product box on listing pages and on the product page (gallery or buybox).
Sold out
The status "Sold out" is fulfilled in Shopware if a product is in on "Clearance sale" and the "Available stock" is less than the "Min. order quantity". You can find more information in the Shopware documentation.
Go to the "Listing pages" tab
Expand the "Product badges (in the product box)" block
Scroll to the section "Badge: Sold badge"
Enable the configuration "Show sold badge"
Save your changes after editing
Go to the "Product pages" tab
Expand the "Product badges (in the image gallery or buy box)" block
Scroll to the section "Badge: Sold badge"
Tab "Listing pages" => Block "Product badges (in the product box)" => Section "Badge: Sold badge" => Show sold badge
Tab "Product pages" => Block "Product badges (in the image gallery or buy box)" => Section "Badge: Sold badge" => Show sold badge
twt.extension.stockBadge.noStock
twt.extension.soldBadge.icon
Note
The delivery information shows the availability of a product in the product box, above the price: a status dot plus the delivery time maintained on the product.
Four states are covered:
available (green)
pre-order (yellow)
ready for shipping in x days (yellow)
currently not available (red)
Go to the "Listing pages" tab
Expand the "Product box" block
Scroll to the section "Delivery information"
Show delivery information
"don't show"
"show"
Tab "Listing pages" => Block "Product box" => Section "Delivery information" => Show delivery information
Tab "Listing pages" => Block "Product box" => Section "Delivery information" => Layout type
wishlist.deliveryTimeAvailable
wishlist.deliveryShipping
wishlist.deliveryTimeRestock
You can add product data sheets in PDF format to the product using custom fields in the respective product. The data sheets can be displayed on product pages either in the "Properties" tab or in a separate "Datasheets" tab.
Go to the "Product pages" tab
Expand the "Tab "Description"" block
With ThemeWare® you have the option of filling a tab on product pages individually by using a custom field.
Go to the "Product pages" tab
Expand the "Tab "Custom content"" block
The discount badge points out reduced products – in the product box on listing pages and on the product page (gallery or buybox).
The "Discount" of a product is calculated from the difference between the "List price" and the "Price". For more information, see the .
Go to the "Listing pages" tab
The Symbols tab displays the product symbols of a product in a separate tab on the product page.
Switch to the tab "Product pages"
Open the block "Product symbols"
The datasheets tab shows the datasheets of a product in a separate tab on the product page.
Go to the "Product pages" tab
Expand the "Tab "Datasheets"" block
The free shipping badge marks products with free shipping – in the product box on listing pages and on the product page (gallery or buybox).
The status "Free shipping" is fulfilled in Shopware if a product is configured as "Free shipping”. You can find more information in the .
Go to the "Listing pages" tab
The manufacturer adds the manufacturer name to the product box of your category listings – optionally with a label in front of it.
The extension is described in the article "Manufacturer in listings":
Note: The delivery time note is displayed if the product is available (stock ≥ "Min. order quantity", or a digital product) and a delivery time is set – provided the "Show 'Delivery time'" configuration is enabled. If the stock is below the "Min. order quantity" but a delivery time and a restock time are set, "Ready for shipping in …" is shown instead, provided "Show 'Ready for shipping in …'" is enabled.
Note: The appearance of both notes follows the "Layout type" in the "Basic configuration" section.
Save your changes after editing
Note: May be replaced by a theme configuration.
Note: The badge is displayed if "Highlight product" is enabled for the product – provided the topseller badge is enabled. The ThemeWare® badge only appears if the ThemeWare® mode is selected in the "Topseller badge (Product badges)" setting; otherwise Shopware's default badge is used.
Save your changes after editing
Note: The badge is displayed if the product is on "Clearance sale" and the stock is below the "Min. order quantity" – provided the sold badge is enabled for the product box (listing pages) or the product page (gallery or buybox).
Choose the desired appearance under "Layout type"
Save your changes after editing
"inherit - like the product page": Uses the layout type of the product page (Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Basic configuration" => Layout type), so both surfaces stay in sync.
"Text": A plain line with the status dot – the familiar Shopware look, but in the ThemeWare® group.
"Label": The same line on a surface tinted in the status colour (green / yellow / red).
"Badge": A rounded badge without the dot – inherits the corner style and font size of the product badges.
"Chip": The dot sits in a tinted circle with the text next to it; hovering the product box grows the circle behind the text into a pill.
wishlist.currentlyNotAvailable
Note: Products without a delivery time show nothing.




Scroll to the section "Badge: Free shipping badge"
Enable the configuration "Show free shipping badge"
Save your changes after editing
Go to the "Product pages" tab
Expand the "Product badges (in the image gallery or buy box)" block
Scroll to the section "Badge: Free shipping badge"
Set the configuration "Show free shipping badge" to "show in the image gallery" or "show in the buy box"
Save your changes after editing
Tab "Listing pages" => Block "Product badges (in the product box)" => Section "Badge: Free shipping badge" => Show free shipping badge
Tab "Product pages" => Block "Product badges (in the image gallery or buy box)" => Section "Badge: Free shipping badge" => Show free shipping badge
general.deliveryShippingFree
Note: Shopware standard snippet (not a ThemeWare® snippet).
twt.extension.shippingFreeBadge.icon
Note: May be replaced by a theme configuration.
Note: The badge is displayed if the product is configured as "Free shipping" – provided the free shipping badge is enabled for the product box (listing pages) or the product page (gallery or buybox).
Scroll to the section "Datasheets"
Enable the configuration "Show datasheets"
Optional: Use the "Show preview" configuration to control whether the embedded PDF preview is shown in the description tab
Save your changes after editing
Go to the "Product pages" tab
Expand the "Tab "Datasheets"" block
Enable the configuration "Show datasheets"
Save your changes after editing
Switch via the main navigation to the "Product managment" (1) (2) ("Catalogues" => "Products")
Choose the product you want to edit (3)
Switch to the tab "Specifications"
Scroll to the section "Custom fields"
Select the custom field set "Datasheets" of your theme
Select a datasheet (PDF file) from your media manager in the custom field "Datasheet 1-3"
Enter the desired link text in the custom field "Datasheet 1-3 – Title"
Optional: Enter a description in the custom field "Datasheets (Text)"
Save your changes
In the separate datasheets tab, the embedded PDF preview is always displayed. In the description tab, it is only shown if the "Show preview" configuration is enabled. The datasheet download link remains available at all times in both cases.
Tab "Product pages" => Block "Tab "Description"" => Section "Datasheets" => Show datasheets
Tab "Product pages" => Block "Tab "Description"" => Section "Datasheets" => Show preview
Tab "Product pages" => Block "Tab "Datasheets"" => Show datasheets tab
twt.detail.datasheets.link
%name% is replaced by the file name.
twt.detail.datasheets.fallback
Note: Currently, only "PDF" files are supported.
Note: The datasheets are displayed within the product description if the feature is enabled in the theme configuration, the dedicated datasheet tab is disabled, and at least one datasheet has been assigned using a custom field (Datasheet 1–3).
Guide: You can find a step-by-step guide in the ThemeWare® Wiki: Providing datasheets as PDF
Note: The tab is displayed if the feature is enabled as a dedicated tab in the theme configuration and at least one datasheet has been assigned using a custom field (Datasheet 1–3).

Save your changes after editing
The "Custom tab" can be filled via a custom field in the corresponding product. As with all custom fields, make sure to fill them in for each variant.
The tab name is based on the snippet twt.detail.tabCustom.title.
This snippet is intended for a global labelling of the "Custom tab". This means that this tab is named the same on all product pages. This is sufficient if the tab is filled with the same content across all products (e.g. "Care instructions").
If you want to name the tab individually in your products, you can use the custom field "Custom tab – Title".
A headline is displayed within the tab. You edit the text using the snippet twt.detail.tabCustom.headline (%product% is replaced by the product name).
To fill the text of the tab, just use the custom field "Custom tab – Text". The tab is only shown if this custom field is actually filled for the corresponding product or variant.
Show headline
Specify whether the headline is displayed within the tab ("show" / "don't show").
Tab "Product pages" => Block "Tab "Custom content"" => Show custom tab
Tab "Product pages" => Block "Tab "Custom content"" => Section "Basic configuration" => Show headline
Title
twt.detail.tabCustom.title
Headline
twt.detail.tabCustom.headline
Guide: You can find a step-by-step guide in the ThemeWare® Wiki: Creating a custom tab on the product page
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:
Scroll to the section "Badge: Discount badge"
Enable the configuration "Show discount badge"
Save your changes after editing
Go to the "Product pages" tab
Expand the "Product badges (in the image gallery or buy box)" block
Scroll to the section "Badge: Discount badge"
Set the configuration "Show discount badge" to "show in the image gallery" or "show in the buy box"
Save your changes after editing
You control how the discount is displayed in the "Content" tab:
Tab "Content" => Block "Product badges" => Section "Badge: Discount badge"
Content: Defines how the discount is shown – e.g. "% (default)", "-25 %", "25 % saved", "-35 €" or "35 € saved".
Round number: Defines the rounding of the value – "0.12 (default)", "0.1" or "0".
Tab "Listing pages" => Block "Product badges (in the product box)" => Section "Badge: Discount badge" => Show discount badge
Tab "Product pages" => Block "Product badges (in the image gallery or buy box)" => Section "Badge: Discount badge" => Show discount badge
Tab "Content" => Block "Product badges" => Section "Badge: Discount badge" => Content
Tab "Content" => Block "Product badges" => Section "Badge: Discount badge" => Round number
twt.extension.discountBadge.discount
%discount% is replaced by the discount.
twt.extension.discountBadge.discountShort
%discount% is replaced by the discount.
%currency% is replaced by the current currency symbol.
twt.extension.discountBadge.percentage
%discount% is replaced by the percentage discount.
twt.extension.discountBadge.percentageShort
%discount% is replaced by the percentage discount.
%currency%
Note: The badge is displayed if the product has a "List price" that results in a discount (not for price ranges or "from" prices) – provided the discount badge is enabled. The ThemeWare® badge only appears if the ThemeWare® mode is selected in the "Discount badge (Product badges)" setting; otherwise Shopware's default badge is used.
Set the "Show product symbols" configuration to "show in a separate tab"
Save your changes after editing
The "Symbols tab" is filled via properties with an image and/or via custom fields in the respective product. As with all custom fields, make sure to fill them for variants accordingly.
The name of the tab is based on the snippet twt.detail.tabSymbols.title.
A headline is displayed within the tab. You can adjust the text via the snippet twt.detail.tabSymbols.headline (%product% is replaced by the product name).
Show headline
Specify whether the headline is displayed within the tab ("show" / "don't show").
Tab "Product pages" => Block "Product symbols" => Show product symbols
Tab "Product pages" => Block "Tab 'Symbols'" => Section "Basic configuration" => Show headline
Title
twt.detail.tabSymbols.title
Headline
twt.detail.tabSymbols.headline
%product% is replaced by the product name.
Note: The tab is displayed when the "Show product symbols" configuration is set to "show in a separate tab" and at least one symbol has been maintained for the product – via a property with an image or a custom field.

Note: You can find out how to edit snippets in the following tutorial:
Tip: If a change does not affect the storefront, simply clear the Shopware cache:
Save your changes after editing
The "Datasheets tab" can be filled via custom fields in the corresponding product. As with all custom fields, make sure to fill them in for each variant.
The tab name is based on the snippet twt.detail.tabDatasheets.title.
A headline is displayed within the tab. You edit the text using the snippet twt.detail.tabDatasheets.headline (%product% is replaced by the product name).
Show headline
Specify whether the headline is displayed within the tab ("show" / "don't show").
Tab "Product pages" => Block "Tab "Datasheets"" => Show datasheets tab
Tab "Product pages" => Block "Tab "Datasheets"" => Section "Basic configuration" => Show headline
Title
twt.detail.tabDatasheets.title
Headline
twt.detail.tabDatasheets.headline
Note: The tab is displayed if the feature is enabled as a dedicated tab in the theme configuration and at least one datasheet has been assigned using a custom field (Datasheet 1–3).
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:
The stock badge shows the stock of a product – in the product box on listing pages and on the product page (gallery or buybox).
Go to the "Listing pages" tab
Expand the "Product badges (in the product box)" block
Scroll to the section "Badge: Stock badge"
Enable the configuration "Show stock badge"
Save your changes after editing
Go to the "Product pages" tab
Expand the "Product badges (in the image gallery or buy box)" block
Scroll to the section "Badge: Stock badge"
You control the display mode and the thresholds in the "Content" tab:
Tab "Content" => Block "Product badges" => Section "Badge: Stock badge"
Mode
"Show stock above/below the threshold": The badge only appears for low stock (below "Threshold (low stock)") or high stock (above "Threshold (high stock)").
"Always show stock": The current stock is shown regardless of the thresholds.
Tab "Listing pages" => Block "Product badges (in the product box)" => Section "Badge: Stock badge" => Show stock badge
Tab "Product pages" => Block "Product badges (in the image gallery or buy box)" => Section "Badge: Stock badge" => Show stock badge
Tab "Content" => Block "Product badges" => Section "Badge: Stock badge" => Mode
twt.extension.stockBadge.highStock.label
%stock% is replaced by the "Threshold (high stock)".
Save your changes after editing
twt.extension.stockBadge.lowStock.label%stock% is replaced by the available stock.
twt.extension.stockBadge.stock.label
%stock% is replaced by the available stock.
twt.extension.stockBadge.highStock.icon
Note: May be replaced by a theme configuration.
twt.extension.stockBadge.lowStock.icon
Note: May be replaced by a theme configuration.
Note: The badge is displayed if the stock badge is enabled – permanently or only above/below the thresholds, depending on the selected mode (see Options).

The product rating shows the average rating of a product in the product box. You decide where it sits – in the text area or directly on the product image – and what it shows: stars only, stars with the number of reviews, or a compact number.
Looking for the rating on the product page? For the buy box it is described in the article .
Note: Products without a rating show nothing by default. With the "always show product rating" option, empty stars are displayed instead.
Note: Product reviews are a core function of Shopware. ThemeWare® extends how they are displayed in the product box with placement, content and appearance.
Whether reviews are possible and visible at all is controlled centrally in the Shopware settings ("Settings" > "Shop" > "Products" > "Show reviews"). To learn how to manage, approve and comment on reviews, see:
Go to the "Listing pages" tab
Expand the "Product box" block
Scroll to the section "Product rating"
Choose the desired option under "Show product rating"
Use "Placement" to define whether the rating sits in the box or on the product image
Choose what is displayed under "Content"
Save your changes after editing
Show product rating
"don't show": The rating does not appear in the product box.
"show (default)": The rating appears as soon as the product has been rated.
How the stars themselves are drawn is defined centrally via the "Star style" – solid or as an outline. The setting applies everywhere stars appear, so on the product page and in the testimonials as well. The same is true for the "Star" and "Star (blank)" colours.
Tab "Listing pages" => Block "Product box" => Section "Product rating" => Show product rating
Tab "Listing pages" => Block "Product box" => Section "Product rating" => Placement
Tab "Listing pages" => Block "Product box" => Section "Product rating" => Position (in the box)
In the "Content" section you define which details the product box shows in your category listings. These are:
the two free slots above and below the product name
the product description (optionally the ThemeWare® short description) including viewport control
the variant characteristics
product number and manufacturer
the price details price unit, cheapest price, list price and list price percentage
Go to the "Listing pages" tab
Expand the "Product box" block
Scroll to the section "Content"
Slot above the product name and Slot below the product name
"don't show"
"Product number": the product number.
You can adjust the labels and texts of the contents via snippets:
twt.listing.ordernumberLabel – label in front of the product number ("Show product number")
twt.listing.manufacturerLabel – label in front of the manufacturer name ("Show manufacturer")
twt.listing.ordernumberPrefix – prefix in front of the product number (slots)
Tab "Listing pages" => Block "Product box" => Section "Content" => Slot above the product name
Tab "Listing pages" => Block "Product box" => Section "Content" => Slot below the product name
Tab "Listing pages" => Block "Product box" => Section "Content" => Show product description
"Teaser text" (products)
"Short description" (products)
twt.listing.ordernumberLabel
twt.listing.manufacturerLabel
twt.listing.ordernumberPrefix
The individual contents are described in separate articles:
Save your changes after editing
"Manufacturer": the manufacturer name.
"Variant count": a hint like "+ 7 variations" on parent products with variants.
Show product description
"don't show"
"show (default)": Shows the abbreviated product description from Shopware.
Show product description from...
"always show (default)", "don't show", "Phone (landscape) (≥576px)", "Tablet (portrait) (≥768px)", "Tablet (landscape) (≥992px)", "Desktop (≥1200px)" or "Desktop (≥1400px)": Below the selected viewport the description is hidden.
Use short description
"don't use"
"use": Shows the ThemeWare® short description (custom field "Short description") instead of the product description, provided it is filled in on the product.
Show variant characteristics
"don't show"
"show (default)"
Show product number
"don't show"
"show": Shows the product number (or order number) in the product box.
"per layout type": The display is controlled separately in the blocks "Product box (Layout type 'Standard')", "Product box (Layout type 'Big image')" and "Product box (Layout type 'Minimal content')".
Show manufacturer
"don't show"
"show": Shows the manufacturer name in the product box.
"per layout type": The display is controlled separately in the blocks "Product box (Layout type 'Standard')", "Product box (Layout type 'Big image')" and "Product box (Layout type 'Minimal content')".
Show price unit
"don't show": Hides the price per unit (basic unit) if it is not relevant for your shop.
"show (default)"
Show cheapest price
"don't show"
"show (default)"
Show list price
"don't show"
"show (default)"
Show list price percentage
"don't show"
"show (default)"
twt.listing.variantCount – hint text for the variant count (slots)
Tab "Listing pages" => Block "Product box" => Section "Content" => Use short description
Tab "Listing pages" => Block "Product box" => Section "Content" => Show variant characteristics
Tab "Listing pages" => Block "Product box" => Section "Content" => Show product number
Tab "Listing pages" => Block "Product box" => Section "Content" => Show manufacturer
Tab "Listing pages" => Block "Product box" => Section "Content" => Show price unit
Tab "Listing pages" => Block "Product box" => Section "Content" => Show cheapest price
Tab "Listing pages" => Block "Product box" => Section "Content" => Show list price
Tab "Listing pages" => Block "Product box" => Section "Content" => Show list price percentage
Tab "Listing pages" => Block "Product box (Layout type 'Standard')" => Section "Content" => Show product number
Tab "Listing pages" => Block "Product box (Layout type 'Standard')" => Section "Content" => Show manufacturer
Tab "Listing pages" => Block "Product box (Layout type 'Big image')" => Section "Content" => Show product number
Tab "Listing pages" => Block "Product box (Layout type 'Big image')" => Section "Content" => Show manufacturer
Tab "Listing pages" => Block "Product box (Layout type 'Minimal content')" => Section "Content" => Show product number
Tab "Listing pages" => Block "Product box (Layout type 'Minimal content')" => Section "Content" => Show manufacturer
twt.listing.variantCount
Note: The product description or the short description is only available in the "Standard" layout type of the product box.
Note: The slots work independently of the "Show product number" and "Show manufacturer" options and can be freely combined with them.
Placement
"in the box (default)": In the text area – the exact spot is defined by "Position (in the box)".
"on the product image": Placed over the image – the exact spot is defined by "Position (on product image)".
Position (in the box)
"above the product name (default)"
"below the product name"
Position (on product image)
"top right", "bottom right", "bottom left" or "bottom center (default)"
Content
"Simple (default)": Stars only.
"Detailed": Stars + number of reviews in brackets (shown as soon as the review count is available).
"Number": Compact number instead of stars (e.g. "3.4 ★"). The decimal separator follows the storefront language.
Layout type (in the box)
"Standard": Plain stars.
"Decorated": Stars flanked by lines (follows the text alignment).
Layout type (on product image)
"Box": Background + shadow (better legibility on the image).
"Clean": No background/shadow – the stars sit directly on the image.
Corner type (on product image)
"not rounded"
"rounded corners": Uses the "Rounded corners" configuration ("Layout" > "Layout" > "Rounded corners").
"round corners (Pill)": Uses a predefined radius for round corners.
Hover effect (on product image)
"always visible (default)"
"reveal on hover": The rating stays hidden and slides in when the product box is hovered.
"hide on hover": The rating is visible and slides out when the product box is hovered – handy to free up the image for the buttons appearing there.
The direction it slides in or out follows the alignment.
Tab "Listing pages" => Block "Product box" => Section "Product rating" => Content
Tab "Listing pages" => Block "Product box" => Section "Product rating" => Layout type (in the box)
Tab "Listing pages" => Block "Product box" => Section "Product rating" => Layout type (on product image)
Tab "Listing pages" => Block "Product box" => Section "Product rating" => Corner type (on product image)
Tab "Listing pages" => Block "Product box" => Section "Product rating" => Hover effect (on product image)
Tab "Layout" => Block "Product rating" => Section "Basic configuration" => Star style
Tab "Layout" => Block "Product rating" => Section "Colour configuration" => Star
Tab "Layout" => Block "Product rating" => Section "Colour configuration" => Star (blank)
Note: "Layout type (on product image)", "Corner type (on product image)" and "Hover effect (on product image)" only take effect when the rating sits on the product image. "Corner type" additionally only applies to the "Box" layout type. The hover effect has no effect on touch devices – there the rating stays permanently visible.
Note: The positions "top right", "bottom right" and "bottom left" can overlap with the wishlist and Quickview button (see "Position" in the "Wishlist button" section).

You can store product downloads of the file type "PDF" in custom fields for the respective product. The downloads can be displayed on product pages in the "Properties" tab.
Go to the "Product pages" tab
Expand the "Tab "Description"" block
Scroll to the section "Downloads"
Enable the configuration "Show downloads"
Save your changes after editing
Switch via the main navigation to the "Product managment" (1) (2) ("Catalogues" => "Products")
Choose the product you want to edit (3)
Switch to the tab "Specifications"
Scroll to the section "Custom fields"
Select the custom field set "Downloads" of your theme
Select a file (PDF file) from your media manager in the custom field "Download 1-3"
Enter the desired link text in the custom field "Download 1-3 – Title"
Optional: Enter a description in the custom field "Download 1-3 – Description"
Save your changes
Tab "Product pages" => Block "Tab "Description"" => Section "Downloads" => Show downloads
twt.detail.downloads.link
%name% is replaced by the file name.
twt.detail.downloads.fallback
Note: Currently, only "PDF" files are supported.
Note: Unfortunately, Shopware 6's media manager does not currently support zip files. As soon as this is possible, you can also use these.
Guide: You can find a step-by-step guide in the ThemeWare® Wiki: Providing downloads on products
Note: The downloads are displayed in the "Description" tab if the "Show downloads" configuration is enabled and at least one download has been added via a custom field (Download 1–3).

The 'Not available' note marks products in the buybox that are not available (inactive).
Go to the "Product pages" tab
Expand the "Delivery information (in the buy box)" block
Scroll to the section "Not available"
Enable the configuration "Show 'Not available'"
Save your changes after editing
Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Not available" => Show 'Not available'
general.deliveryNotAvailable
The stock note shows the stock of a product in the buybox. Depending on the selected mode it appears permanently or only above/below the thresholds.
Note: The stock note is a ThemeWare® addition without a Shopware counterpart. It therefore also appears when the compatibility option "Delivery information (in the buy box)" is set to "default".
Go to the "Product pages" tab
Expand the "Delivery information (in the buy box)" block
Scroll to the section "Stock"
Enable the configuration "Show stock note"
Save your changes after editing
Mode
"Show stock above/below the threshold": The note only appears if the stock is below the "Threshold (low stock)" or above the "Threshold (high stock)".
"Always show stock": The current stock is shown regardless of the thresholds.
Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Stock" => Show stock note
Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Stock" => Mode
Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Stock" => Threshold (low stock) / Threshold (high stock)
twt.detail.stockLabel.highStock.label
%stock% is replaced by the "Threshold (high stock)".
Note: The note is displayed if the product is inactive (not active) – provided the "Show 'Not available'" configuration is enabled. Its appearance follows the "Layout type" in the "Basic configuration" section.
twt.detail.stockLabel.lowStock.label%stock% is replaced by the available stock.
twt.detail.stockLabel.stock.label
%stock% is replaced by the available stock.
Note: The note is displayed if "Show stock note" is enabled – permanently or only above/below the thresholds, depending on the selected mode (see Options). Its appearance follows the "Layout type" in the "Basic configuration" section.

The submenu of the top navigation shows the subcategories as soon as a menu item is addressed. ThemeWare® comes with five layout types for this – from the wide flyout through the card view to the compact dropdown – and several styles for the menu items within each layout type.
You set the layout type in the "Header" tab => "Top navigation flyout" area => "Top navigation flyout" configuration. It then applies to the entire main navigation.
Tip: You can override the layout type per category – for example a flyout with teasers for "Clothing" and a slim dropdown for "Sale". To do so, open the category in the Shopware admin and select the desired layout type under "Custom fields" => "Flyout (Genesis Pro)" => "Top navigation flyout". The default value "inherit from theme configuration" applies the global setting. With "no submenu" you hide the submenu for a single category.
The flyout uses the full width and shows the subcategories in columns – the layout type with the most room for deep category trees.
The subcategories of the first level sit in a rail on the left, the content next to it changes as soon as an entry is addressed. This keeps the submenu tidy even with many categories.
Next to the categories there is room for up to three teasers with image, text and link – for a campaign or a new collection, for instance. The more teasers you add, the more space the teaser area gets. You maintain the teasers on the category under "Custom fields" => "Flyout (Genesis Pro)".
Every subcategory of the first level is displayed as a card with its category image. Categories without an image do not appear as a card – so make sure every category has an image if you use this layout type.
The dropdown opens a narrow card directly below the menu item instead of using the full width – suitable for flat category trees or individual menu items.
How the individual menu items look is set separately for the flyout and the dropdown:
"Header" tab => "Top navigation flyout" area => "Basic configuration 'ThemeWare® Flyout'" section => "Style" configuration
The options are "List (Shopware 6)", "List", "List in columns (Shopware 5)" and "Buttons".
"Header" tab => "Top navigation flyout" area => "Basic configuration 'ThemeWare® Dropdown'" section => "Style" configuration
The flyout style also applies to the "Cards", "Sidebar" and "Teaser" layout types – with one exception: "List in columns (Shopware 5)" only applies to the flyout (see below).
You can use the button style when hovering over them or apply consistent colors to the buttons:
You colour the surfaces of the menu items in the "Header" tab => "Top navigation flyout" area => "Colour configuration" section via the "Background colour (menu items)", "Background colour (menu items) @hover" and "Background colour (menu items) @active" configurations. In the flyout they are applied in the "Buttons" style, in the dropdown navigation in the "Buttons (compact)" and "Buttons" styles.
Flyout and dropdown use the same colours and therefore look identical even if you use both layout types side by side.
Via the "Glass effect [px] (panel)" configuration – also in the "Colour configuration" section – you blur the page content behind the panel. The effect only becomes visible once you choose a semi-transparent colour as the "Background colour (panel)". Recommended value: 10.
Of course, the Glass effect works in all layout types:
The "Shopware 5" style changes the column layout in the flyout layout to match the arrangement in Shopware 5's "Advanced Menu". The categories are not wrapped into rows but flow across four columns – if a category no longer fits into its column, it moves into the next one. If a category image is shown next to the categories, there are three columns.
Because the columns are filled by height, this style is less suitable if the number of subcategories varies greatly.
With the sharing links, visitors can share a product via social networks and e-mail – displayed in the buybox on the product page.
Go to the "Product pages" tab
Expand the "Sharing links (in the buy box)" block
With the ThemeWare® "Product symbols" you display individual symbols and notice images such as care symbols (e.g. washing symbols), seals or certificates directly on the product page – below the product images, in the buy box, in the description, in the properties tab or in a separate tab.
Switch to the tab "Product pages"
The options are "List", "Buttons (compact)" and "Buttons".
The styles of the dropdown navigation are still in development. We welcome your constructive feedback.
The style only applies to the flyout. The "Cards", "Sidebar" and "Teaser" layout types bring their own arrangement and use the "List" style.






















Enable the configuration "Show sharing links"
Save your changes after editing
Customise the headline using the following snippet:
twt.detail.socialSharingLinks.headline
For each channel (icon) you define a label (label – used as the icon's aria label) and a title (title – shown as a tooltip):
twt.detail.socialSharingLinks.facebook.label
twt.detail.socialSharingLinks.facebook.title
twt.detail.socialSharingLinks.twitter.label
twt.detail.socialSharingLinks.twitter.title
twt.detail.socialSharingLinks.pinterest.label
twt.detail.socialSharingLinks.pinterest.title
twt.detail.socialSharingLinks.whatsapp.label
twt.detail.socialSharingLinks.whatsapp.title
X / Twitter
twt.detail.socialSharingLinks.x.label
twt.detail.socialSharingLinks.x.title
twt.detail.socialSharingLinks.email.label
twt.detail.socialSharingLinks.email.title
When sharing via e-mail, a pre-filled message is generated in addition. You can customise the salutation, message text and closing using the following snippets:
Salutation
twt.detail.socialSharingLinks.email.salutation
Message text
twt.detail.socialSharingLinks.email.body
Closing
twt.detail.socialSharingLinks.email.closing
You decide which channels are offered individually in the same block – each via its own configuration for Facebook, Twitter, X, Pinterest, WhatsApp and e-mail.
Tab "Product pages" => Block "Sharing links (in the buy box)" => Show sharing links
Headline
twt.detail.socialSharingLinks.headline
twt.detail.socialSharingLinks.email.body
twt.detail.socialSharingLinks.email.closing
twt.detail.socialSharingLinks.email.label
twt.detail.socialSharingLinks.email.salutation
twt.detail.socialSharingLinks.email.title
twt.detail.socialSharingLinks.facebook.label
twt.detail.socialSharingLinks.facebook.title
twt.detail.socialSharingLinks.pinterest.label
twt.detail.socialSharingLinks.pinterest.title
twt.detail.socialSharingLinks.twitter.label
twt.detail.socialSharingLinks.twitter.title
twt.detail.socialSharingLinks.whatsapp.label
twt.detail.socialSharingLinks.whatsapp.title
X
twt.detail.socialSharingLinks.x.label
twt.detail.socialSharingLinks.x.title

Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:
Select the desired position via the "Show product symbols" configuration
Optional: Use the further configuration options
Save your changes after editing
For symbols that are used on several products (e.g. care symbols or seals), it is best to use properties with an image:
Switch via the main navigation to the "Properties" management of your shop ("Catalogues" => "Properties")
Choose the desired property group
Set the custom field "Show as product symbol" to "yes"
Assign an image to each of the desired options of the group
Save your changes
Only options with an image are displayed as a symbol. The group will still appear in the properties table as usual.
For symbols that only concern a single product, use the custom fields in the respective product:
Switch via the main navigation to the "Products" management of your shop ("Catalogues" => "Products")
Choose the desired product
Switch to the tab "Specifications"
Scroll to the block "Custom fields"
Select the custom field set of your theme
Select the desired images via the custom fields "→ Symbol 1" to "→ Symbol 3" and optionally assign a title to each
Save your changes
Adjust the subheadline via the following snippet:
twt.detail.symbols.title
Adjust the description text via the following snippet and/or the "Product symbols (Text)" custom field – you select the source via the "Description text" configuration:
twt.detail.symbols.text
Style
Specify how the symbols are displayed: "Icons (side by side)", "Icon with text" or "Icon list". "Standard (recommended)" automatically selects the appropriate style for each position.
Size
Specify the height of the symbols in pixels. The width results from the respective image – the aspect ratio is preserved, regardless of whether you upload square, portrait or landscape images. In the "Icon list" style, the icons get a fixed square column of this size so that the titles align left.
Show subheadline
Specify whether a subheadline is displayed above the symbols (image gallery, buy box and description – in the separate tab the tab headline is used instead).
Description text
Specify where the description text above the symbols comes from: snippet, custom field or both – or hide it completely.
Tab "Product pages" => Block "Product symbols" => Show product symbols
Tab "Product pages" => Block "Product symbols" => Section "Basic configuration" => Style / Size / Show subheadline / Description text
twt.detail.symbols.title (subheadline)
twt.detail.symbols.text (description text)
Show as product symbol (property group)
If you want to display the product symbols in a separate tab, simply use the ThemeWare® Symbols tab:
Note: The product symbols are displayed when the "Show product symbols" configuration is activated and at least one symbol has been maintained for the product – via a property with an image or a custom field.
Guide: You can find a step-by-step guide in the ThemeWare® Wiki: Showing care symbols & product symbols


Note: The symbols from the custom fields are displayed before the symbols from the properties. The property symbols follow the native sorting of the properties (position of the group and sorting of its options).
Tip: Upload the symbols as SVG or PNG in your desired colour – they are not recoloured.
Note: You can find out how to edit snippets in the following tutorial:
Tip: If a change does not affect the storefront, simply clear the Shopware cache:
The "Subcategories in Listing" feature familiar from our themes for Shopware 5 is also available in ThemeWare® for Shopware 6.
You can activate this theme extension via the theme configuration. Like all theme configurations, this configuration is also global. This means that the subcategory navigation will then appear on all CMS pages of the type "Listing page".
Starting with ThemeWare® 3.2.4, you can activate/deactivate this global navigation via a custom field in selected categories.
In addition, the extension can also be displayed on shop pages in the future; the test phase for this will start soon.
The texts and images shown were taken from the category management ("Catalogues" => "Categories") of Shopware. The "Name" and the "Image" (= Display image) of the corresponding categories are displayed. The image is not mandatory.
Note: As the name suggests, the ThemeWare® extension "Listing subcategories" only works on CMS pages of the type "Listing page". In addition, subcategories in Shopware 6 are only displayed for the main category.
Guide: You can find a step-by-step guide in the ThemeWare® Wiki:
Go to the tab "Extensions"
Expand the block "Listing subcategories (on listing pages)"
Enable the configuration "Show 'Listing subcategories' (CMS listing pages)"
Switch via the main navigation to the "Category managment" (1) (2) ("Catalogues" => "Categories")
Choose the category you want to edit (3)
To the right of the category list, the corresponding category now opens in the category editor (4)
Here you have the following options for listing and shop pages:
don't show
show
show (via custom field)
This is the default setting. In this case, the "Listing subcategories" will not be displayed on the corresponding page type.
If you select the option show, the "Listing subcategories" will be displayed on all pages of the corresponding page type.
If you select show (via custom field), the "Listing subcategories" will only be displayed on the corresponding page type if you have configured the custom field to yes in the corresponding category.
Here you select the layout type (image only, text only or text below the image) and set the horizontal content alignment.
Here you define the display mode of the images (cropped/cover or fixed height/contain) as well as width, height and minimum/maximum height.
Here you adjust the colours: text, background and border colour (each also for the hover state) as well as the background colour of the image.
Here you set the font family, font size, font weight and text formatting.
Here you define the number of columns per breakpoint (phone, tablet, desktop) – i.e. how many subcategories are displayed per row.
Here you control the lazy loading of the images (eager or lazy) for loading performance.
There are currently 3 different display modes available (see screenshots below):
Text only
Image only
Text below the image
From ThemeWare® 3.2.4, you can enable/disable this global subcategory navigation in selected categories using a custom field.
Tab "Extensions" => Block "Listing subcategories (on listing pages)" => Show 'Listing subcategories' (CMS listing pages)
For more flexibility, the Pro Edition offers the CMS element of the same name – it lets you position the subcategories freely as a CMS block in your layouts:
With the Slots you show additional details above and below the product name in the product box. There are two independent slots ("Slot above the product name" and "Slot below the product name"), each of which you fill freely with a source.
The following sources are available:
Product number – the product number of the product
Teaser text – a short, free text per product (custom field "Teaser text")
Manufacturer – the manufacturer name
Variant count – a hint like "+ 7 variations" on parent products with variants
The slots work independently of the "Show product number" / "Show manufacturer" options and can be combined freely.
Go to the "Listing pages" tab
Expand the "Product box" block
Scroll to the section "Content"
For the "Teaser text" source you maintain the text per product via the "Teaser text" custom field.
You can adjust the texts of the "Product number" and "Variant count" sources via snippets:
twt.listing.ordernumberPrefix – prefix before the product number (default: "No.")
twt.listing.variantCount – hint text for the variant count (default: "+ %count% variations")
Two placeholders are available in the "twt.listing.variantCount" snippet:
%count% – the number of further variants (e.g. "+ 7 variations")
%countTotal% – the total number of variants (e.g. "available in 8 variations")
Tab "Listing pages" => Block "Product box" => Section "Content" => Slot above the product name
Tab "Listing pages" => Block "Product box" => Section "Content" => Slot below the product name
"Teaser text" (Products)
twt.listing.ordernumberPrefix
twt.listing.variantCount
You can find more information about the "Teaser text" custom field here:
You can find an overview of all product box contents here:
Optional: Use the further configuration options
Save your changes after editing
You are in the tab "General"
In the block "General" you can edit the category name (Name).
Scroll to the block "Menu settings"
Here you can edit the category image (Display image)
Save your changes
Tip: In the Pro Edition, a corresponding CMS extension is also available. This allows you to freely position a dedicated CMS block in your layouts and configure it individually:
Note: Of course, only subcategories are displayed if a category has visible subcategories and Shopware provides them in the corresponding category tree.
Tip: You can use the custom field to prevent the "Listing subcategories" from being displayed in a category, allowing you to customise selected categories individually.

Save your changes after editing
Note: A slot stays empty if the selected source is not available on the product – for example if the "Teaser text" custom field is not filled in or no manufacturer is maintained. The "Variant count" source only appears on parent products with variants.







You can display shop and/or product benefits on product pages. Product benefits can be entered via a snippet and/or a custom field in the corresponding product.
Note: You maintain the global "Shop benefits" using an individual snippet.
Note: The benefits are displayed if the "Show benefits" configuration is enabled and – depending on the "Content" setting – the selected content exists (the "twt.detail.benefits.content" snippet and/or the "Benefits" custom field on the product). The position setting controls whether they appear above the price or below the product specifications.
Go to the "Product pages" tab
Expand the "Benefits (in the buy box)" block
Enable the configuration "Show benefits"
Save your changes after editing
Customise the headline using the following snippet:
twt.detail.benefits.headline
You can customise the text using the following snippet:
You adjust the display in the same block:
Content: Defines where the content comes from – "Snippet", "Custom field", "Custom field or snippet" or "Snippet and custom field".
Position: Defines whether the benefits appear "above the price" or "below the product specifications".
Layout type: "plain" or "emphasised".
Tab "Product pages" => Block "Benefits (in the buy box)" => Show benefits
Tab "Product pages" => Block "Benefits (in the buy box)" => Content
Tab "Product pages" => Block "Benefits (in the buy box)" => Position
Headline
twt.detail.benefits.headline
Text
twt.detail.benefits.content
twt.detail.benefits.content
Note: You can find more information about the corresponding custom field in the article .
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:

The announcement banner is a status bar above the header. Status messages can be displayed here.
The banner is suitable for the promotion of campaigns, for example. Changes in shipping times due to vacation or absence can also be displayed.
Note: The announcement banner is shown above the header if the "Show announcement banner" configuration is enabled. If you have set a start and/or end date, it only appears within that period.
Go to the tab "Extensions"
Expand the block "Announcement banner (in the header)"
Enable the banner with the configuration "Show announcement banner"
Save your changes after editing
Edit the text of the announcement banner using the snippet twt.extension.announcementBanner.content
Optional: Edit the link URL using the snippet twt.extension.announcementBanner.link (only used if the "Link banner" configuration is enabled)
Closable
Adds a close button that lets visitors hide the banner (details below).
Start date / End date
With the configuration "Closable", a close button is added to the banner. This allows the visitor to hide the banner for one day.
This is logged via a "local storage" cookie. An seperate entry is added to the cookie consent from Shopware for this purpose. If this "comfort feature" is not agreed to, the close button is not displayed.
Note: Please note that Shopware adds this entry for each installed theme! This option is therefore not recommended if you are using more than one ThemeWare® theme.
Tab "Extensions" => Block "Announcement banner (in the header)" => Show announcement banner
Tab "Extensions" => Block "Announcement banner (in the header)" => Section "Basic configuration" => Closable / Start date / End date / Link banner / Open link in new tab / Link relation "nofollow"
Text
twt.extension.announcementBanner.content
Link
Limits the display of the banner to a period.
Link banner
Makes the entire banner clickable; you set the target URL via the snippet twt.extension.announcementBanner.link.
Open link in new tab
Opens the linked banner in a new browser tab.
Link relation "nofollow"
Adds the attribute rel="nofollow" to the banner link.
twt.extension.announcementBanner.link
Aria label
twt.extension.announcementBanner.ariaLabel
twt.extension.announcementBanner.closeButton.ariaLabel
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:

ThemeWare® provides the functionality of adding videos to products via custom fields and displaying them on product pages.
Note: The product videos are displayed if the "Show product videos" configuration is enabled and at least one video has been added to the product via a custom field (YouTube, Vimeo or Video 1–3). The position setting controls whether they appear above or below the properties.
Guide: You can find a step-by-step guide in the ThemeWare® Wiki:
Go to the tab "Product pages"
Expand the block "Tab "Description""
Scroll to the section "Product videos"
Enable the configuration "Show product videos"
Optional: Use the further configuration options
Save your changes after editing
Switch via the main navigation to the "Product managment" (1) (2) ("Catalogues" => "Products")
Choose the product you want to edit (3)
Switch to the tab "Specifications"
Edit the headline in the "Description" tab using the following snippet:
twt.detail.productVideos.title
Product videos position
Specify whether the product videos are displayed "above the properties" or "below the properties".
Tab "Product pages" => Block "Tab "Description"" => Section "Product videos" => Show product videos / Product videos position
twt.detail.productVideos.title (in Tab "Description")
twt.detail.productVideos.fallback (fallback name of a video)
twt.detail.productVideos.iframe.title
If you would like to display the product videos in a separate tab, simply use the ThemeWare® Videos tab:
Scroll to the section "Custom fields"
Select the custom field set of your theme
Enter the video ID in the custom field "YouTube video" and/or "Vimeo video"
Tip: Multiple video IDs can be entered comma-separated
Save your changes
twt.detail.productVideos.iframe.positionSuffix (position suffix in the iframe title)
Note: You can find more information about the corresponding custom field in the articles and .
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:


The product rating shows the average rating of a product in the buy box – the stars plus the number of reviews, linking to the review tab.
Looking for the rating in the product box? For listing pages it is described in the article .
Note: Product reviews are a core function of Shopware. ThemeWare® merely extends how they are displayed in the buy box – above all with the "always show product rating" option.
Whether reviews are possible and visible at all is controlled centrally in the Shopware settings ("Settings" > "Shop" > "Products" > "Show reviews"). To learn how to manage, approve and comment on reviews, see:
Go to the "Product pages" tab
Expand the "Product rating (in the buy box or at the product name)" block
Choose the desired option under "Show product rating"
Under "Placement" define where the rating appears
Under "Arrangement" define whether the stars and the link sit next to or below each other
Save your changes after editing
Edit the invitation shown for products without reviews using the snippet twt.detail.reviews.linkTextNoReviews
The stars and the number of reviews are added automatically
Show product rating
"don't show": The rating does not appear in the buy box.
"show (default)": The rating appears as soon as the product has been rated – this is how Shopware behaves out of the box.
Placement
"below the price (default)": The rating stays at its Shopware position in the buy box.
"above the product name": The rating moves above the heading.
How the stars themselves are drawn is defined centrally via the "Star style" – solid or as an outline. The setting applies everywhere stars appear, so in the product box and in the testimonials as well. The same is true for the "Star" and "Star (blank)" colours.
Tab "Layout" => Block "Product rating" => Section "Basic configuration" => Star style
Tab "Product pages" => Block "Product rating (in the buy box or at the product name)" => Show product rating
Tab "Product pages" => Block "Product rating (in the buy box or at the product name)" => Section "Basic configuration" => Placement
Tab "Product pages" => Block "Product rating (in the buy box or at the product name)" => Section "Basic configuration" => Arrangement
twt.detail.reviews.linkTextNoReviews
Arrangement
"below each other (default)": The stars sit above the link to the reviews – this is how Shopware behaves out of the box.
"next to each other": Stars and link sit in one line.
Tab "Layout" => Block "Product rating" => Section "Colour configuration" => Star
Tab "Layout" => Block "Product rating" => Section "Colour configuration" => Star (blank)
Note: For information on how to edit snippets, see the following instructions:
Tip: "always show product rating" has two benefits: the buy box keeps its height and does not jump as soon as the first rating comes in – and you actively invite your customers to write that first review.
Note: This configuration only refers to the display in the buy box. The "Reviews" tab on the product page is not affected – it remains available even with "don't show", including the review form.
Note: The placements at the product name also apply to the ThemeWare® image gallery blocks with product name.
In the "next to each other" arrangement the link automatically moves below the stars when there is not enough room – for example in a narrow buy box or on a smartphone.


With Manufacturer information on product pages you display the details of a product's manufacturer – description, logo and link – on the product page. The information can be shown in the description or in a separate tab.
The data comes from the respective manufacturer in Shopware (Catalogues ⇒ Manufacturers):
Name of the manufacturer
Description of the manufacturer
Logo of the manufacturer
Website (link) of the manufacturer
Go to the "Product pages" tab
Expand the "Manufacturer (in tabs)" block
Select the desired placement for the "Show manufacturer" configuration: "show in the description" or "show in a separate tab"
You maintain the displayed data directly on the manufacturer in Shopware:
Switch via the main navigation to the "Manufacturers" management ("Catalogues" => "Manufacturers")
Choose the manufacturer you want to edit (or create a new one via "Add manufacturer")
In the "Manufacturer information" card, maintain the desired details:
Show manufacturer
Controls the placement of the manufacturer details: "don't show", "show in the description" or "show in a separate tab".
Show manufacturer logo (section "Basic configuration")
The following texts apply regardless of whether the manufacturer is displayed in the description or in its own tab:
Subheadline "Related links": twt.detail.tabManufacturer.moreInformation
"Further products" link: twt.detail.tabManufacturer.linkProducts.label
"Manufacturer website" link: twt.detail.tabManufacturer.linkWebsite.label
In the "Further products" link label the placeholder
%manufacturer%is replaced by the manufacturer name.
If the manufacturer is displayed in the description, the manufacturer box there uses the headline twt.detail.manufacturer.title (%manufacturer% is replaced by the manufacturer name).
Tab "Product pages" => Block "Manufacturer (in tabs)" => Show manufacturer
Tab "Product pages" => Block "Manufacturer (in tabs)" => Section "Basic configuration" => Show manufacturer logo
Tab "Product pages" => Block "Manufacturer (in tabs)" => Section "Related manufacturer links" => Show subheadline / Show "Further products" link / Show "Manufacturer website" link
twt.detail.tabManufacturer.moreInformation
twt.detail.tabManufacturer.linkProducts.label
%manufacturer% is replaced by the manufacturer name.
You can find details on displaying it in its own tab here:
The product safety information under the GPSR can also be displayed in the manufacturer tab:
Save your changes after editing
Name
Description
Website
Logo (add media and set it via "Use as Logo")
Save your changes
Shows or hides the manufacturer logo.
Show subheadline (section "Related manufacturer links")
Shows or hides the subheadline above the manufacturer links.
Show "Further products" link (section "Related manufacturer links")
Shows or hides a link to further products of the manufacturer.
Show "Manufacturer website" link (section "Related manufacturer links")
Shows or hides a link to the manufacturer website.
twt.detail.tabManufacturer.linkWebsite.label
twt.detail.manufacturer.title
%manufacturer% is replaced by the manufacturer name.
Note: The manufacturer information is displayed when the feature is activated in the theme configuration and a manufacturer is assigned to the product.



ThemeWare® provides the functionality to display many additional product specifications (e.g. manufacturer, dimensions, weight, availability, etc.) in the buybox on product pages, in addition to the product number.
Three custom fields can be used to individually supplement the existing specifications.
Two styles are available for the display: "Standard" (list) and "Compact" (a space-saving grid with the label above the respective value).
Note: Each specification is enabled individually in the theme configuration and is only shown if the respective field has a value on the product (e.g. the manufacturer row only if a manufacturer is assigned). The three custom fields likewise only appear if they are filled.
Go to the "Product pages" tab
Expand the block "Product specifications (in the buy box)"
In the section "Basic configuration", select the desired display via the "Style" configuration ("Standard" or "Compact")
Activate the specifications to be displayed
Save your changes after editing
Switch via the main navigation to the "Product managment" (1) (2) ("Catalogues" => "Products")
Choose the product you want to edit (3)
In the tabs "General" and "Specifications" you will find all Shopware product specifications
Switch via the main navigation to the "Product managment" (1) (2) ("Catalogues" => "Products")
Choose the product you want to edit (3)
Switch to the tab "Specifications"
You can edit and/or translate the labels of the custom fields with the "Snippet management" using the following snippets:
Available stock: twt.detail.availableStockLabel
Custom field 1: twt.detail.customFields.customField1.label
Custom field 2: twt.detail.customFields.customField2.label
Tab "Product pages" => Block "Product specifications (in the buy box)"
twt.detail.availableStockLabel
twt.detail.customFields.customField1.label
twt.detail.customFields.customField2.label
You can find out how to edit snippets in the following instructions:
Save your changes
Scroll to the section "Custom fields"
Select the custom field set of your theme
Enter the desired text in the custom field "Custom field 1", "Custom field 2" and/or "Custom field 3"
Save your changes
Custom field 3: twt.detail.customFields.customField3.label
Delivery time: twt.detail.deliveryTimeLabel
EAN: twt.detail.eanLabel
Height: twt.detail.heightLabel
Length: twt.detail.lengthLabel
Max. order quantity: twt.detail.maxpurchaseLabel
Min. order quantity: twt.detail.minpurchaseLabel
Manufacturer: twt.detail.manufacturerLabel
Manufacturer product number: twt.detail.manufacturernumberLabel
Weight: twt.detail.weightLabel
Width: twt.detail.widthLabel
twt.detail.customFields.customField3.label
twt.detail.deliveryTimeLabel
twt.detail.eanLabel
twt.detail.heightLabel
twt.detail.lengthLabel
twt.detail.maxpurchaseLabel
twt.detail.minpurchaseLabel
twt.detail.manufacturerLabel
twt.detail.manufacturernumberLabel
twt.detail.weightLabel
twt.detail.widthLabel
Note: The "Spacing (Sections)" configuration only applies to the "Standard" style. In the "Compact" style, all specifications are displayed in one shared grid.
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:



With ThemeWare®, you can use the sales-promoting "Checkout steps" of our Shopware 5 themes in your Shopware 6 shop as well.
Note: The checkout steps are shown in the checkout if the "Show checkout steps" configuration is enabled. You can additionally display them in the shopping cart via "Show checkout steps in shopping cart".
Go to the tab "Extensions"
Expand the block "Checkout steps"
Enable the configuration "Show checkout steps" (display in the checkout)
Optional: Enable "Show checkout steps in shopping cart" to additionally display them in the shopping cart
Save your changes after editing
Edit the checkout step texts using the following snippets:
twt.extension.checkoutSteps.step1
twt.extension.checkoutSteps.step2
Layout type
"Continuous lines", "Lines between steps", "Continuous bars between steps" or "Bars between steps".
Icon style (Steps)
Tab "Extensions" => Block "Checkout steps" => Show checkout steps / Show checkout steps in shopping cart
Tab "Extensions" => Block "Checkout steps" => Section "Basic configuration" => Layout type / Icon style (Steps) / Show text from...
Text
twt.extension.checkoutSteps.step1
twt.extension.checkoutSteps.step2
twt.extension.checkoutSteps.step3
"Steps with numbers", "Steps with icons" or "Small steps".
Show text from...
Defines from which breakpoint the text below the steps appears (or "don't show").
twt.extension.checkoutSteps.step3
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:

The GPSR tab displays the product safety information under the GPSR – the manufacturer information and the responsible person – in a separate tab on the product page.
The basics, the custom fields and the other placements (in the description or in the manufacturer tab) are described in the general extension:
GPSR information on product pagesNote: The tab is displayed if the "Show product safety (GPSR)" configuration is set to "show in a separate tab" and the corresponding custom fields on the manufacturer or product are filled.
Go to the "Product pages" tab
Expand the "GPSR – Product safety (in tabs)" block
Select the option "show in a separate tab" for the "Show product safety (GPSR)" configuration
Save your changes after editing
The tab shows the GPSR information of the respective manufacturer or product. The content itself (manufacturer information, responsible person) and the custom fields are described in the general extension (see above). The following texts are specific to the tab:
The label of the tab is based on the snippet twt.detail.tabGpsr.title.
A separate headline is displayed within the tab. You edit the text using the snippet twt.detail.tabGpsr.headline (%manufacturer% is replaced by the manufacturer name, %product% by the product name).
This option is specific to the tab:
Show headline (block "Tab "GPSR"" => section "Basic configuration")
Shows or hides the headline within the GPSR tab ("show" / "don't show").
Which information is displayed and how you maintain the custom fields is described in the general extension (see above).
Tab "Product pages" => Block "GPSR – Product safety (in tabs)" => Show product safety (GPSR)
Tab "Product pages" => Block "Tab "GPSR"" => Section "Basic configuration" => Show headline
Title
twt.detail.tabGpsr.title
Headline
twt.detail.tabGpsr.headline
%manufacturer% is replaced by the manufacturer name.
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:

With ThemeWare® you can use the "Floating widget" of our Shopware 5 themes in your Shopware 6 shop as well, for example to display contact information prominently.
Note: The floating widget is shown if the "Show floating widget" configuration is enabled. The content is maintained via snippets.
Go to the tab "Extensions"
Expand the block "Floating widget"
Enable the floating widget with the configuration "Show floating widget"
Save your changes after editing
Edit the title and text of the floating widget using the following snippets:
twt.extension.floatingWidget.title
twt.extension.floatingWidget.body
Show floating widget @Phone (<768px)
Controls whether the widget appears on smartphones (<768px).
Position
In addition, the size, padding, alignment and the distance to the page edge as well as colors, font and a background image can be adjusted.
Tab "Extensions" => Block "Floating widget" => Show floating widget / Show floating widget @Phone (<768px)
Tab "Extensions" => Block "Floating widget" => Section "Basic configuration" => Position / Hover effect / Show overlay / Show opened / Animate / Link widget
Title
twt.extension.floatingWidget.title
Text
Optional: Edit the link URL using the snippet twt.extension.floatingWidget.link (only used if the "Link widget" configuration is enabled)
Hover effect
"no effect", "pull out" or "reduce opacity".
Show overlay (if opended)
Places a dimming overlay over the page while the widget is open.
Show opened (when the page has been loaded)
Opens the widget automatically when the page loads.
Animate (when the page has been loaded)
"no animation" or "Wobble (3x)".
Link widget
Makes the widget clickable: "no", "yes" or "yes (open in new tab)". You set the target URL via the snippet twt.extension.floatingWidget.link.
twt.extension.floatingWidget.body
Link
twt.extension.floatingWidget.link
Alt text (image)
twt.extension.floatingWidget.altText
Aria label (Widget)
twt.extension.floatingWidget.ariaLabel
Aria label (Button)
twt.extension.floatingWidget.closeAriaLabel
twt.extension.floatingWidget.openAriaLabel
Aria label (Link)
twt.extension.floatingWidget.linkAriaLabel
Note: For information on how to edit snippets, see the following instructions: Texts: Editing and translation
Tip: If a change does not affect the storefront, just clear the Shopware cache: Clearing / warming up the Shopware cache

The pre-order note points out pre-orderable products in the buybox that have a release date in the future.
Go to the "Product pages" tab
Expand the "Delivery information (in the buy box)" block
Scroll to the section "Pre-order"
Enable the configuration "Show 'Pre-order'"
Save your changes after editing
Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Pre-order" => Show 'Pre-order'
general.deliveryShipping
Note: The note is displayed if the product has a release date in the future – provided the "Show 'Pre-order'" configuration is enabled. Its appearance follows the "Layout type" in the "Basic configuration" section.
The free shipping note marks products with free shipping in the buybox.
Free shipping
The status "Free shipping" is fulfilled in Shopware if a product is configured as "Free shipping”. You can find more information in the Shopware documentation.
Go to the "Product pages" tab
Expand the "Delivery information (in the buy box)" block
Scroll to the section "Free shipping"
Enable the configuration "Show 'Free shipping'"
Save your changes after editing
Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Free shipping" => Show 'Free shipping'
twt.detail.shippingFreeLabel
Note: The note is displayed if the product is configured as "Free shipping" – provided the "Show 'Free shipping'" configuration is enabled. Its appearance follows the "Layout type" in the "Basic configuration" section.
With the extension "Manufacturer in listings" the manufacturer can be added to the product boxes in your category listings – optionally with a label in front of it.
Note: The manufacturer is only shown in the product box if the "Show manufacturer" configuration is enabled and a manufacturer is assigned to the product.
Go to the "Listing pages" tab
Expand the "Product box" block
Scroll to the "Content" section
Set the configuration "Show manufacturer" to "show"
Save your changes after editing
If you choose the "per layout type" option under "Show manufacturer", you decide separately for each layout type instead:
Go to the "Listing pages" tab
Expand the "Product box (Layout type 'Standard')", "Product box (Layout type 'Big image')" or "Product box (Layout type 'Minimal content')" block
Scroll to the "Content" section
Edit the label prefixing the manufacturer name using the snippet twt.listing.manufacturerLabel
The name of the manufacturer is automatically added
Show manufacturer
"don't show": The manufacturer does not appear in the product box.
"show": The manufacturer appears in all layout types.
Tab "Listing pages" => Block "Product box" => Section "Content" => Show manufacturer
Tab "Listing pages" => Block "Product box (Layout type 'Standard')" => Section "Content" => Show manufacturer
Tab "Listing pages" => Block "Product box (Layout type 'Big image')" => Section "Content" => Show manufacturer
twt.listing.manufacturerLabel
Set the configuration "Show manufacturer" to "show"
Save your changes after editing
Note: The configurations in the layout type blocks only take effect if the "per layout type" option is selected under "Show manufacturer" in the "Product box" block.
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:

ThemeWare® provides the functionality to display logos of the available payment methods in the Buybox on product pages.
We try to keep as many elements of ThemeWare® modular as possible, which is particularly evident in the approach of the widgets. You probably know these from the footer. The "Payment methods on product pages" are an example of this modularity, because technically speaking, this is the "Payment methods" widget.
Note: The payment logos are displayed if the "Show payment logos" configuration is enabled. The payment methods available in the shop are shown; the position setting controls whether they appear above or below the product specifications.
Go to the "Product pages" tab
Expand the block "Payment logos (in the buybox)"
Enable the configuration "Show payment logos"
Save your changes after editing
You can manage the payment methods in the Shopware settings: "Settings" => "Shop" => "Payment methods"
Edit the headline with the following snippet:
twt.detail.paymentLogos.headline
Tab "Product pages" => Block "Payment logos (in the buy box)"
twt.detail.paymentLogos.headline
You can find more information on how to create and manage payment methods with Shopware 6 in the Shopware documentation:
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:

By default, the product slider ends at the edge of its container. With this extension, the neighbouring products are partially visible on the left and right. This signals that there is more to see and encourages users to click through.
The setting applies globally to all product sliders. Individual CMS blocks can deviate from it using a CSS class.
Note: The extension applies to all product sliders, including the cross-selling on product pages.
Four layout types are available:
Go to the tab "Shopping Experiences"
Expand the block "Product slider (Category 'Commerce')"
Select the desired "Layout type" in the section "Design"
The configuration "Cropped products" controls how the cropped neighbouring products are displayed.
The width of the visible part of the neighbouring products can be set separately for desktop and mobile devices:
"Crop width @Desktop (>=992px)" – default: 30 (pixels)
"Crop width @Mobile (<992px)" – default: 20 (pixels)
Both configurations only apply to layout types with peek.
You can keep the global setting and let individual CMS blocks deviate from it. To do so, add a CSS class to the respective block in the CMS editor.
The overflow is suppressed automatically in two cases, because it would collide with neighbouring content there. The peek remains in both cases.
The slider is placed in a multi-column CMS block – the neighbouring products would otherwise extend into the other column
The slider is placed in a sidebar section
Tab "Shopping Experiences" => Block "Product slider (Category 'Commerce')" => Section "Design" => Layout type
Tab "Shopping Experiences" => Block "Product slider (Category 'Commerce')" => Section "Basic configuration" => Cropped products
Tab "Shopping Experiences" => Block "Product slider (Category 'Commerce')" => Section "Basic configuration" => Crop width @Desktop (>=992px)
twt-cms-product-slider-reset
twt-cms-product-slider-peek
twt-cms-product-slider-overflow-visible
Save your changes after editing
twt-cms-product-slider
Off (default)
Shopware standard, the products end at the container edge
Peek
The neighbouring products are partially visible inside the container
Overflow
The neighbouring products extend beyond the container
Peek and overflow
Both combined
Normal
The neighbouring products are displayed unchanged
Dimmed
The neighbouring products are shown with reduced opacity and are not clickable
twt-cms-product-slider-reset
Off
twt-cms-product-slider-peek
Peek
twt-cms-product-slider-overflow-visible
Overflow
Note: As soon as a product is fully visible, it becomes clickable again. Keyboard navigation automatically moves the focused product into view, making it operable.
Tip: The class twt-cms-product-slider-reset fully resets the global setting for this block. This lets you keep individual sliders at the Shopware standard even when a layout type is active globally.

twt-cms-product-slider
Peek and overflow
The properties tab shows the properties of a product in a separate tab on the product page.
Note: The tab is displayed if the "Show properties table in a seperate tab" configuration is set to "show in a seperate tab" and the product has at least one property.
Go to the "Product pages" tab
Expand the "Tab "Properties"" block
Set the configuration "Show properties table in a seperate tab" to "show in a seperate tab"
Save your changes after editing
The "Properties tab" integrates the properties table (Shopware standard) from the "Description" tab.
The tab name is based on the snippet twt.detail.tabProperties.title.
A headline is displayed within the tab. You edit the text using the snippet twt.detail.tabProperties.headline (%product% is replaced by the product name).
An info text can optionally be displayed below the properties table. You edit the text using the snippet twt.detail.infoProperties.
Show headline
Controls the headline within the tab: "show", "don't show", "show product name only" or "show snippet only".
Show info text below properties table
Tab "Product pages" => Block "Tab "Properties"" => Show properties table in a seperate tab
Tab "Product pages" => Block "Tab "Properties"" => Section "Basic configuration" => Show headline / Show info text below properties table
Title
twt.detail.tabProperties.title
Headline
Optionally displays an info text below the table ("show" / "don't show").
twt.detail.tabProperties.headline
Info text
twt.detail.infoProperties
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:

With further links you can add up to three further links (e.g. to manufacturer or information pages) in the description tab of a product. You maintain these via custom fields in the corresponding product.
Note: The further links are displayed in the "Description" tab if the "Show further links" configuration is enabled and at least one link has been added via a custom field (Link 1–3).
Go to the "Product pages" tab
Expand the "Tab "Description"" block
Scroll to the section "Further product links"
Enable the configuration "Show further links"
Optional: Use "Open links in a new tab" to define whether the links open in a new tab
Save your changes after editing
Switch via the main navigation to the "Product managment" ("Catalogues" => "Products")
Choose the product you want to edit
Switch to the tab "Specifications"
Edit the headline with the following snippet:
twt.detail.furtherLinks.title
Tab "Product pages" => Block "Tab "Description"" => Section "Further product links" => Show further links
Tab "Product pages" => Block "Tab "Description"" => Section "Further product links" => Open links in a new tab
twt.detail.furtherLinks.title
%product% is replaced by the product name.
twt.detail.furtherLinks.fallback
Enter the desired URL in the custom field "→ Further link 1-3"
Enter the desired link text in the custom field "Further link 1-3 – Title"
Save your changes
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:

You can configure the theme extension "Hero section" via the theme configuration. The "Hero section" can be displayed on CMS listing and/or shop pages.
You can also customise the display for each category using a corresponding custom field if you like.
If you want, you can also integrate the breadcrumb into the "Hero section".
The texts and images shown are taken from the category management ("Catalogues" => "Categories") of Shopware. The "Name" and the "Image" (= Display image) of the corresponding categories are displayed. As an alternative to the original category image, you can also use a custom image via a corresponding custom field.
But let's start with the theme configuration.
Guide: You can find a step-by-step guide in the ThemeWare® Wiki:
Go to the tab "Extensions"
Expand the block "Hero section (on listing pages)"
Enable the configuration "Show 'Hero section' (CMS listing pages)"
Optional: Adjust the further options (see the "Options" section) – e.g. integrating the breadcrumb
Save your changes after editing
Switch via the main navigation to the "Category managment" (1) (2) ("Catalogues" => "Categories")
Choose the category you want to edit (3)
To the right of the category list, the corresponding category now opens in the category editor (4)
Here you have the following options for listing and shop pages:
don't show
show
show (via custom field)
This is the default setting. In this case, the "Hero section" will not be displayed on the corresponding page type.
If you select the option show, the "Hero section" will be displayed on all pages of the corresponding page type.
If you select show (via custom field), the "Hero section" will only be displayed on the corresponding page type if you have configured the custom field to yes in the corresponding category.
In the same block you adjust the appearance of the "Hero section":
Pull up next element
Pulls the next element a bit over the Hero section: "no", "yes" or "yes (via custom field)". (Beta)
Text colour
Colours, fonts and further details are also adjusted in the theme configuration.
As you probably already know, the theme configuration is always global, i.e. it applies to all pages across your shop. This also applies to the configuration of the "Hero section" However, you can "overwrite" the theme configuration with a selection of custom fields in any categories and, for example, use a different colour for the "Hero section" in a particular category.
For more information on custom fields, see the following article:
Tab "Extensions" => Block "Hero section (on listing pages)" => Show 'Hero section' (CMS listing pages)
Tab "Extensions" => Block "Hero section (on listing pages)" => Show 'Hero section' (CMS shop pages)
In the block "General" you can edit the category name (Name).
Scroll to the block "Menu settings"
Here you can edit the category image (Display image)
Save your changes
"white", "light", "dark" or "black text".
Text alignment
"align left", "align center" or "align right".
Sizing mode
"Container-Max-Width (Full-width Boxed)" or "100% (Full-width)".
Content width
Maximum width of the content in pixels (e.g. 1200px) or 100%.
Padding top
Top spacing – only applies to pages with a "Shopping Experiences Header".
Overlay (background colour & opacity)
Colour overlay over the background image incl. opacity.
Attachment (background image)
"Background image scrolls with the page (scroll)" or "Background image stays fixed (fixed)".
Parallax effect (background image)
"no" or "yes" – only with a fixed background image; the effect is controlled via JavaScript.
Show breadcrumb
Adds a breadcrumb to the Hero section ("no" / "yes").
Breadcrumb – Position
"align top" or "align bottom".
Breadcrumb – Content alignment
"align left", "align center" or "align right".
Tip: You can use the custom field to prevent the "Hero section" from being displayed in a category, allowing you to customise selected categories individually.




With the extension "Highlight category" you can, as the name says, highlight a category in the top navigation.
To do this, you activate the highlighting via a custom field in the corresponding category.
Note: A category is only highlighted in the top navigation if the "Highlight category" custom field is set to "yes" for it. The theme configuration only controls the appearance of the highlighting.
Guide: You can find a step-by-step guide in the ThemeWare® Wiki:
Go to the "Header" tab
Expand the "Top navigation" block
Scroll to the section "Link (highlighted)"
Now configure the highlighting as you like
Save your changes after editing
Switch via the main navigation to the "Category managment" (1) (2) ("Catalogues" => "Categories")
Choose the category you want to edit (3)
To the right of the category list, the corresponding category now opens in the category editor (4)
Tab "Header" => Block "Top navigation" => Section "Link (highlighted)"
Scroll to the block "Custom fields"
Activate the highlighting with the custom field "Highlight category" and the option "yes"
Save your changes


The manufacturer tab shows the manufacturer details of a product in a separate tab on the product page.
Which details are displayed (description, logo, related links) and which you can show or hide is described in the general extension:
Manufacturer on product pagesNote: The tab is displayed if the "Show manufacturer" configuration is set to "show in a separate tab" and a manufacturer is assigned to the product.
Go to the "Product pages" tab
Expand the "Manufacturer (in tabs)" block
Select the option "show in a separate tab" for the "Show manufacturer" configuration
Save your changes after editing
The tab shows the manufacturer details of the respective product. The content itself (description, logo, related links) is described in the general extension (see above). The following texts are specific to the tab:
The tab name is based on the snippet twt.detail.tabManufacturer.title.
A separate headline is displayed within the tab. You edit the text using the snippet twt.detail.tabManufacturer.headline (%manufacturer% is replaced by the manufacturer name, %product% by the product name).
This option is specific to the tab:
Show headline (block "Tab "Manufacturer"" => section "Basic configuration")
Controls the headline within the tab: "show", "don't show", "show manufacturer name only" or "show snippet only".
The manufacturer logo and the related links apply in the description and in the tab alike – you can find their options in the general extension (see above).
Tab "Product pages" => Block "Manufacturer (in tabs)" => Show manufacturer
Tab "Product pages" => Block "Tab "Manufacturer"" => Section "Basic configuration" => Show headline
Title
twt.detail.tabManufacturer.title
Headline
twt.detail.tabManufacturer.headline
%manufacturer% is replaced by the manufacturer name.
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:

The shipping link shows a short note about your shipping costs below the buy button – for example "Free shipping from 50 €". A click opens the shipping and payment information page configured in your shop as an overlay, so your customer stays on the product page.
Note: Which page opens is defined in the Shopware settings ("Settings" > "Shop" > "Basic information" > "Shop pages" > "Shipping/payment information"). It is the same page that Shopware's tax note ("plus shipping costs") opens.
Go to the "Product pages" tab
Expand the "Buy box" block
Scroll to the section "Shipping link"
Choose the option "show" under "Show shipping link"
Save your changes after editing
Write the text via the snippet twt.detail.shippingLink
The preset is "Free shipping from 50 €"
If you deliver under different conditions, phrase the text neutrally – for example "Shipping costs & delivery times". The details are then on the linked page, which you maintain anyway. That way the link works for every shop, no matter which countries it delivers to.
The link does not appear in two cases:
The product is flagged as free of shipping costs. A threshold "from X €" would be misleading there – and the "Free shipping" label already shows the information at that spot.
No shipping and payment information page is configured in the shop. The text is then shown without a link instead of offering a click that leads nowhere.
Tab "Product pages" => Block "Buy box" => Section "Shipping link" => Show shipping link
twt.detail.shippingLink
"Settings" > "Shop" > "Basic information" > "Shop pages" > "Shipping/payment information"
Note: For information on how to edit snippets, see the following instructions:
Important: If you state a threshold in the snippet ("Free shipping from 50 €"), it has to apply to all delivery countries of your shop.
Shopware manages shipping costs per shipping method, currency and rule – a snippet cannot tell those apart, because snippets belong to the language, not to the delivery country. A shop delivering to Germany and Austria uses the same German text source for both.

According to Wikipedia, "Social Proof" is a psychological and social phenomenon in which people rely on other people's evaluations and actions to judge right and wrong behaviour in a given situation.
All positive statements about you, your company, your product or your shop are testimonials to your "Social Proof".
ThemeWare® offers a new way of improving your "Social Proof" with the "Social Proofing" extension since version 2.0.5.
The on the product page confirms that previous buyers were very satisfied.

With the extension "Product number in listings" the product number can be added to the product boxes in your category listings.
Note: The product number is shown in the product box if the "Show product number" configuration is enabled and the product has a product number.
Go to the "Listing pages" tab
Expand the "Product box" block
Scroll to the "Content" section
Enable the configuration "Show product number"
Save your changes after editing
Edit the label prefixing the product number using the following snippet:
twt.listing.ordernumberLabel
The product number is automatically added
Tab "Listing pages" => Block "Product box" => Section "Content" => Show product number
twt.listing.ordernumberLabel
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:

The "Sales infotext" on the product page signals that a product has already been purchased frequently and thereby confirms that previous buyers were very satisfied.
You can use the threshold configuration to define from which quantity of sales the infotext is displayed. From this threshold onwards, the actual number of sales is output rounded down; below the threshold, the infotext is not displayed.
Note: The infotext is displayed if the "Show sales infotext" configuration is enabled and the number of sales reaches the defined threshold.
Go to the "Product pages" tab
Expand the "Social proofing (in the buybox)" block
Set the configuration "Show sales infotext" to "show"
Save your changes after editing
Edit the infotext using the snippet twt.extension.socialProofing.infotext
The placeholder %sales% is replaced by the (rounded down) number of sales
Edit the icon using the snippet twt.extension.socialProofing.icon
Threshold
Specify from which quantity of sales the infotext is displayed (default: 1000).
Limit visibility
Tab "Product pages" => Block "Social proofing (in the buy box)" => Show sales infotext
Tab "Product pages" => Block "Social proofing (in the buy box)" => Section "Basic configuration" => Threshold / Limit visibility / Position / Show icon
twt.extension.socialProofing.infotext
twt.extension.socialProofing.icon
Select whether the infotext is displayed for "all products" or only for "Topseller".
Position
Select whether the infotext is displayed above or below the cart button.
Show icon
Optionally display an icon in front of the infotext.
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:
Note: The quantity of sales of a product is an absolute value in Shopware 6. A limitation to a certain period is not possible at the moment.

The USP bar shows key selling points (USPs) as a compact bar – optionally in the header and/or the footer.
Note: The USP bar is shown in the header and/or footer, depending on which of the two configurations ("Show USP bar in header" / "Show USP bar in footer") is enabled. The content of the individual USPs is maintained via snippets.
Go to the "Extensions" tab
Expand the "USP bar" block
Enable "Show USP bar in header" and/or "Show USP bar in footer"
Save your changes after editing
For each USP (1–6) you maintain the icon, title, subtitle and tooltip via a dedicated snippet – shown here for USP 1 as an example:
twt.extension.uspBar.usp1.icon
twt.extension.uspBar.usp1.title
Position (Header)
Places the bar "above the header", "above the navigation" or "below the header". (The full-width sticky header and the shopping experience header only support "above the header".)
Position (Footer)
Tab "Extensions" => Block "USP bar" => Show USP bar in header / Show USP bar in footer
Tab "Extensions" => Block "USP bar" => Section "Basic configuration" => Position (Header/Footer) / Layout type (Header/Footer) / Show subtitle (Large icons) / Content (Widget) / Sizing mode (Header/Footer)
Tab "Extensions" => Block "USP bar" => Section "USPs" => Show benefit #1–6 from ...
Icons
twt.extension.uspBar.usp1.icon
twt.extension.uspBar.usp2.icon
twt.extension.uspBar.usp1.subtitle
twt.extension.uspBar.usp1.tooltip
Places the bar "above the footer".
Layout type (Header)
"Small icons", "Small icons + Top bar" (moves the top bar into the USP bar) or "Small icons + Widget" (places a widget on the right, see "Content (Widget)").
Layout type (Footer)
"Small icons", "Large icons, text below" or "Large icons, text beside".
Show subtitle (Large icons)
Shows the subtitle below the title – only for layout types with large icons.
Content (Widget)
Selects the widget for the "Small icons + Widget" layout type: "don't show" or "Communities or social media" (configured in the "Widgets" tab).
Sizing mode (Header) / Sizing mode (Footer)
Width of the bar: "Container-Max-Width (Full-width Boxed)" or "100% (Full-width)".
Show benefit #1–6 from ... (section "USPs")
Controls, per USP, from which breakpoint it appears (e.g. "Phone (portrait) (<576px)", "Tablet (portrait) (≥768px)", "Desktop (≥1200px)") or "don't show".
twt.extension.uspBar.usp3.icon
twt.extension.uspBar.usp4.icon
twt.extension.uspBar.usp5.icon
twt.extension.uspBar.usp6.icon
Titles
twt.extension.uspBar.usp1.title
twt.extension.uspBar.usp2.title
twt.extension.uspBar.usp3.title
twt.extension.uspBar.usp4.title
twt.extension.uspBar.usp5.title
twt.extension.uspBar.usp6.title
Subtitles
twt.extension.uspBar.usp1.subtitle
twt.extension.uspBar.usp2.subtitle
twt.extension.uspBar.usp3.subtitle
twt.extension.uspBar.usp4.subtitle
twt.extension.uspBar.usp5.subtitle
twt.extension.uspBar.usp6.subtitle
Tooltips
twt.extension.uspBar.usp1.tooltip
twt.extension.uspBar.usp2.tooltip
twt.extension.uspBar.usp3.tooltip
twt.extension.uspBar.usp4.tooltip
twt.extension.uspBar.usp5.tooltip
twt.extension.uspBar.usp6.tooltip
Aria label
twt.extension.uspBar.ariaLabel.header
twt.extension.uspBar.ariaLabel.footer
Note: For information on how to edit snippets, see the following instructions: Texts: Editing and translation
Tip: If a change does not affect the storefront, just clear the Shopware cache: Clearing / warming up the Shopware cache

With the tabs on product pages you organise additional product information into separate tabs – e.g. properties, datasheets, product videos, manufacturer or a custom tab.
Note: Each tab is only displayed if it is enabled in the theme configuration and the product has the corresponding content (e.g. a filled custom field, a property or a manufacturer). Tabs without content are hidden automatically. See the respective subpages for details.
You can find the configuration in the tab "Product pages":
Tab "Product pages" => Block "Tabs"
Tab "Product pages" => Block "Tabs"

Extensions in ThemeWare® are integrated sales-promoting additional features that go beyond the visual adaptation of the existing Storefront of Shopware 6 and extend it instead. ThemeWare® extensions are therefore not separate plugins or apps from the Shopware Store, they are an integral part of your ThemeWare® theme.
ThemeWare® extensions are often "global", meaning they are independent of page types or specific layout sections into which the ThemeWare® configuration is usually structured. You can find such extensions in the "Extensions" tab. This would be, for example, the "Announcement Banner" or the "USP Bar".
However, there are also extensions that are linked to certain page types or layout areas. These would be, for example, the " Sharing links" for product pages in the tab "Product pages".
Announcement banner
Benefits on product pages
Checkout steps
Custom announcement
Floating widget
Further links
GPSR information on product pages
Hero section
Highlight category
Labels on product pages
Listing subcategories
Manufacturer in listings
Manufacturer on product pages
Payment methods on product pages
Product badges
Product datasheets
Product downloads
Product number in listings
Product short description
Product specifications
Product symbols
Product videos
Quickview
Sharing links
Shopping Experiences Header
Slideout communities
Social media links (icons)
Social proofing
Tabs on product pages
USP bar
The ThemeWare® "Slideout communities" are based on the ThemeWare® "Communities (Social Media)" widget and offer an alternative, prominent position beside the widget in the footer. As they are based on the widget, both use the same snippets.
Note: The slideout communities are shown if the "Show slideout communities" configuration is enabled. The displayed channels and texts come from the "Communities (Social Media)" widget.
Go to the "Extensions" tab
Expand the "Slideout communities" block
Enable the configuration "Show slideout communities"
Save your changes after editing
Via the "Layout type" you choose between "unicoloured" (link in icon colour) and "multicoloured" (individual background colour per channel).
Tab "Extensions" => Block "Slideout communities" => Show slideout communities
Tab "Extensions" => Block "Slideout communities" => Layout type
You can find more information about the snippets in our article about the ThemeWare® "Communities (Social Media)" widget:

The ThemeWare® delivery information styles the standard Shopware 6 notes in the buy box and adds the stock note. Using it is, of course, optional; you can also stick with the Shopware default.
Note: The availability notes ("Not available", "Pre-order", "Delivery time", "Sold out" and "Ready for shipping in …") are mutually exclusive – depending on the product status, only one of them is shown per product. The "Free shipping" and "Stock" notes are independent and can be displayed in addition.
All notes share one appearance. The "Layout type" configuration lets you choose between:
Text: A plain line with the status dot – the familiar Shopware look, but in the ThemeWare® group.
Label: The same line on a surface tinted in the status colour (green / yellow / red).
Badge: A rounded badge without the dot – inherits the corner style and font size of the product badges.
Chip: The dot sits in a tinted circle with the text next to it; hovering grows the circle behind the text into a pill.
"Arrangement" determines whether the notes sit next to or below each other, "Position" whether they appear above or below the price.
You can find the configuration in the tab "Product pages":
Tab "Product pages" => Block "Delivery information (in the buy box)"
Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Basic configuration" => Layout type
Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Basic configuration" => Arrangement
Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Basic configuration" => Position
Note: With the compatibility option "Delivery information (in the buy box)" set to "default", Shopware renders its text lines in their usual place – the layout type then only applies to the stock note.

The videos tab shows the product videos of a product in a separate tab on the product page.
Note: The tab is displayed if the "Show product videos tab" configuration is enabled and at least one video has been added to the product via a custom field (YouTube, Vimeo or Video 1–3).
Go to the "Product pages" tab
Expand the "Tab "Product videos"" block
Enable the configuration "Show product videos tab"
Save your changes after editing
The "Videos tab" can be filled via custom fields in the corresponding product. As with all custom fields, make sure to fill them in for each variant.
The tab name is based on the snippet twt.detail.tabVideos.title.
A headline is displayed within the tab. You edit the text using the snippet twt.detail.tabVideos.headline (%product% is replaced by the product name).
The alt text of the videos (for accessibility) is based on the snippet twt.detail.tabVideos.alt.
Show headline
Specify whether the headline is displayed within the tab ("show" / "don't show").
Tab "Product pages" => Block "Tab "Product videos"" => Show product videos tab
Tab "Product pages" => Block "Tab "Product videos"" => Section "Basic configuration" => Show headline
Title
twt.detail.tabVideos.title
Headline
twt.detail.tabVideos.headline
Alt text
twt.detail.tabVideos.alt
Note: For information on how to edit snippets, see the following instructions:
Tip: If a change does not affect the storefront, just clear the Shopware cache:

You can use the "Communities" widget in ThemeWare® to integrate social media links or icons in your footer.
You can find more information in the following article:
[Tags: social media icons]
The product short description is managed via a custom field in the corresponding product.
You can choose via the theme configuration whether the content should be displayed on category and/or product pages.
Note: A description in categories is only available in listing CMS elements with the "Standard" layout type! This also applies to the ThemeWare® short description.
Note: The short description is displayed if it is enabled in the theme configuration (separately for the product box on listing pages and the buybox on product pages) and the "Short description" custom field is filled on the product.
Go to the tab "Listing pages"
Expand the block "Product box"
Scroll to the section "Content"
Set the configuration "Use short description" to "use"
Save your changes after editing
Go to the tab "Product pages"
Expand the block "Buybox"
Scroll to the section "Basic configuration"
Switch via the main navigation to the "Product managment" (1) (2) ("Catalogues" => "Products")
Choose the product you want to edit (3)
Switch to the tab "Specifications"
Tab "Listing pages" => Block "Product box" => Section "Content" => Use short description
Tab "Product pages" => Block "Buy box" => Section "Basic configuration" => Show short description
Enable the configuration "Show short description"
Save your changes after editing
Scroll to the section "Custom fields" (4)
Select the custom field set of your theme (5)
Enter the desired text in the custom field "Short description" (6)
Save your changes (7)
Note: You can find more information about the corresponding custom field in the article .
Tip: If a change does not affect the storefront, just clear the Shopware cache:




With GPSR information on product pages you display the product safety information under the GPSR – the manufacturer information and the responsible person – on your product pages. The information can be shown in the description, in the manufacturer tab or in a separate tab.
Note: The GPSR information is displayed when the feature is activated in the theme configuration and the corresponding custom fields on the manufacturer or product are filled.
Guide: You can find a step-by-step guide in the ThemeWare® Wiki:
Go to the "Product pages" tab
Expand the "GPSR – Product safety (in tabs)" block
Select the desired placement for the "Show product safety (GPSR)" configuration: "show in the description", "show in the manufacturer tab" or "show in a separate tab"
In the "Basic configuration" section, use "Show manufacturer information (GPSR)" and "Show responsible person (GPSR)" to define which information is displayed
Save your changes after editing
You maintain the GPSR information via custom fields on the manufacturer:
Switch via the main navigation to the "Manufacturers" management ("Catalogues" => "Manufacturers")
Choose the manufacturer you want to edit
Scroll to the "Custom fields" block
Show product safety (GPSR)
Controls the placement of the GPSR information: "don't show", "show in the description", "show in the manufacturer tab" or "show in a separate tab".
Show manufacturer information (GPSR) (section "Basic configuration")
The subheadlines apply in the description just as in the tab:
Manufacturer information: twt.detail.gpsr.manufacturerInformation.title
Responsible person: twt.detail.gpsr.responsiblePerson.title
In both subheadlines the placeholder
%manufacturer%is replaced by the manufacturer name.
If the product safety is displayed in the manufacturer tab, the GPSR box there uses the headline twt.detail.gpsr.title.
Tab "Product pages" => Block "GPSR – Product safety (in tabs)" => Show product safety (GPSR)
Tab "Product pages" => Block "GPSR – Product safety (in tabs)" => Section "Basic configuration" => Show manufacturer information (GPSR) / Show responsible person (GPSR)
twt.detail.gpsr.manufacturerInformation.title
%manufacturer% is replaced by the manufacturer name.
twt.detail.gpsr.responsiblePerson.title
You can find details on displaying it in its own tab here:
The information can also appear in the manufacturer tab:
Fill in the "Manufacturer information" and/or "Responsible person" fields
Save your changes
Shows or hides the manufacturer information ("show" / "don't show").
Show responsible person (GPSR) (section "Basic configuration")
Shows or hides the responsible person information ("show" / "don't show").
%manufacturer% is replaced by the manufacturer name.
twt.detail.gpsr.title
Note: "Show in the manufacturer tab" only takes effect if the manufacturer is displayed as its own tab.
Note: You can alternatively maintain the GPSR information directly on the product (Specifications ⇒ Custom fields). Information maintained on the product overwrites that of the manufacturer.




The sold out note marks sold-out products in the buybox.
Sold out
The status "Sold out" is fulfilled in Shopware if a product is in on "Clearance sale" and the "Available stock" is less than the "Min. order quantity". You can find more information in the Shopware documentation.
Go to the "Product pages" tab
Expand the "Delivery information (in the buy box)" block
Scroll to the section "Sold out"
Enable the configuration "Show 'Sold out'"
Save your changes after editing
Tab "Product pages" => Block "Delivery information (in the buy box)" => Section "Sold out" => Show 'Sold out'
twt.detail.stockLabel.noStock
Note: The note is displayed if the product is on "Clearance sale" and the stock is below the "Min. order quantity" – provided the "Show 'Sold out'" configuration is enabled. Its appearance follows the "Layout type" in the "Basic configuration" section.
Note: Variant products are only marked as "Sold out" when they are "expanded" by properties in the listing.