Ctrlk
SearchService PortalManualOthersDeutschRequest support
For the complete documentation index, see llms.txt. This page is also available as Markdown.
Export as PDF

Configuring the USP bar

The USP bar is a bar with your most important selling points, for example "Free shipping" or "30 day money back guarantee". It can be displayed in the header and in the footer.

Step 1: Activate the USP bar

  1. Open the administration of your shop

  2. Switch via the main navigation to the "theme administration" ("Content" => "Themes")

    • Note: In the Shopware Cloud you will find the "Themes" area directly in the main navigation.

  3. Now click on your ThemeWare® theme to start editing

  4. Switch to the tab "Extensions"

  5. Open the block "USP bar"

  6. Activate "Show USP bar in header" and/or "Show USP bar in footer"

Step 2: Configure the display

The section "Basic configuration" offers among others:

  • "Position (Header)" and "Position (Footer)": where the bar is output

  • "Layout type (Header)" and "Layout type (Footer)": for example with small or large icons

  • "Show subtitle (Large icons)"

  • "Height (Small icons)" and "Height (Large icons)"

  • "Benefit alignment (Small icons)" and "Benefit alignment (Large icons)"

  • "Content (Widget)": an additional widget in the USP bar

You configure the colours in the section "Colour configuration", fonts and icon sizes in the section "Typography".

Step 3: Control the benefits per viewport

In the section "USPs" you define for every benefit from which viewport it is displayed ("Show benefit #1 from..." and following). This way you only show the most important points on small screens.

Step 4: Edit texts and icons

You maintain the content of the USP bar with snippets:

Snippet
Content

twt.extension.uspBar.usp1.title

The text of the first benefit

twt.extension.uspBar.usp1.icon

The icon of the first benefit

twt.extension.uspBar.usp1.subtitle

The subtitle (with large icons)

twt.extension.uspBar.usp1.tooltip

An optional tooltip

For the other benefits use usp2, usp3 and so on accordingly.

Note: If you do not want to output a benefit at all, set the field "Show benefit #X from..." in the section "USPs" to "don't show". An empty snippet does not hide the benefit.

Shopware 6 icons

You will find an overview of all Shopware 6 icons via the following link. In the theme configuration and in snippets of ThemeWare® you can use the icons from the icon set "default".

LogoShopware 6 Icons: Overview, Examples, and Step-by-Step GuidesThemeWare®
Shopware 6 icons

Further information

PreviousEditing texts in the theme
NextUnderstanding Shopping Experiences

Last updated

Was this helpful?