# Seitenbündiges Menü > **Was Sie lernen werden** > > * Wie man eine Startseite mit dem seitlich ausgerichteten Menü-Layout erstellt > * Wie man Hintergrund, MenülLinks und Styling anpasst *** ### Über das seitlich ausgerichtete Menü Die **Seitlich ausgerichtetes Menü** Layout platziert Ihr Logo und die Navigation vertikal an der linken Seite des Bildschirms. Dieses Layout ist sauber und minimal und gibt Ihrem Hintergrund oder Markenbild visuelle Priorität. *** ### So richtest du es ein #### 1. Beginnen Sie mit einer sauberen Leinwand 1. Entfernen Sie im Theme-Editor alle vorhandenen Abschnitte. 2. Behalten Sie nur das `Seiten-Leinwand` Abschnitt. 2\. Fügen Sie das seitlich ausgerichtete Menü hinzu 1. Klicken Sie **Abschnitt hinzufügen > Seitlich ausgerichtetes Menü** 2. Ihre Navigation wird nun auf der linken Seite des Bildschirms angezeigt. 3. Wählen Sie ein **Shopify-Menü** aus, um Ihre Navigationslinks zu verbinden. {% hint style="info" %} 💡 Wenn Sie noch kein Menü haben, gehen Sie zu **Shopify-Admin > Onlineshop > Navigation** um eines zu erstellen. {% endhint %} *** ### Anpassen Ihres Menüs Sobald hinzugefügt, können Sie Folgendes konfigurieren: #### Menüinhalt und Verhalten * **Menü auswählen**: Verbinden Sie ein Menü aus Ihrer Shopify-Navigation * **Social-Media-Symbole**: Klicken Sie auf „Social-Media-Link hinzufügen“, um Symbole für X, TikTok, Threads und mehr hinzuzufügen * **Login-Link anzeigen**: Wählen Sie aus, es am `Oben`, `Unten`anzuzeigen oder es vollständig auszublenden #### Logo- und Link-Styling * **Logo-Ausrichtung**: Links oder Rechts * **Menüausrichtung**: Richten Sie Links innerhalb des Menüs links- oder rechtsbündig aus * **Link-Textfarbe / Hover-Farbe** * **Link-Hintergrundfarbe (bei Hover)** * **Link-Schriftgröße und vertikaler Abstand** #### Visuelle Effekte * **Hervorhebungseffekt deaktivieren**: Deaktiviert den Hover-Hervorhebungsstil * **Navigation skalieren aktivieren**: Aktiviert eine Animation zur Vergrößerung von Menüpunkten *** ### Hintergrundanpassung Der Abschnitt für das seitlich ausgerichtete Menü enthält integrierte Hintergrundoptionen, sodass Sie den `Dynamischer Hintergrund` Abschnitt nicht mehr verwenden müssen. In neueren Versionen des Themes `Dynamischer Hintergrund` ist für dieses Layout veraltet. #### Hintergrundstil-Optionen: * **Volltonfarbe**: Legen Sie eine Farbe für Desktop und Mobilgerät fest * **Bild**: Laden Sie unterschiedliche Bilder für Desktop und Mobilgerät hoch * **Diashow**: Fügen Sie bis zu 3 rotierende Bildfolien hinzu * **Video**: Laden Sie einen Videohintergrund hoch (Hinweis: Auf iPhones mit Energiesparmodus wird möglicherweise keine automatische Wiedergabe durchgeführt) #### Zusätzliche Hintergrundeinstellungen: * **Sektionshöhe**: Auf volle Höhe (100 %) oder benutzerdefiniert einstellen * **Überlagerungsfarben & Deckkraft**: * Separate Steuerung für obere und untere Überlagerungen * Unabhängige Einstellungen für Desktop und Mobilgerät > 💡 Tipp: Verwenden Sie Überlagerungen, um Kontrast zwischen Text und Hintergrundvisuals zu schaffen. *** ### Wann dieses Layout verwenden Verwenden Sie das seitlich ausgerichtete Menü, wenn: * Sie ein sauberes, modernes Layout mit vertikaler Navigation wünschen * Ihr Hintergrundbild oder Markenbild im Mittelpunkt der Erfahrung steht * Sie nicht vorhaben, viele scrollbare Abschnitte auf der Startseite zu verwenden *** ### **Brauchen Sie Hilfe?** * 💬 **Treten Sie unserer Community auf Discord bei:** * 📧 **Schreiben Sie uns eine E-Mail an:** * 💻 **Chatten Sie live mit uns:** Verfügbar Montag–Freitag, 10:00–18:00 EST, direkt auf unserer Website --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.openspaces.design/german/readme-1/pages-and-menus/homepage-+-menu/side-aligned-menu.md?ask= ``` 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.