Produktpreiselement

Informationen zum Produktpreiselement

In GemPages Editor 7.0kombiniert das Element „Produktpreis“ zwei separate Elemente: Preis und Preis vergleichen. Der Preiselement zeigt den regulären Preis eines Produkts an, während der Preiselement vergleichen Zeigt den reduzierten oder den Originalpreis an, wenn ein Sonderangebot gilt. Die gleichzeitige Anzeige beider Preise macht Ihr Angebot attraktiver und ist eine bewährte Methode zur Steigerung der Conversions.

Wie füge ich ein Produktpreiselement hinzu?

Von dem GemPages-Dashboard, öffnen Sie Ihre bevorzugte Vorlage, um auf den Editor zuzugreifen. Sie finden diese beiden Elemente schnell in der linken Seitenleiste, Unter der Produkt .

Als untergeordnetes Element muss sich das Preis- und Preisvergleichselement in einem Produktmodul richtig arbeiten. 

GemPages ermöglicht es Ihnen, das Preisformat so zu ändern, dass der Währungszusatz angezeigt wird. Um dieses Format zu verwenden, gehen Sie zu GemPages-Dashboard → Einstellungen und aktivieren Preis in Währung anzeigen.

Nach der Aktivierung müssen Sie Folgendes tun: Veröffentlichung erzwingen Seiten, die das Element „Preis“ oder „Preis vergleichen“ enthalten, um das aktualisierte Format auf Live-Seiten anzuwenden.

So zeigen Sie den Vergleichspreis neben dem Normalpreis an

Normalerweise wird der Vergleichspreis neben dem Normalpreis angezeigt, um Rabatte hervorzuheben und zum Kauf anzuregen. Gehen Sie folgendermaßen vor, um ihn einzurichten:

Schritt 1: Verkaufspreis festlegen und Preis in Shopify vergleichen

Bevor Sie den Vergleichspreis in GemPages anzeigen, stellen Sie sicher, dass Sie sowohl den regulären Preis als auch den Verkaufspreis für Ihr Produkt in Shopify konfiguriert haben. Sie können folgen Shopify-Richtlinien um diese richtig einzustellen.

Schritt 2: Ein Zeilenelement hinzufügen

Ziehen Sie im GemPages Editor die Zeilenelement an die Stelle auf Ihrer Seite, an der die Preise angezeigt werden sollen. Wählen Sie eine 2-spaltiges Layout und einstellen Spaltenbreite zu An Inhalt anpassenDadurch passen sich die Spalten automatisch an den Inhalt an.

Schritt 3: Preiselemente in Spalten einfügen

Legen Sie die Preiselement in einer Spalte und die Preiselement vergleichen in der anderen Spalte. Passen Sie die Ausrichtung, den Abstand oder den Stil nach Bedarf an Ihr bevorzugtes Design an.

Konfigurieren der Registerkarte „Einstellungen“

Die Konfigurationsoptionen für die Elemente „Preis“ und „Preisvergleich“ sind nahezu identisch, mit Ausnahme der Durchstreichungseinstellung, die für den Preisvergleich gilt.

Produktquelle

Diese Einstellung bestimmt, für welches Produkt das Element Preisinformationen anzeigt. Standardmäßig wird das im Produktmodul zugewiesene Produkt verwendet. Sie können das Produkt ändern, indem Sie das Produktauswahl in den Produktmoduleinstellungen.

Textstile

An dieser Stelle haben Sie die Möglichkeit, die Typografie des Textes zu optimieren. Hier sind die verfügbaren Optionen:

1. Stile: Wählen Sie Ihren gewünschten Stil aus den vordefinierten Optionen aus, darunter 6 Überschriftenstile und 3 Absatzstile.

2. Schriftart: Wählen Sie die Schriftart, die Sie für den Text in diesem Textblock verwenden möchten. Wenn Sie eine Schriftart verwenden möchten, die nicht aufgeführt ist, können Sie die bereitgestellte Anleitung unter So fügen Sie im Editor v7 eine benutzerdefinierte Schriftart hinzu.

3. Größe: Passen Sie die Schriftgröße an, indem Sie einen Wert in Pixeln angeben.

4. Farbe : Wählen Sie eine Farbe für den Text.

5. Ausrichten: Bestimmen Sie, wie der Text auf Ihrer Seite positioniert wird. Sie können zwischen vier Optionen wählen: linksbündig, zentriert, rechtsbündig und Blocksatz.

