Das Wichtigste auf einen Blick
- Abschnitte werden durch Ziehen in der linken Seitenleiste des Theme-Editors neu angeordnet.
- Dies funktioniert auf jedem Seitentyp – Startseite, Produktseiten, Kategorieseiten und benutzerdefinierte Seiten.
- Header und Footer sind fixierte Abschnitte – sie können nicht verschoben werden.
- Änderungen werden erst nach dem Klicken auf Speichern live geschaltet.
- Fudge kann Seitenlayouts anhand einer einfachen englischen Beschreibung umstrukturieren, wenn Änderungen über Drag-and-Drop hinausgehen.
Das Neuanordnen von Abschnitten ist eine der dankbarsten Aufgaben im Shopify Theme-Editor. Es ist einfaches Drag-and-Drop – kein Code erforderlich. Hier erfährst du genau, wie es geht.
Warum du uns vertrauen kannst
Wir haben hunderte von Shopify-Storefronts erstellt und angepasst. Außerdem haben wir Fudge entwickelt – einen KI-Storefront-Editor mit einer 5,0-Bewertung im Shopify App Store.
So ordnest du Abschnitte im Theme-Editor neu an
Schritt 1. Gehe zu Onlineshop > Themes > Anpassen.
Schritt 2. Navigiere zu der Seite, die du bearbeiten möchtest. Nutze die Seitenauswahl oben im Editor, um zwischen den Seiten zu wechseln (Startseite, Produktseiten, Kategorieseiten etc.).
Schritt 3. Schau in die linke Seitenleiste. Dort siehst du eine Liste aller Abschnitte auf der aktuellen Seite in ihrer jetzigen Reihenfolge.
Schritt 4. Bewege den Mauszeiger über den Abschnitt, den du verschieben möchtest. Ein Drag-Handle (sechs Punkte als Raster) erscheint links neben dem Namen des Abschnitts.
Schritt 5. Klicke auf den Drag-Handle, halte ihn gedrückt und ziehe den Abschnitt nach oben oder unten an die neue Position.
Schritt 6. Lass los, um ihn zu platzieren. Die Vorschau auf der rechten Seite aktualisiert sich sofort.
Schritt 7. Klicke auf Speichern, um die neue Reihenfolge zu veröffentlichen.
Abschnitte, die du nicht verschieben kannst
Nicht jeder Abschnitt lässt sich ziehen. Zwei Abschnitte sind immer fixiert:
Header – Immer ganz oben. Es ist ein globaler Abschnitt – ihn zu verschieben ist weder möglich noch sinnvoll.
Footer – Immer ganz unten. Aus demselben Grund.
Einige Themes sperren auch spezifische Abschnitte (wie einen Cookie-Banner oder eine Ankündigungsleiste) an einer festen Position. Wenn du keinen Drag-Handle an einem Abschnitt siehst, ist er gesperrt.
Neuanordnen von Abschnitten auf verschiedenen Seitentypen
Der Prozess ist für alle Seitentypen derselbe, aber du musst zuerst zur richtigen Seite navigieren.
Homepage - Standardmäßig ausgewählt, wenn du den Theme Editor öffnest.
Produktseiten - Klicke oben im Editor auf das Dropdown-Menü für den Seitentyp und wähle „Produkte“. Klicke dann auf ein beliebiges Produkt für die Vorschau. Die von dir festgelegte Abschnittsreihenfolge gilt für alle Produktseiten (bzw. pro Produktseiten-Template, falls dein Theme mehrere Templates unterstützt).
Kategorieseiten (Collections) - Gleicher Prozess – verwende das Dropdown-Menü für den Seitentyp und wähle „Kategorien“.
Eigene Seiten - Wähle „Seiten“ aus dem Dropdown-Menü. Wenn du mehrere Seiten-Templates hast, wähle das richtige aus.
Ähnliche Artikel: Fudge Store Editor.
Ähnliche Artikel: Mobile Layout in Shopify umordnen.
Ähnliche Artikel: Einen Abschnitt in Shopify löschen.
Ähnliche Artikel: Homepage-Abschnitte in Shopify hinzufügen.
Ähnliche Artikel: Blöcke innerhalb eines Shopify-Abschnitts verschieben.
Was tun, wenn Drag-and-Drop nicht ausreicht
Manchmal ist die gewünschte Layoutänderung nicht nur eine Neuanordnung – du möchtest Inhalte aus einem Abschnitt in einen anderen verschieben oder einen Abschnittstyp erstellen, der in deinem Theme nicht existiert.
Das liegt außerhalb dessen, was die Drag-and-Drop-Griffe des Theme-Editors leisten können. Diese Änderungen erfordern Code.
Fudge ist hier hilfreich. Du kannst das gewünschte Layout in einfachem Englisch beschreiben, und Fudge generiert die Code-Änderungen als Entwurf:
„Verschiebe den Abschnitt mit den Produktmerkmalen über den Abschnitt mit der Produktbeschreibung.“
„Strukturiere die Startseite so um, dass der Abschnitt mit den Testimonials vor dem Abschnitt mit den hervorgehobenen Produkten kommt.“
Fudge kümmert sich um den Code – du prüfst alles, bevor es live geht.
Verwandt: Fudge Store Editor.
Verwandt: Reorder Mobile Layout in Shopify.
Verwandt: Add Homepage Sections in Shopify.
Einen Abschnitt ausblenden statt löschen
Wenn du einen Abschnitt aus der Ansicht entfernen möchtest, ohne ihn dauerhaft zu löschen, kannst du ihn ausblenden, anstatt ihn neu anzuordnen oder zu löschen.
Klicke auf den Abschnitt in der Seitenleiste, um dessen Einstellungen zu öffnen. Suche nach einem Augen-Symbol oder einem Sichtbar/Verborgen-Schalter oben im Einstellungsbereich des Abschnitts. Schalte ihn aus, um den Abschnitt auszublenden.
Der Abschnitt bleibt in deiner Seitenleiste (ausgegraut) und kann jederzeit wieder aktiviert werden. Das ist sicherer als das Löschen für Abschnitte, die du vielleicht später wiederverwenden möchtest. Wenn du einen Abschnitt endgültig entfernen möchtest, lies unseren Guide: Abschnitt in Shopify löschen.
Quick Tips
- Vorschau vor dem Speichern - die Live-Vorschau zeigt die neue Reihenfolge in Echtzeit an, bevor du sie übernimmst.
- Mobile Vorschau - klicke auf das Handy-Symbol unten im Editor, um zu sehen, wie die neu angeordneten Abschnitte auf kleinen Bildschirmen aussehen.
- Rückgängig machen - wenn du einen Abschnitt versehentlich an die falsche Stelle ziehst, drücke Strg+Z (Cmd+Z auf dem Mac), um die Änderung rückgängig zu machen. Oder speichere einfach nicht und lade die Seite neu.
FAQ
Drei häufige Ursachen: (1) Der Abschnitt ist gesperrt (Header/Footer oder Themes, die bestimmte Abschnitte fixieren), (2) die Seite wird von einem Theme-Entwurf geladen, aber du siehst dir das Live-Theme an – wechsle zur richtigen Theme-Ansicht, oder (3) ein Browser-Problem – versuche es mit einem anderen Browser oder lade die Seite neu. Halte Ausschau nach dem Drag-Handle (sechs Punkte), das beim Hovern angezeigt wird.
Ja – öffne die entsprechende JSON-Template-Datei (z. B. templates/index.json für die Startseite) und ordne die Einträge im order-Array neu an. Das ist schneller für Massenänderungen oder für Abschnitte ohne Drag-Handles, aber riskanter – ein JSON-Syntaxfehler macht die Seite kaputt. Dupliziere das Theme immer zuerst.
Geringfügig. Die Reihenfolge der Abschnitte ändert die visuelle Abfolge, was verschieben kann, welche Inhalte Above-the-fold erscheinen und welche Keywords Google zuerst sieht. Bei den meisten Neuordnungen sind die SEO-Auswirkungen vernachlässigbar, aber wenn ein langer Textblock von einer prominenten Position nach ganz unten verschoben wird, kann das die Keyword-Relevanz der Seite verringern.
Ja – jedes Template (Startseite, Produkt, Kategorie, benutzerdefinierte Seite) hat seine eigene Abschnittsreihenfolge. Das Neuordnen auf der Startseite wirkt sich nicht auf die Produktseiten aus und umgekehrt. Benutzerdefinierte Templates (z. B. product.hero.json) behalten eine vom Standard-Template unabhängige Abschnittsreihenfolge bei.
Bei umfangreichen Umstrukturierungen (Neuaufbau der Startseite, Änderung der Reihenfolge auf Produktseiten für alle Produkte): ja. Bei kleinen Änderungen (einen Abschnitt nach oben oder unten verschieben): nein – die Änderung kann durch einfaches Zurückziehen rückgängig gemacht werden. Das Duplizieren ist dein Sicherheitsnetz für Änderungen, die sich unwiderruflich anfühlen. Für Umstrukturierungen, die über Drag-and-Drop hinausgehen (Inhalte zwischen Abschnitten verschieben, zwei Abschnitte zusammenführen, einen in zwei teilen), beschreibe einfach, was du möchtest, an Fudge, und es schreibt das Seiten-Template für dich um.
