# Sticky Menü Professionell

{% embed url="<https://www.youtube.com/watch?t=1s&v=JWWrTac1Quc>" %}

## Installation <a href="#installation" id="installation"></a>

Sie können das Plugin über den Shopware Community Store erwerben. Das Plugin wird wie ein ganz gewöhnliches Plugin installiert.&#x20;

{% embed url="<http://store.shopware.com/cbax133198783737/sticky-menue-professionell-shopware-5.html>" %}
Plugin über den Shopware Community Store erwerben
{% endembed %}

Nach der Installation des Plugins öffnet sich die Konfigurationsmaske des Plugins.

## Die Einstellungen des Plugins <a href="#plugin_einstellungen" id="plugin_einstellungen"></a>

Nach der erfolgreichen Installation des Plugins können Sie in der Konfigurationsmaske die Einstellungen vornehmen und weitere Parameter ergänzen.

<figure><img src="/files/rp1sg2owI0E4MIRJNdWg" alt="" width="350"><figcaption></figcaption></figure>

| Feldname                        | Bedeutung                                                                                                                                                          |
| ------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Aktiv                           | Das Plugin für den jeweiligen Shop aktivieren oder deaktivieren                                                                                                    |
| Sticky Menü anzeigen als        | Soll die Navigationsleiste oder die Suchleiste an den Browser angeheftet werden                                                                                    |
| Auch auf Tablet anzeigen        | Soll das Sticky Menü auch auf einem Tablet angezeigt werden                                                                                                        |
| Auch auf Smartphone anzeigen    | Soll das Sticky Menü auch auf einem Smartphone angezeigt werden                                                                                                    |
| Dauer Einblendung Sticky Search | Wie schnell soll die Suche eingeblendet werden. Dauer in ms                                                                                                        |
| Scroll-to-Top Aktiv             | Scroll-to-Top Funktion aktivieren                                                                                                                                  |
| Scroll-to-Top Button            | Welchen Style soll der Button haben. Zur Auswahl stehen: Normaler Button, Primärer Button, Sekundärer Button dadurch passt sich der Button nahtlos dem Template an |
| Dauer Scroll-to-Top             | Mit welcher Geschwindigkeit soll nach oben gescrollt werden. Dauer in ms                                                                                           |

## Die Primär- und Sekundärfarbe <a href="#theme_einstellungen" id="theme_einstellungen"></a>

Die Primär- bzw. Sekundärfarbe, für den Scroll-to-Top Button, wird aus dem Theme Manager verwendet. Gehen Sie hierzu auf "Einstellung > Theme Manager". Wählen das verwendete Template aus und gehen auf den Button "Theme konfigurieren". Wählen Sie dort den Reiter "Farb-Konfigurationen". In den Feldern "@brand-primary" & "@brand-secondary" finden Sie die jeweiligen Farben.

{% hint style="warning" %}
**Hinweis:** Bedenken Sie, dass eine Veränderung in diesen Einstellungen, globale Auswirkungen auf Ihren Shop haben.
{% endhint %}

## Darstellung im Frontend <a href="#darstellung_frontend" id="darstellung_frontend"></a>

### Navigationsleiste als Sticky <a href="#darstellung_frontend_navigationsleiste" id="darstellung_frontend_navigationsleiste"></a>

Die Anzeige der Navigationsleiste als Sticky Menü. Mit dieser Einstellung wird die Hauptnavigation eingeblendet. Das Einblenden des Layers mit der Unternavigation sowie Bildern und Texten funktioniert hier ebenfalls.

<div><figure><img src="/files/2HaABIFDDj0TfUvsUevj" alt=""><figcaption></figcaption></figure> <figure><img src="/files/tQaxYykw0Mp9tlWpKVtY" alt="" width="563"><figcaption></figcaption></figure></div>

### Suchleiste als Sticky <a href="#darstellung_frontend_suchleiste" id="darstellung_frontend_suchleiste"></a>

Die Anzeige der Suchleiste als Sticky Menü. Mit dieser Einstellung fahren folgende Punkte immer mit: Suchleiste, Merkzettel, Kundenkonto und der Warenkorb.

<figure><img src="/files/zRaWoJbCzQiW3q22Rdaz" alt="" width="350"><figcaption></figcaption></figure>

### Suchleiste und Navigationsleiste als Sticky <a href="#darstellung_frontend_suchleiste_navigationsleiste" id="darstellung_frontend_suchleiste_navigationsleiste"></a>

Diese Einstellung vereint beide Varianten der Anzeigemöglichkeiten. Die Anzeige der Suchleiste mit einblendbarer Navigationsleiste als Sticky Menü.

<div><figure><img src="/files/fl5Vqw4kJmtPgyjtjpNB" alt=""><figcaption></figcaption></figure> <figure><img src="/files/Z97jfcUJAgFguuitPFRt" alt=""><figcaption></figcaption></figure> <figure><img src="/files/sl4N0dJdvTiAfBfWMIOz" alt="" width="563"><figcaption></figcaption></figure></div>

### Scroll-to-Top Button <a href="#darstellung_frontend_scrolltotop" id="darstellung_frontend_scrolltotop"></a>

Die Anzeige des Scroll-to-Top Button - Darstellung von links nach rechts: Normaler Button, Primärer Button, Sekundären Button

<div><figure><img src="/files/o7Qwn06r3Rv8kGNrvlPW" alt=""><figcaption></figcaption></figure> <figure><img src="/files/xfkSKbCXYheZRqdgKn8Q" alt=""><figcaption></figcaption></figure> <figure><img src="/files/0dCsbslVkkwvkHmVP4hP" alt=""><figcaption></figcaption></figure></div>

## Responsive - Tablet <a href="#responsive_frontend" id="responsive_frontend"></a>

Die Anzeige des Sticky Menü Professionell. Dargestellt auf dem Tablet. Im Bereich Smartphone wird der Shopware-Standard genutzt.

<div><figure><img src="/files/dHE44YYQxKLjwYMQ1tyZ" alt=""><figcaption></figcaption></figure> <figure><img src="/files/oc49hYT2rhBYR1wbKbtW" alt=""><figcaption></figcaption></figure> <figure><img src="/files/7BAJzEtL094mXM1r4kIG" alt=""><figcaption></figcaption></figure></div>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://coolbax.gitbook.io/coolbax-docs/shopware-5-plugins/storefront/sticky-menu-professionell.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.