Banner zu Shopify-Kategorien hinzufügen: 3 Methoden (2026)

Das Wichtigste in Kürze

Die schnellste Methode: Lege unter Produkte > Kategorien ein Kategoriebild fest – die meisten Themes zeigen es als Banner an.

Für einen benutzerdefinierten Header-Abschnitt auf allen Kategorieseiten nutzt du am besten den Theme Editor > Vorlage für Kategorien.

Für individuelle Banner pro Kategorie verwendest du Kategorie-Metafields, um die jeweiligen Bilder zu speichern.

Wenn du den Kategorietitel und eine kurze Beschreibung im Banner anzeigst, lieferst du Google crawlbaren Text und signalisierst den Käufern, dass sie hier richtig sind.

Um ein Banner zu einer Shopify-Kategorieseite hinzuzufügen, lädst du unter Produkte > Kategorien ein Kategoriebild hoch; die meisten Themes zeigen es als Banner oben auf der Seite an. Für mehr Kontrolle kannst du einen Bild-Banner-Abschnitt hinzufügen oder ein Metafield für individuelle Kategoriebilder verwenden.

Warum du uns vertrauen kannst

Wir haben bereits Hunderte von Shopify-Storefronts aufgebaut und angepasst. Außerdem haben wir Fudge entwickelt, den KI-Operator für Shopify-Stores, mit einer Bewertung von 4.9 im Shopify App Store. Layouts für Kategorieseiten gehören zu den Theme-Änderungen, die er für dich entwirft.

Methode 1 - Ein Kategorie-Bild festlegen (am einfachsten)

Jede Shopify-Kategorie hat ein optionales Feld für das Kategoriebild (Collection Image). Die meisten Themes zeigen dieses Bild als Banner oben auf der Kategorieseite an.

Schritt 1. Gehe zu Produkte > Kategorien.

Schritt 2. Klicke auf die Kategorie, der du ein Banner hinzufügen möchtest.

Schritt 3. Klicke im Abschnitt Kategoriebild (meistens auf der rechten Seite des Editors) auf Bild hinzufügen und lade dein Banner-Bild hoch.

Schritt 4. Speichern.

Das Bild wird nun oben auf dieser Kategorieseite angezeigt. Das genaue Layout (volle Breite, contained, mit Overlay-Text) hängt von deinem Theme ab.

Diese Methode setzt ein Banner pro Kategorie, ohne dass Code erforderlich ist. Der Nachteil ist die eingeschränkte Kontrolle über das Layout – du nutzt einfach das, was das Theme standardmäßig mit dem Kategoriebild macht.

Für weitere Änderungen an der Seite siehe Kategorieseite in Shopify anpassen.

Methode 2 - Einen Header-Abschnitt über den Theme Editor hinzufügen

Für mehr Kontrolle über das Banner-Layout kannst du über den Theme Editor direkt einen Abschnitt (Section) zur Vorlage der Kategorieseite hinzufügen.

Schritt 1. Gehe zu Onlineshop > Themes > Anpassen.

Schritt 2. Navigiere über die Seitenauswahl oben zu einer Kategorieseite.

Schritt 3. Schau dir in der linken Seitenleiste die Abschnitte über dem Produktraster an. Klicke auf Abschnitt hinzufügen und wähle ein Bild-Banner, einen Hero- oder einen Text-Abschnitt.

Schritt 4. Konfiguriere das Bild und den Inhalt in den Abschnittseinstellungen.

Schritt 5. Speichern.

Wichtige Einschränkung: Wenn du einen Abschnitt über den Theme Editor in der Kategorievorlage hinzufügst, erscheint er auf allen Kategorieseiten, die diese Vorlage nutzen. Wenn du ein individuelles Banner pro Kategorie möchtest, verwende Methode 3.

Um auf jeder Kategorieseite ein anderes Banner-Bild anzuzeigen, musst du Kategorie-Metafields verwenden.

Schritt 1. Gehe im Shopify-Adminbereich zu Einstellungen > Benutzerdefinierte Daten > Kategorien > Definition hinzufügen.

Schritt 2. Erstelle eine neue Metafield-Definition: Gib ihr einen Namen wie “Banner-Bild” und setze den Typ auf Datei (Bilder).

Schritt 3. Gehe zurück zu deiner Kategorie (Produkte > Kategorien > Kategorie auswählen) und fülle das neue Metafield für das Banner-Bild aus.

Schritt 4. Füge im Theme Editor einen Bild-Banner-Abschnitt zur Kategorievorlage hinzu. Klicke beim Bildfeld auf Dynamische Quelle verbinden und verknüpfe es mit deinem Metafield.

Schritt 5. Speichern.

Jetzt kann jede Kategorie ihr eigenes, individuelles Banner-Bild haben, das im Metafield gespeichert ist. Du aktualisierst sie im Kategorie-Editor, nicht im Theme Editor.

