Top bar or service navigation missing after an update

After an update, the top bar in the header may be missing, or the service navigation may have disappeared from it. What exactly you see depends on your shop:

• If your shop runs several languages or currencies, the language and currency switchers remain visible. The service navigation and the hotline are missing.
• If your shop runs only one language and one currency, nothing remains at all. The bar collapses and appears to have vanished.
• If you have moved the contents of the top bar into the USP bar, the switchers appear twice in the header, once in the USP bar and once at the regular position.

---

What has changed

In version 7.13, Shopware Commercial ships its own version of the file storefront/layout/header/top-bar.html.twig. In it, the template block layout_header_top_bar_inner is replaced entirely, without bringing back the original content via {{ parent() }}:

SwagCommercial: top-bar.html.twig

{% block layout_header_top_bar_inner %}
    ...
    {% if header.languages.count > 1 or header.currencies.count > 1 or b2bHasSwitcher %}
        <nav class="top-bar-nav d-flex justify-content-end align-items-center gap-3" ...>
            ...
        </nav>
    {% endif %}
{% endblock %}

Everything a theme adds at this position is dropped without replacement. In the case of ThemeWare®, that means the service navigation, the hotline and the styling of the bar. In version 7.11 this file did not yet exist, which is why the effect only appears after the update.

By the way, this does not only affect ThemeWare®, but every theme that extends the top bar at this position.

How to check whether you are affected

Open the page source of your storefront (Ctrl + U) and search for top-bar-nav. The two versions differ in their class list:

Source	Markup
ThemeWare®	<nav class="top-bar-nav d-flex justify-content-end gap-3">, containing a <div class="... twt-top-bar">
Shopware Commercial	<nav class="top-bar-nav d-flex justify-content-end align-items-center gap-3">, containing only the switchers

If you find align-items-center and no twt-top-bar, you are looking at the case described above.

---

What we are doing

We are working on an adjustment that keeps the ThemeWare® contents of the top bar in place even when an extension replaces the content area. The contents of the extension remain visible as well. As soon as it ships, you will read about it here, together with the configuration path you use to switch it on.

---

Workaround in the meantime

Until then, you can restore the top bar with your own template file in the "ThemeWare® Customizing Plugin".

1. Raise the priority of the extension

For your template file to take effect after the file from Shopware Commercial, the extension needs a higher priority. Add the following method to TcinnCustomizing.php:

TcinnCustomizing.php

public function getTemplatePriority(): int
{
    return 100; // high priority
}

2. Create the template file

Create the following file in the Customizing Plugin:

src/Resources/views/storefront/layout/header/top-bar.html.twig

top-bar.html.twig

{% sw_extends '@Storefront/storefront/layout/header/top-bar.html.twig' %}

{% block layout_header_top_bar_inner %}
    <nav class="top-bar-nav d-flex justify-content-end gap-3"
         aria-label="{{ 'header.topBarAriaLabel'|trans|striptags }}"
    >
        <div class="row align-items-center twt-top-bar">
            {% if theme_config('twt-header-top-bar-hotline-show') == 2 %}
                <div class="col-auto">
                    <div class="twt-top-bar-hotline">
                        <div class="top-bar-hotline">
                            <span class="twt-top-bar-hotline-label">{{ 'twt.header.serviceHotline'|trans|sw_sanitize }}</span>
                            {{ 'twt.header.serviceHotlineText'|trans|sw_sanitize }}
                        </div>
                    </div>
                </div>
            {% endif %}

            <div class="col-auto{% if theme_config('twt-header-top-bar-hotline-show') == 2 %} ps-0{% endif %}">
                <div class="twt-top-bar-dropdowns d-flex justify-content-end gap-3">
                    {% if theme_config('twt-header-top-bar-languages-menu-show') == 2 and header.languages.count > 1 %}
                        {% sw_include '@Storefront/storefront/layout/header/actions/language-widget.html.twig' %}
                    {% endif %}

                    {% if theme_config('twt-header-top-bar-currencies-menu-show') == 2 and header.currencies.count > 1 %}
                        {% sw_include '@Storefront/storefront/layout/header/actions/currency-widget.html.twig' %}
                    {% endif %}

                    {% sw_include '@Storefront/storefront/themeware/twt-service-menu.html.twig' ignore missing %}
                </div>
            </div>
        </div>
    </nav>
{% endblock %}

3. Update the extension and clear the cache

1. Zip the folder TcinnCustomizing and upload it to your shop
2. Clear the Shopware cache ("Settings" => "System" => "Caches & indexes" => "Clear caches")
3. Clear your browser cache (Ctrl + F5)

---