Die wichtigsten Punkte
- Abschnitte werden neu angeordnet, indem du sie in der linken Seitenleiste des Theme-Editors verschiebst.
- Das funktioniert auf jedem Seitentyp – Startseite, Produktseiten, Kategorie-Seiten und benutzerdefinierten Seiten.
- Header und Footer sind feste Abschnitte – sie können nicht verschoben werden.
- Änderungen sind erst live, nachdem du auf Speichern geklickt hast.
- Fudge kann Seitenlayouts anhand einer einfachen Beschreibung auf Englisch umstrukturieren, wenn Änderungen über einfaches Drag-and-Drop hinausgehen.
Das Verschieben von Abschnitten gehört zu den befriedigendsten Aufgaben im Shopify Theme-Editor. Es ist ein simples Drag-and-Drop – kein Code erforderlich. Hier zeigen wir dir genau, wie das 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 Bewertung von 4.9 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 Draft-Theme geladen, aber du schaust 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. Achte auf den Drag-Handle (sechs Punkte), der beim Hovern erscheint.
Ja – öffne die entsprechende Template-JSON-Datei (z. B. templates/index.json für die Startseite) und ordne die Einträge im order-Array neu an. Das ist schneller, wenn du viele Elemente auf einmal verschieben willst, oder für Abschnitte ohne Drag-Handle, aber auch riskanter – ein JSON-Syntaxfehler zerschießt die Seite. Dupliziere das Theme immer zuerst.
Leicht. Die Reihenfolge der Abschnitte ändert die visuelle Sequenz, was verschieben kann, welche Inhalte Above-the-fold erscheinen und welche Keywords Google zuerst sieht. Bei den meisten Neuordnungen ist die SEO-Auswirkung vernachlässigbar, aber wenn du einen langen Textblock von einer prominenten an eine versteckte Position verschiebst, kann das die Keyword-Relevanz der Seite verringern.
Ja – jedes Template (Startseite, Produkt, Collection, benutzerdefinierte Seite) hat seine eigene Abschnitt-Reihenfolge. Eine Neuordnung auf der Startseite wirkt sich nicht auf die Produktseiten aus und umgekehrt. Custom-Templates (z. B. product.hero.json) haben unabhängige Reihenfolgen vom Standard-Template.
Bei umfangreichen Umstrukturierungen (Neuaufbau der Startseite, Ändern der Produktseiten-Reihenfolge für alle Produkte), ja. Für kleine Änderungen (Verschieben eines Abschnitts nach oben oder unten), nein – die Änderung kann einfach per Drag-and-Drop rückgängig gemacht werden. Das Duplizieren ist dein Sicherheitsnetz für Änderungen, die sich unumkehrbar anfühlen. Für Umstrukturierungen, die über das hinausgehen, was Drag-and-Drop leisten kann (Inhalte zwischen Abschnitten verschieben, zwei Abschnitte zusammenführen, einen in zwei aufteilen), beschreibe Fudge, was du möchtest, und es schreibt das Seiten-Template für dich neu.
