Diashow mit Hero-Banner und Karussell-Element gestalten

Eine gut gestaltete Diashow kann das Erscheinungsbild Ihres Online-Shops aufwerten und das Benutzererlebnis verbessern. 

Einer der beliebtesten Abschnitte für E-Commerce-Websites ist der Hero-Banner-Diashow, das Ihre wichtigsten Produkte, Werbeaktionen oder Markenbotschaften direkt oben auf Ihrer Homepage präsentiert.

Was ist eine Diashow und warum wird sie verwendet?

Eine Diashow ist eine rotierende Reihe von Bannern oder Bildern, die dazu dienen, mehrere Nachrichten, Werbeaktionen oder Produkte in einem einzigen Abschnitt anzuzeigen, normalerweise oben auf Ihrer Homepage. Sie hilft, schnell die Aufmerksamkeit Ihrer Besucher zu erregen und sie zu fesseln, ohne sie zu überfordern.

Durch die Verwendung eines Karussellformats können Sie Folgendes hervorheben:

• Ausgewählte oder saisonale Produkte
• Zeitlich begrenzte Aktionen oder Angebote
• Markenbotschaften oder neue Kollektionen

Eine gut gestaltete Diashow kann das Erscheinungsbild Ihres Online-Shops aufwerten und das Benutzererlebnis verbessern. 

So gestalten Sie mit GemPages eine Diashow oder ein Bildkarussell

Mit GemPages ist das Erstellen einer Diashow einfach und flexibel. Sie können die Karussell als auch Heldenbanner Elemente zum Erstellen auffälliger, interaktiver Folien, die das allgemeine Benutzererlebnis verbessern und mehr Klicks generieren. 

In diesem Handbuch führen wir Sie Schritt für Schritt durch die Gestaltung einer Hero-Banner-Diashow mit diesen Elementen.

Schritt 1: Zugriff auf den GemPages-Editor

Gehen Sie zur GemPages Dashboard > Seiten, und suchen Sie die Zielseite, um den Editor zu öffnen.

Schritt 2: Fügen Sie Ihrer Seite das Karussell-Element hinzu

Ziehen Sie die Karussell-Element in den Abschnitt, in dem die Diashow erscheinen soll.

Hinweis: Das Karussell-Element verfügt über anpassbare Einstellungen für Foliendauer, Übergangseffekte und mehr. Wenn Sie mit diesen Einstellungen nicht vertraut sind, lesen Sie Dieser Artikel.

Schritt 3: Fügen Sie das Hero-Banner-Element zum Karussell hinzu

Ziehen Sie aus der linken Seitenleiste ein Hero-Banner-Element per Drag & Drop in das Karussell.

Das Hero Banner ist vorinstalliert mit einem Hintergrundbild, Überschrift, Textblock und Button.

Sie können Ihr Hero Banner mit zusätzlichen Elementen wie Bildern, Symbolen, Artikellisten usw. bereichern.

Schritt 4: Passen Sie Ihr Heldenbanner an

Jetzt können wir Ihr Heldenbanner anpassen in der Einstellungen Registerkarte. In der linken Seitenleiste können Sie das Hero-Banner-Element nach Ihren Wünschen ändern.

Beispielsweise:

• Laden Sie das Bild zu Ihrem Hero-Banner hoch:

• Hintergrundfarbe ändern:

• Überschrift, Textblock, Button etc. bearbeiten.

Schritt 5: Duplizieren Sie die Folie  

Gehen Sie zurück zum Hauptkarussellelement Einstellungen Tab.

• Klicken Sie mit der rechten Maustaste auf Heldenbanner > wählen Sie „Übergeordnetes Element auswählen“, um zu den Haupteinstellungen des Karussells zurückzukehren.

• Alternativ Klicken Sie auf die kleinen Punkte unter dem Karussell, um auf die Einstellungen zuzugreifen.

Gehen Sie in der linken Seitenleiste zu Artikelverwaltung Abschnitt und klicken Sie auf das Kästchen neben Order , um den Dialog zur Artikelverwaltung zu öffnen.

Zeigen Sie auf Artikel 1 und klicken Sie auf Duplikat Symbol zum Duplizieren von Slider 1.

Der duplizierte Schieberegler (Schieberegler 2) wird unter Artikel 1und es wird automatisch benannt als Artikel 5.

Dieser Tipp spart Zeit, da Sie dasselbe Design wiederverwenden können. Aktualisieren Sie einfach die Bilder und den Text auf jeder duplizierten Folie.

Häufig gestellte Fragen

1. Kann ich meiner Diashow Videos anstelle von Bildern hinzufügen?

Derzeit unterstützt das Karussell-Element bildbasierte Folien. Sie können jedoch manuell ein Video-Element in ein Hero-Banner in jeder Folie einfügen, wenn Sie eine Video-Diashow simulieren möchten. Bitte beachten Sie, dass dies die Ladegeschwindigkeit beeinträchtigen kann.

2. Wie viele Folien kann ich zu einem einzelnen Karussell hinzufügen?

Es gibt keine strikte Begrenzung für die Anzahl der Folien, die Sie hinzufügen können. Aus Leistungs- und Benutzerfreundlichkeitsgründen empfehlen wir jedoch, die Anzahl auf unter 5 Folien zu beschränken.

3. Kann ich die Übergangsgeschwindigkeit und Animation von Folien steuern?

Ja! In den Karusselleinstellungen können Sie die Übergangsdauer, die automatische Wiedergabe, den Animationstyp (Ausblenden oder Gleiten) und das Schleifenverhalten anpassen.

4. Ist meine Diashow auf Mobilgeräten responsiv?

Absolut. Die Karussell- und Hero-Banner-Elemente in GemPages sind vollständig responsiv. Sie können das Layout auch für die mobile und Tablet-Ansicht anpassen, indem Sie den Responsive-View-Modus im Editor verwenden.

5. Kann ich jeder Folie unterschiedliche Links hinzufügen?

Ja. Jede Hero Banner-Folie kann Schaltflächen oder anklickbare Bilder mit individuellen Links enthalten. Passen Sie einfach das Schaltflächenelement oder den Bildlink in jedem Hero Banner-Block an.

6. Warum wird mein Karussell auf der Live-Seite nicht richtig angezeigt?

Stellen Sie sicher, dass die Präsentation Die Bedingung ist korrekt eingestellt und das Karussell-Element ist auf allen Geräten in einem sichtbaren Bereich platziert. Überprüfen Sie außerdem Ihren Veröffentlichungsstatus und leeren Sie den Browser-Cache.