Möchtest du ein benutzerdefiniertes Banner-Layout für Kategorien? Beschreibe es Fudge.

Kostenlose Testversion starten

Einen ähnlichen Ansatz findest du unter Hero-Bild in Shopify ändern.

Nimm den Kategorie-Namen in den Banner-Text auf. Das hilft bei der SEO und bestätigt den Kunden, dass sie am richtigen Ort gelandet sind.

Nutze deine Kategorie-Beschreibung. Eine Beschreibung von 1-2 Sätzen, die unter dem Titel angezeigt wird, fügt Kontext hinzu und gibt Google crawl-baren Text mit relevanten Keywords.

Einheitliche Dimensionen. Wenn du Banner für mehrere Kategorien erstellst, verwende das gleiche Seitenverhältnis, damit deine Seiten konsistent aussehen. Ein breites Querformat-Verhältnis von 3:1 oder 4:1 ist für Kategorie-Banner üblich.

Mobiler Zuschnitt (Mobile Crop). Breite Querformat-Banner werden auf dem Handy oft nur auf die Mitte zugeschnitten. Stelle sicher, dass dein Hauptmotiv und dein Text in der sicheren Zone des Bildes (die mittleren 50-60%) liegen.

Das Kategoriebild (als Banner angezeigt) ist unabhängig von einem Full-Bleed-Hero mit Text-Overlay. Wenn du einen wirkungsvollen Header im Hero-Stil auf Kategorieseiten mit Overlay-Überschrift, CTA-Button und gestyltem Text möchtest, wird das normalerweise über einen benutzerdefinierten Abschnitt oder ein Template gemacht, nicht über das einfache Feld für das Kategoriebild.

Beschreibe es Fudge: “Füge Kategorieseiten ein Hero-Banner in voller Breite hinzu, bei dem der Kategorietitel über dem Bild liegt. Ziehe das Banner-Bild aus einem Kategorie-Metafield.” Fudge entwirft den Abschnitt in deiner Kategorievorlage, und du kannst ihn in der Vorschau für einige Kategorien überprüfen, bevor du ihn veröffentlichst.

FAQ

Kann ich auf jeder Kategorieseite ein anderes Banner haben?

Ja, mithilfe von Kategorie-Metafields. Erstelle eine Metafield-Definition vom Typ "Datei" für Kategorien, lade pro Kategorie ein individuelles Bild hoch und verknüpfe dieses Metafield dann als dynamische Quelle für einen Bild-Banner-Abschnitt in der Kategorievorlage. Wenn dein Theme diese Verknüpfung nicht sauber anbietet, beschreibe Fudge einfach, was du möchtest ("Lese das Banner-Bild aus einem Metafield pro Kategorie aus, mit dem Kategoriebild als Fallback") und er baut dir den Abschnitt, der mit deinem Metafield verbunden ist.

Welche Größe sollte ein Shopify-Kategorie-Banner haben?

Ein Querformat von 3:1 oder 4:1 funktioniert gut, bei einer Breite von etwa 2000-2800px, damit es auch auf großen Bildschirmen scharf bleibt. Halte die Dateigröße für eine bessere Performance möglichst unter 200 KB und platziere das Hauptmotiv in den mittleren 50-60 % des Rahmens, damit es bei der mobilen Ansicht nicht abgeschnitten wird.

Brauche ich eine App, um ein Banner zu einer Shopify-Kategorieseite hinzuzufügen?

Nein. Jede Kategorie hat ein Bildfeld, und in Online Store 2.0-Themes kannst du direkt im Theme Editor einen Bild-Banner-Abschnitt hinzufügen. Apps werden nur benötigt, wenn dein Theme älter ist oder du Layout-Funktionen möchtest, die es nicht unterstützt.

Warum wird mein Kategoriebild nicht als Banner angezeigt?

Manche Themes zeigen das Kategoriebild gar nicht an oder nur auf der Kategoriekarte auf Übersichtsseiten. Öffne die Vorlage für Kategorien im Theme Editor und suche nach einem Abschnitt mit dem Namen "Kategorie-Banner" oder "Beitragsbild" – wenn er nicht da ist, rendert das Theme das Bild standardmäßig nicht als Header.

Kann ich dasselbe Banner auf einmal zu allen Kategorieseiten hinzufügen?

Ja. Öffne die Vorlage für Kategorien im Theme Editor, füge einen Bild-Banner-Abschnitt hinzu und konfiguriere das Bild. Da die Änderung an der Vorlage vorgenommen wird, zeigt jede Kategorie, die diese Vorlage verwendet, dasselbe Banner an. Verwende Metafields (Methode 3), wenn du individuelle Banner pro Kategorie möchtest.