Klicken Sie auf Mehr anzeigen !!! Schaltfläche, um weitere Anpassungsoptionen anzuzeigen. 

6. Schriftstärke: Wählen Sie die gewünschte Schriftstärke aus dem bereitgestellten Dropdown-Menü.

7. Zeilenhöhe: Passen Sie die Höhe des Textes an, indem Sie einen Prozentwert angeben.

8. Buchstabenabstand: Ändern Sie den Abstand zwischen Buchstaben, indem Sie einen Wert in Pixeln eingeben.

9. Transformieren: Transformieren Sie den Text auf eine der folgenden Arten: 

• Keine Transformation angewendet.
• Großbuchstaben: Wandeln Sie den gesamten Text in Großbuchstaben um.
• Klein: Wandeln Sie den gesamten Text in Kleinbuchstaben um.
• Profitieren: Schreiben Sie den ersten Buchstaben jedes Wortes groß.

10. Schatten:

Sie können Textschatten für mehr visuelle Tiefe hinzufügen:

• Richtung: Geben Sie den Winkel des Schattens an.
• Farbe: Wählen Sie die Schattenfarbe.
• Entfernung: Legen Sie fest, wie weit der Schatten vom Text entfernt erscheint.
• Verwischen: Passen Sie die Weichheit der Schattenkanten an.

Linie durch

Diese Einstellung ist exklusiv für den Preisvergleich. Schalten Sie sie einfach ein, um den Strich durch den Preis zu aktivieren. 

• Farbe,: Wählen Sie Ihre gewünschte Linienfarbe aus der Palette oder geben Sie den Hex-Farbcode ein.
• Materialstärke: Passen Sie die Dicke mit dem Schieberegler an oder indem Sie eine bestimmte Zahl in das Feld eingeben. 

Konfigurieren der Registerkarte „Erweitert“

Für erweiterte Anpassungen navigieren Sie bitte zu Registerkarte Erweitert und befolgen Sie die Anweisungen in Dieser Artikel.

So fixieren Sie das Produktpreiselement

Sie können das Element „Produktpreis“ fixieren, sodass es beim Scrollen durch die Seite sichtbar bleibt. Dies ist besonders auf langen Produktseiten nützlich, um Preisinformationen jederzeit zugänglich zu halten.

Führen Sie diese Schritte aus, um das Element „Produktpreis“ als fixiert festzulegen:

Schritt 1: Wählen Sie das Produktpreiselement aus.

Klicken Sie im GemPages Editor auf das Produktpreiselement das Sie klebrig machen möchten.

Schritt 2: Öffnen Sie die erweiterten Einstellungen

Nach der Auswahl gehen Sie zu Erweitert Registerkarte im Einstellungsfeld auf der linken Seite.

Schritt 3: Position auf „Sticky“ setzen

Scrollen Sie zum Position Abschnitt. Ändern Sie den Position Einstellung Klebrig (Sticky).

Fehlerbehebung: Preis wird falsch angezeigt

1. Stellen Sie die richtige Platzierung des Preiselements sicher

• Öffnen Sie Ihre Seite im GemPages-Editor.
• Stellen Sie sicher, dass das Preiselement in einem Produktmodul platziert ist.
• Wenn dies nicht der Fall ist, ziehen Sie ein Produktmodul auf die Seite und verschachteln Sie das Preiselement darin.​

2. Produktzuordnung im Produktmodul prüfen

• Wählen Sie das Produktmodul im GemPages-Editor aus.
• Stellen Sie im Einstellungsbereich sicher, dass das richtige Produkt zugewiesen ist.
• Sie können die Anzeige nach dem zugewiesenen Produkt wählen oder manuell ein bestimmtes Produkt auswählen.

3. Produktstatus und Verfügbarkeit in Shopify bestätigen

• Navigieren Sie zu Ihrem Shopify-Adminbereich > Produkte.
• Wählen Sie das gewünschte Produkt aus.
• Stellen Sie sicher, dass der Produktstatus auf „Aktiv“ eingestellt ist.
• Bestätigen Sie unter „Vertriebskanäle und Apps“, dass „Online-Shop“ ausgewählt ist.​

4. Aktualisieren Sie den Produktpreis und das Währungsformat in Shopify