Dokumentation

Tiles Navigation - Unterkategorien als Kachel-/Bilder- Navigation abbilden

Das Plugin ermöglicht eine dynamische Kachel-Navigation für Kategoriebilder, die eine interaktive und benutzerfreundliche Navigation bietet und die Nutzererfahrung verbessert.

Besondere Features des Plugins sind individuelle Einstellungen zur Darstellung, ein Slider Mode für eine flexible Navigation, verschiedene Hover-Effekte zur Verbesserung der Interaktivität und die Möglichkeit, die Anzeigentiefe der Kategorien (1-3 Ebenen) zu konfigurieren. Das Plugin bietet zudem ein CMS-Block-Feature, mit dem die Kategorienavigation einfach eingefügt und konfiguriert werden kann.

Allgemeine Einstellungen

Nach der Installation des Plugins gehen Sie zu den Plugin-Konfigurationen.

Verkaufskanal: Wählen Sie den gewünschten Verkaufskanal, für den Sie die Formularvalidierung aktivieren möchten.
Aktiv: Aktiviert die Einstellungen für den ausgewählten Verkaufskanal.
Debug: Es werden zusätzliche Ausgaben in der Konsole ausgegeben zur Problembehandlung.

Gehen Sie anschließend zu den Erlebniswelten.

Erlebniswelten

Erstellen Sie ein neues Layout oder passen Sie ein vorhandenes an.
Wählen Sie in der rechten Menüleiste unter „Blöcke“ die Block-Kategorie „Sidebar“ und ziehen Sie die „Diga Tiles-Navigation“ in Ihr Layout.

Um die Kacheln nach Ihren Wünschen zu konfigurieren, klicken Sie auf das kleine Rädchen, um die Einstellungen der Tiles-Navigation zu öffnen.

(Optional können Sie die Einstellungen auch direkt im Layout der jeweiligen Kategorien anpassen. Navigieren Sie in Ihrer Shopware-Administration zum Menü "Kataloge" und wählen Sie "Kategorien", um die Änderungen vorzunehmen.)

Unter dem Reiter „Hauptkategorie“ können Sie, einen Hover-Effekt hinzufügen und benutzerdefinierte Anpassungen vornehmen. In der Einstellung „Tiefe der Kategorien“ können Sie wählen, wie viele Ebenen der Kategorien in der Kachel-Navigation angezeigt werden.

„Level 1“ zeigt nur die Unterkategorien der Hauptkategorie an, während „Level 1+2“ sowohl die Unterkategorien als auch deren Subkategorien in Kacheln darstellt.

Weiter unten sehen Sie unter der Überschrift "Beispiele Kategorie-Ebenen" ein Bild, das unsere Kategorieteilung veranschaulicht.

Unter dem Reiter „Tiles Mode“ können Sie die Anzahl der Kacheln pro Reihe festlegen und die Gesamtanzahl der angezeigten Kacheln nach Ihren Wünschen begrenzen.

Unter dem Reiter „Slider Mode“ können Sie automatische Slides, eine manuelle Steuerung über Pfeile oder/ und Navigationspunkte einrichten. Wichtig: Wenn der Slider Mode aktiviert ist, werden Ihre Haupteinstellungen überschrieben. Auch der Tiles Mode ist nicht mehr verfügbar.

Speichern Sie nach allen Änderungen das Layout. Falls Sie das Layout bisher keiner Kategorie zugewiesen haben, können Sie dies jetzt an dieser Stelle nachholen.

Falls Sie sich für die benutzerdefinierte Kategoriesortierung entscheiden, gehen Sie nun in Ihrer Shopware-Administration zu „Kataloge“ -> „Kategorien“ und wählen die Unterkategorie aus, die Sie anzeigen möchten. Dort navigieren Sie zu den „Allgemeinen Einstellungen“ und scrollen nach unten zu „Zusatzfelder“. Hier können Sie die benutzerdefinierte Kategoriesortierung vornehmen, indem Sie die Position festlegen, an der diese Kategorie angezeigt werden soll.

Beachten Sie: Die Wertzählung beginnt bei 1, der Wert 0 wird nicht berücksichtigt.

Tipp

Unter den Menü-Einstellungen der jeweiligen Kategorien können Sie die Bilder, die in den Kacheln angezeigt werden sollen, ändern. Achten Sie dabei darauf, dass die Bildgrößen einheitlich sind.

Beispiel für Kategorie-Ebenen

Anwendungsbeispiel 1: Slider Mode

In diesem Beispiel haben wir unser Layout mit der Kachel-Navigation der Hauptkategorie „Wohnen“ zugewiesen.

Nun möchten wir die folgenden Unterkategorien als Kachel-Navigation anzeigen: „Wohnzimmer“, „Küche“, „Kinderzimmer“, „Balkon“, „Gartenmöbel“ und „Esszimmer“. Daher wählen wir in den „Haupteinstellungen“ bei der Tiefe der Kategorien 1: Level 1.

Für dieses Beispiel entscheiden wir uns gegen eine benutzerdefinierte Kategoriesortierung. Zusätzlich aktivieren wir den Slider Mode, fügen Slider-Steuerpfeile und Navigationspunkte hinzu und setzen Autoplay für eine automatische Weiterleitung der Kacheln ein.

Nach Speicherung aller Änderungen sollte Ihre Kachel-Navigation nun wie folgt in Ihrem Verkaufskanal sichtbar sein:

Anwendungsbeispiel 2: Tiles Mode

Im zweiten Beispiel entscheiden wir uns für die benutzerdefinierten Einstellungen und den Tiles Mode. Wir möchten 3 Kacheln pro Zeile anzeigen lassen. In den Haupteinstellungen aktivieren wir die Anzeige der Kategorienamen und legen die benutzerdefinierte Kategoriesortierung fest, um die Reihenfolge der Kacheln nach Wunsch anzupassen.

Dafür gehen wir in die jeweiligen Unterkategorien und bearbeiten die „Zusatzfelder“. Hier wählen wir für die Unterkategorie „Wohnzimmer“ die Position 1, für „Küche“ die Position 2, für „Esszimmer“ die Position 3, für „Kinderzimmer“ die Position 4 und so weiter.