Produktseiten & -Kategorien

Um Warenartikel oder thematische Content-Übersichten als dynamischen Teaser darzustellen, haben Sie die Möglichkeit, eigens Produktseiten anzulegen. Dieses Setup ist Voraussetzung für die Verwendung des toujou-Elements Product Widget und nicht mit den dort anzuwendenden Einstellungen zu verwechseln.

Neue Produktseite anlegen Card-Einstellungen/Seiteneigenschaften

Verwandte Themen: Produkt-Kategorien anlegen Element Product Widget

Neue Produktseite

Voraussetzung für jegliche Präsentation von Produkten bzw. Content-Übersichten sind die Unterseiten des entsprechenden Typs. Diese Seiten bilden in ihrer Fülle die Datenbank, aus der die automatische Verlinkung sowie die Widget-Einstellungen im Frontend sich speist.

Neue Produktseite anlegen

Für das Tutorial haben wir im Vorfeld einen Produkt-Ordner angelegt. Produktseiten können auch unterhalb von Landing-Pages und Produkt-Übersichten angelegt werden.
Oberhalb des Seitenbaums sehen Sie die verfügbaren Seiten-Icons. Klicken Sie auf das Würfel-Icon (»Product page«) und ziehen Sie es per Drag-and-Drop an die gewünschte Stelle.
Eine blaue Fläche zeigt an, in welchem Bereich sich die neue Seite einsortieren wird, wenn Sie während des Drag-and-Drop-Verfahrens über den Seitenbaum fahren.
Geben Sie der Produktseite einen Titel. Diesen können Sie auch später be-/überarbeiten.

Seite aktivieren

Mit einem Rechtsklick auf das Icon der neuen Produktseite öffnet sich ein Kontextmenü.
Damit die Seite auch im Frontend sichtbar wird, klicken Sie im Kontextmenü auf die Option Aktivieren.

Seiteninhalte erstellen

Mit Klick auf das jeweilige Produkt öffnet sich der Inhaltsaufbau der Produktseite, die Sie wie eine Content-Seite bearbeiten können.
Der Seitentyp Product Page ist in vier Bereiche gegliedert, die Sie nach Wunsch mit Content-Elementen bestücken können.
- Kopfbereich: Hier besteht ausschließlich die Möglichkeit, ein Headerbild hochzuladen.
- Einleitung: Hier werden Ihnen alle verfügbaren Inhaltselemente (bis auf das Headerbild) angeboten, die stets mit einem nachgestellten Trenner/Divider in der Primärfarbe im Frontend dargestellt werden.
- Inhaltsbereich: Hier werden Ihnen alle verfügbaren Inhaltselemente (bis auf das Headerbild) angeboten, die Sie nach Wunsch auswählen und kombinieren, um Ihren Artikel zu illustrieren.
- Weitere Produkte: Der Abschlussbereich der Seite wird stets mit einem vorangestellten Trenner/Divider in der Primärfarbe im Frontend dargestellt. Auch die übrigen Elemente der Bibliothek (bis auf das Headerbild) stehen Ihnen zur Verfügung.

Card-Einstellungen & Seiteneigenschaften

Mit diesen Einstellungen beeinflussen Sie die Darstellung der Produkteaser, die im Widget-Element für das Product Grid zur Geltung kommen.

Seiteneigenschaften aufrufen

Klicken Sie oberhalb des Inhaltsbereichs Ihrer Artikelseite auf das mittlere Icon Seiteneigenschaften bearbeiten.
Ein übergeordnetes Tutorial zu den Seiteneigenschaften finden Sie hier.
In den untenstehenden Schritten erfahren Sie, welche Reiter für Produktseiten relevant und zu bearbeiten sind.

Produkt-relevante Reiter

Reiter »SEO«

Füllen Sie die Masken Titel für Suchmaschinen sowie Beschreibung aus. Diese Snippet-Preview hilft Ihnen, Ihre Produktseite für Suchmaschinenergebnisse zu optimieren. Mehr dazu im Yoast-SEO-Tutorial.

Reiter »Ressourcen«

Auch dieser Reiter ist für Produktseiten relevant, da hier ein Teaserbild für die Darstellung in den Karten separat ausgewählt werden muss (Buttons Neue Relation erstellen/Dateien auswählen und hochladen).