Präsentiere Produkte mit einem Produkt-Slider

Mit einem Produkt-Slider kannst du bestimmte Produkte auf deiner Website hervorheben, z. B. neue Produkte, Bestseller oder Produkte im Angebot. Im Editor deines Cockpits findest du den Produkt-Slider als Inhaltselement, das du zu einer Seite hinzufügen kannst.

Info

Wenn du mit dem Hinzufügen von Seiten und Inhaltselementen noch nicht vertraut bist, empfehlen wir dir, zuerst die Artikel Füge eine neue Seite hinzu und Erfahre mehr über Inhaltselemente zu lesen.

Springe zu:

• Füge einen Produkt-Slider hinzu
• Hebe deine Produktauswahl mit einem Text hervor
• Ändere die Größe der Produktbilder
• So sieht es auf der Website aus
• Entferne ein Produkt aus dem Produkt-Slider

Füge einen Produkt-Slider hinzu

So fügst du einen Produkt-Slider zu einer Seite hinzu und legst fest, welche Produkte du hervorheben möchtest:

1. In der Seitenleiste deines Cockpits, navigiere zu Editor.
2. In der Seitenleiste deines Editors siehst du nun eine Liste aller Seiten unter Seiten > Inhaltsseiten. Wähle die Seite aus, zu der du den Produkt-Slider hinzufügen möchtest oder füge eine neue hinzu. Eine Vorschau der Seite wird nun rechts angezeigt.
3. In der Seitenleiste deines Editors, wähle Inhaltselemente.
4. Wähle die Kategorie Produkte.
5. Ziehe das Inhaltselement Produkt-Slider in den Vorschau-Bereich und lege es an der gewünschten Position ab. Du kannst Inhaltselemente nur in den blauen Bereichen der Seite ablegen.
6. Wähle Produkte hinzufügen.
   Die Ansicht Produkte zum Produkt-Slider hinzufügen erscheint. Hier kannst du bis zu zwölf Produkte zum Produkt-Slider hinzufügen.
7. Nutze das Feld Suchen und zuweisen, um die Produkte deiner Wahl zuzuweisen. Sobald du das Suchfeld gewählt hast, siehst du eine Liste der Produkte, die du zuweisen kannst. Du kannst auch mit dem Namen oder der Artikelnummer nach spezifischen Produkten suchen.
8. Wenn du mit der Zuweisung der Produkte fertig bist, wähle Speichern.

Der Produkt-Slider mit den von dir ausgewählten Produkten wurde zu der Seite hinzugefügt. Optional kannst du nun einen Text über den Produkten hinzufügen oder die Größe der Produktbilder ändern.

Hebe deine Produktauswahl mit einem Text hervor

Wähle den Text-Bereich ("Hier Text eingeben") des Inhaltselements, um deine Produktauswahl mit einem passendem Text hervorzuheben. Nutze hierfür die Formatierungsoptionen für Texte.

Ändere die Größe der Produktbilder

Sobald du einen Produkt-Slider zu einer Seite hinzugefügt hast, kannst du das Aussehen des Produkt-Sliders anpassen und festlegen, wie viele Produkte zur gleichen Zeit angezeigt werden. So machst du das:

1. In der Seitenleiste deines Cockpits, wähle Editor.
2. Navigiere im Editor zu der Seite mit dem Produkt-Slider, für den du die Größe der Produktbilder ändern möchtest.
3. Wähle den Produkt-Slider auf Höhe der enthaltenen Produkte oder bewege deine Maus über die Produkte. Das folgende Symbol wird dann über den Produkten angezeigt: .
4. Wähle .
5. Wähle den Tab .
6. Wähle deine gewünschte Bildgröße. Du kannst zwischen drei verschiedenen Größen auswählen:
   • S (Klein)
   • M (Mittel)
   • L (Groß)
   Je nach gewählter Option verändert sich die Größe der Produktbilder. Wenn du S wählst, werden die Bilder kleiner dargestellt und es werden daher mehr Bilder zur gleichen Zeit angezeigt. Wählst du L, werden die Bilder größer dargestellt und es werden daher weniger Bilder zur gleichen Zeit angezeigt. Standardmäßig ist M eingestellt.
   Auf der Seite im Hintergrund kannst du jederzeit eine Vorschau des Produkt-Sliders mit der derzeit ausgewählten Bildgröße sehen.

   Info

   Du kannst in der rechten oberen Ecke des Produkt-Slider Fensters gedrückt halten und dann das Fenster bewegen, um so andere Bereiche der Seite im Hintergrund sehen zu können.
7. Wähle Speichern.

Die Größe der Produktbilder wurde angepasst.

Hinweis

Abhängig von dem verwendeten Gerät (bspw. Smartphone oder Laptop), kann die Anzahl der zur gleichen Zeit angezeigten Bilder leicht variieren. Dies ermöglicht ein responsives Design deiner Website und stellt sicher, dass deine Produktbilder auf unterschiedlichen Geräten und Bildschirmgrößen ansprechend dargestellt werden.

So sieht es auf der Website aus:

Wie du es auch schon in der Vorschau des Editors sehen kannst, werden deine ausgewählten Produkte den Besuchern mit Name, Preis und Lagerbestand angezeigt. Besucher können die Produkte entweder durch Nutzung der Pfeile links und rechts der Bilder durchstöbern oder die Bilder hin- und herschieben.

Entferne ein Produkt aus dem Produkt-Slider

1. In der Seitenleiste deines Cockpits, wähle Editor.
2. Navigiere im Editor zu der Seite mit dem Produkt-Slider, aus dem du ein Produkt entfernen möchtest.
3. Wähle den Produkt-Slider auf Höhe der enthaltenen Produkte oder bewege deine Maus über die Produkte.
4. Wähle .
5. Wähle , um ein zugewiesenes Produkt aus dem Produkt-Slider zu entfernen.
6. Wähle Speichern.

Das Produkt wurde aus dem Produkt-Slider entfernt.