Recommendations
Allgemein #
Die Empfehlungen von Clerk.io können auf jeder Seite des Webshops installiert werden, um den Kunden zu helfen, die richtigen Produkte zu finden.
Mit diesem Leitfaden erfahren Sie, wie Sie Empfehlungen installieren und welche Typen Sie verwenden sollten, um unsere Best Practice zum Laufen zu bringen.
Beginnen Sie im Hauptmenü, indem Sie auf Erste Schritte: klicken.
1. Erstellen Sie ein Standarddesign und Inhalte #
Das erste, was Sie tun müssen, ist, ein Standarddesign für Ihre Slider zu erstellen.
Sie können den Einrichtungsleitfaden unter Empfehlungen - Erstellen Sie ein Design für Ihre Empfehlungsslider verwenden, um schnell ein Design zu erstellen, das das gleiche Farbschema und den gleichen Stil wie Ihr Webshop hat.
Klicken Sie auf Veröffentlichen, wenn Sie mit dem Styling zufrieden sind.
Sie können dies später einfach unter Empfehlungen - Designs im linken Menü ändern. Sie können sich auch auf diesen Leitfaden Vorlagen-Design zur Verwendung in Clerk für Designvorlagen beziehen.
2. Hinzufügen des Warenkorb-Sliders #
Neue Slider können über das Clerk-Backend erstellt und hinzugefügt werden.
Das Design wird im Clerk.io-Backend unter Empfehlungen → Designs erstellt.
Das grundlegende Design kann hier über HTML und CSS angepasst werden.
Wichtig: Der Lieferstatus wird derzeit nur vom EasyTemplate-Slider unterstützt.
Inhalt hinzufügen
Der Inhalt für den neuen Warenkorb-Slider kann unter Clerk.io → Empfehlungen → Inhalt (Neuer Inhalt-Button) erstellt werden.
Die folgende Seite enthält 4 wichtige Abschnitte:
Benennen Sie Ihren Inhalt → Der Name wird hier angegeben
Wählen Sie die Produktlogik → Die Produktlogik kann hier ausgewählt werden, einschließlich „Bestseller“ / „Beliebte Produkte“ und vieles mehr
Design auswählen → Welches Design soll verwendet werden / wie soll die Überschrift lauten und wie viele Produkte sollen angezeigt werden (Wichtig: wird durch das Plugin bestimmt, auch wenn hier eine „Zahl“ gespeichert werden kann)
In die Website einfügen → Der Name, den wir in unserem JTL5-Shop-Backend unter Clerk TemplateName Warenkorb eingeben müssen, wird hier ausgegeben
Nachdem alles festgelegt und ausgefüllt wurde, müssen Sie nun zum JTL5-Shop-Backend wechseln, und der Name des Komponenten (aus In die Website einfügen) wird dort gespeichert.
Plugin-Einstellungen im JTL-Backend
Hinzufügen des Produktseiten-Sliders #
Das Hinzufügen des Artikel-Sliders ist dasselbe wie das Hinzufügen des Warenkorb-Sliders.
Im Standardfall werden die gleichen Design-Dateien verwendet (Slider NOVA / Slider ET), nur der Name/die Produktlogik im Clerk.io-Backend wird geändert und ein anderer Selektor wird im Plugin-Backend ausgewählt.
Hinzufügen zum Warenkorb Schritt #
Die Empfehlungen von Clerk.io können auf jeder Seite des Webshops installiert werden, um den Kunden zu helfen, die richtigen Produkte zu finden.
Mit diesem Leitfaden erfahren Sie, wie Sie Empfehlungen installieren und welche Typen Sie verwenden sollten, um unsere Best Practice zum Laufen zu bringen.
Beginnen Sie im Hauptmenü, indem Sie auf Erste Schritte: klicken.
1. Erstellen Sie ein Standarddesign und Inhalte #
Das erste, was Sie tun müssen, ist, ein Standarddesign für Ihre Slider zu erstellen.
Sie können den Einrichtungsleitfaden unter Empfehlungen - Erstellen Sie ein Design für Ihre Empfehlungsslider verwenden, um schnell ein Design zu erstellen, das das gleiche Farbschema und den gleichen Stil wie Ihr Webshop hat.
Klicken Sie auf Veröffentlichen, wenn Sie mit dem Styling zufrieden sind.
Sie können dies später einfach unter Empfehlungen - Designs im linken Menü ändern. Sie können sich auch auf diesen Leitfaden Vorlagen-Design zur Verwendung in Clerk für Designvorlagen beziehen.
2. Hinzufügen des Powersteps #
Gehen Sie zu Ihren Einrichtungsleitfäden unter Einstellungen → Klicken Sie auf Add to Basket Recommendations anzeigen, und klicken Sie auf Inhalt erstellen. Dieser Schritt erstellt automatisch die Inhalte mit allen erforderlichen Logiken, jedoch wird ein automatisch generiertes Design erstellt, das Sie je nach Ihren Vorlieben ändern müssen.
Design auswählen → Welches Design soll verwendet werden / wie soll die Überschrift lauten und wie viele Produkte sollen angezeigt werden (Wichtig: wird durch das Plugin bestimmt, auch wenn hier eine „Zahl“ gespeichert werden kann)
Nachdem alles festgelegt und ausgefüllt wurde, müssen Sie nun zum JTL5-Shop-Backend wechseln, und der Name des Powerstep-Inhalts, wo Sie ihn im Clerk-Plugin einfügen werden.
Plugin-Einstellungen im JTL-Backend
Exit Intent #
Das Exit Intent-Popup reagiert, wenn ein Besucher versucht, Ihren Webshop zu verlassen. Es erscheint und zeigt interessante Produkte an, wodurch ein abwandernder Besucher möglicherweise in einen kaufenden Kunden umgewandelt wird.
1. Erstellen Sie ein Standarddesign und Inhalte #
Das erste, was Sie tun müssen, ist, ein Standarddesign für Ihre Slider zu erstellen.
Sie können den Einrichtungsleitfaden unter Empfehlungen - Erstellen Sie ein Design für Ihre Empfehlungsslider verwenden, um schnell ein Design zu erstellen, das das gleiche Farbschema und den gleichen Stil wie Ihr Webshop hat.
Klicken Sie auf Veröffentlichen, wenn Sie mit dem Styling zufrieden sind.
Sie können dies später einfach unter Empfehlungen - Designs im linken Menü ändern. Sie können sich auch auf diesen Leitfaden Vorlagen-Design zur Verwendung in Clerk für Designvorlagen beziehen.
2. Hinzufügen der Exit Intent Empfehlungen #
Gehen Sie zu Ihren Einrichtungsleitfäden unter Einstellungen → Klicken Sie auf Add to Basket Recommendations anzeigen, und klicken Sie auf Inhalt erstellen. Dieser Schritt erstellt automatisch die Inhalte mit allen erforderlichen Logiken, jedoch wird ein automatisch generiertes Design erstellt, das Sie je nach Ihren Vorlieben ändern müssen. Für diese Logik empfehlen wir normalerweise die Besucherempfehlung.
Design auswählen → Welches Design soll verwendet werden / wie soll die Überschrift lauten und wie viele Produkte sollen angezeigt werden (Wichtig: wird durch das Plugin bestimmt, auch wenn hier eine „Zahl“ gespeichert werden kann).
Nachdem alles festgelegt und ausgefüllt wurde, müssen Sie nun zum JTL5-Shop-Backend wechseln, und der Name des Powerstep-Inhalts, wo Sie ihn im Clerk-Plugin einfügen werden.
Plugin-Einstellungen im JTL-Backend
Manuelles Hinzufügen von Slidern #
Derzeit gibt es zwei bekannte Methoden, um Ihre eigenen zusätzlichen Slider in JTL über das Clerk-Plugin hinzuzufügen:
- EasyTemplate
- OnPage Composer
EasyTemplate #
Sie können Ihre eigenen Slider einfach in das EasyTemplate integrieren, indem Sie die folgenden Schritte ausführen:
- Erstellung des Designs im Clerk.io-Backend (bestehende Designs können ebenfalls verwendet werden)
- Erstellung des Inhalts mit dem jeweiligen Fokus in Clerk.io, Kopieren des erforderlichen Span-Elements
- Hinzufügen eines HTML-Widgets im EasyTemplate
- Fügen Sie das Element in ein HTML-Widget im EasyTemplate ein.
Es ist wichtig, die Zeile data-snippets=’{json_encode($s360_clerk_snippets->get())}’ zum Clerk-HTML-Snippet aus Schritt 2 hinzuzufügen, damit die Sprachvariablen korrekt an Clerk übergeben werden! Darüber hinaus muss das Kontrollkästchen für „Smarty auswerten“ aktiviert sein.
OnPage Composer #
Ihre eigenen Slider können in den OnPage Composer mit den folgenden Schritten integriert werden:
- Erstellung des Designs im Clerk.io-Backend (bestehende Designs können ebenfalls verwendet werden)
- Erstellung des Inhalts mit dem jeweiligen Fokus in Clerk.io, Kopieren des erforderlichen Span-Elements
- Öffnen Sie den OnPage Composer
- Neuer Entwurf im OnPage Composer
- Ziehen Sie das Rich-Text-Element im OnPage Composer an die gewünschte Stelle → wählen Sie den Quellcode im Menü aus und fügen Sie die kopierten Span-Elemente hier hinzu
- Speichern → Veröffentlichen mit ausgewähltem Zeitraum
Hinweis: Je nach Position des „eigenen Sliders“ müssen möglicherweise zusätzliche CSS-Eigenschaften/Klassen hinzugefügt werden, wenn die Standardvorlage nicht verwendet wird.
Standarddesigns #
Warenkorb-Slider (easyTemplate) #
{% if products.length != 0 %}
<div class="et-widget-clerkslider-headline">
<div class="et-product-slider-headline">
<div class="et-textfield text-align-default et-widget-headline h2">{{ headline }}</div>
</div>
</div>
<div class="et-product-slider-wrapper row">
<div class="col p-0">
<div class="slick-slider-other is-not-opc">
<div id="et-clerk-slider-{{ snippets.settings.slider.id }}" class="et-product-slider-slider et-slider carousel slick-smooth-loading slider-no-preview slick-type-product">
{% for product in products %}
<div class="product-wrapper col">
<div id="result-wrapper_buy_form_{{ product.id }}" data-wrapper="true" class="productbox productbox-show-variations et-item-box productbox-column">
<div class="productbox-inner">
<div class="row">
<div class="col col-12">
<div class="productbox-image">
{% if product.top_article and product.top_article != false %}
<div class="ribbon ribbon-4 productbox-ribbon">
{{ snippets.ribbons.4 }}
</div>
{% endif %}
{% if product.on_sale and product.on_sale != false %}
<div class="ribbon ribbon-2 productbox-ribbon">
{{ snippets.ribbons.2 }}
</div>
{% endif %}
{% if product.in_stock and product.in_stock != false %}
<div class="ribbon ribbon-8 productbox-ribbon">
{{ snippets.ribbons.8 }}
</div>
{% endif %}
{% if product.in_stock and product.in_stock <= 0 %}
<div class="ribbon ribbon-7 productbox-ribbon">
{{ snippets.ribbons.7 }}
</div>
{% endif %}
{% if product.age and product.age <= snippets.settings.newProductmaxDays %}
<div class="ribbon ribbon-3 productbox-ribbon">
{{ snippets.ribbons.3 }}
</div>
{% endif %}
{% if product.average_rating and product.average_rating <= snippets.settings.topProductMinStars %}
<div class="ribbon ribbon-6 productbox-ribbon">
{{ snippets.ribbons.6 }}
</div>
{% endif %}
{% if product.age and product.age < 0 %}
<div class="ribbon ribbon-5 productbox-ribbon">
{{ snippets.ribbons.5 }}
</div>
{% endif %}
{% if product.vorbestellbardate and product.vorbestellbardate > 0 %}
<div class="ribbon ribbon-9 productbox-ribbon">
{{ snippets.ribbons.9 }}
</div>
{% endif %}
{% if product.age and product.age > 0 and product.stock <= 0 %}
<div class="ribbon ribbon-5 productbox-ribbon">
{{ snippets.ribbons.5 }}
</div>
{% endif %}
<div class="productbox-images list-gallery">
<a href="{{ product.url }}" title="{{ product.name }}">
<div class="productbox-image square square-image">
<div class="inner">
<picture>
<img src="{{ product.image }}" class="img-fluid" loading="lazy" alt="{{ product.name }}" />
</picture>
</div>
</div>
</a>
</div>
</div>
</div>
<div class="col col-12">
<div class="productbox-caption">
<div class="et-item-box-manufacturer productbox-manufacturer">
<span>{% if snippets.settings.showBrand %}{{ product.brand }}{% endif %}</span>
</div>
<div class="et-item-box-title productbox-title">
<a href="{{ product.url }}" class="text-clamp-2 link-discreet">
{{ product.name }}
</a>
</div>
<div class="et-item-box-rating productbox-rating">
{% if product.average_rating > 0 %}
<a class="rating" href="{{ product.url }}#tab-votes" title="{{ snippets.productRating }}: {{ product.average_rating }}/5">
{% if product.average_rating >= 5 %}
<i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i>
{% else %}
{% if product.average_rating >= 4 %}
<i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i>{% if product.average_rating > 4 %}<i class="{{ snippets.icons.ratingHalf }}"></i>{% else %}<i class="{{ snippets.icons.ratingEmpty }}"></i>{% endif %}
{% else %}
{% if product.average_rating >= 3 %}
<i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i>{% if product.average_rating > 3 %}<i class="{{ snippets.icons.ratingHalf }}"></i>{% else %}<i class="{{ snippets.icons.ratingEmpty }}"></i>{% endif %}<i class="{{ snippets.icons.ratingEmpty }}"></i>
{% else %}
{% if product.average_rating >= 2 %}
<i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i>{% if product.average_rating > 2 %}<i class="{{ snippets.icons.ratingHalf }}"></i>{% else %}<i class="{{ snippets.icons.ratingEmpty }}"></i>{% endif %}<i class="{{ snippets.icons.ratingEmpty }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i>
{% else %}
{% if product.average_rating >= 1 %}
<i class="{{ snippets.icons.rating }}"></i>{% if product.average_rating > 1 %}<i class="{{ snippets.icons.ratingHalf }}"></i>{% else %}<i class="{{ snippets.icons.ratingEmpty }}"></i>{% endif %}<i class="{{ snippets.icons.ratingEmpty }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i>
{% else %}
{% if product.average_rating > 0 %}
<i class="{{ snippets.icons.ratingHalf }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i>
{% endif %}
{% endif %}
{% endif %}
{% endif %}
{% endif %}
{% endif %}
</a>
{% endif %}
</div>
{% if product.in_stock %}
{% if product.stock >= snippets.settings.storageLightsGreen%}
<div class="delivery-status">
<ul class="list-unstyled">
<li>
<span class="status status-2">
<span class="{{snippets.settings.storageLightIcon}} status-icon"> </span>
<span class="status-text">{{snippets.settings.storageLightTextGreen}}</span>
</span>
</li>
</ul>
</div>
{% endif %}
{% if product.stock > snippets.settings.storageLightsRed and product.stock < snippets.settings.storageLightsGreen %}
<div class="delivery-status">
<ul class="list-unstyled">
<li>
<span class="status status-1">
<span class="{{snippets.settings.storageLightIcon}} status-icon"> </span>
<span class="status-text">{{snippets.settings.storageLightTextYellow}}</span>
</span>
</li>
</ul>
</div>
{% endif %}
{% if product.stock == snippets.settings.storageLightsRed%}
<div class="delivery-status">
<ul class="list-unstyled">
<li>
<span class="status status-0">
<span class="{{snippets.settings.storageLightIcon}} status-icon"> </span>
<span class="status-text">{{snippets.settings.storageLightTextRed}}</span>
</span>
</li>
</ul>
</div>
{% endif %}
{% endif %}
<div class="et-item-box-price">
<div class="price_wrapper">
{% if product.has_variations or product.bulk_prices != 0 %}
<span class="price_label pricestarting">
{{ snippets.priceStarting }}
</span>
{% endif %}
<div class="price productbox-price {% if product.on_sale %} special-price{% endif %}">
<span>{{ product.price | money }} {{ globals.currency_symbol }} <span class="footnote-reference">*</span></span>
</div>
{% if product.on_sale %}
<div class="price-note et-old-price">
<div class="instead-of old-price">
<small class="text-muted-util">
<del class="value">{{ product.original_price | money }} {{ globals.currency_symbol }}</del>
</small>
</div>
</div>
{% endif %}
{% if product.base_price > 0 %}
<div class="price-note">
<span class="value">{{ product.base_price | money }} {{ globals.currency_symbol }} {{ snippets.vpePer }} {{ product.base_price_unit }}</span>
</div>
{% else %}
<div class="price-note"> </div>
{% endif %}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
<div class="et-slider-nav" id="clerk-slider-nav-{{ snippets.settings.slider.id }}">
<div class="et-slider-nav-prev enabled slick-arrow slick-hidden" id="clerk-slider-prev-{{ snippets.settings.slider.id }}">
<i class="{{ snippets.icons.sliderPrevious }}"></i>
</div>
<div class="et-slider-nav-next enabled slick-arrow slick-hidden" id="clerk-slider-next-{{ snippets.settings.slider.id }}">
<i class="{{ snippets.icons.sliderNext }}"></i>
</div>
</div>
</div>
</div>
</div>
<script>
$(function() {
$("#et-clerk-slider-{{ snippets.settings.slider.id }}").slick({{ snippets.settings.slider.settings }});
$.evo.popover();
});
</script>
{% endif %}
Warenkorb-Slider (Nova) #
{% if products.length != 0 %}
<div class="slick-slider-other is-not-opc">
<div class="hr-sect h2">
{{ headline }}
</div>
<div id="slick-slider-{{ snippets.settings.slider.id }}" class="carousel-arrows-inside carousel slick-smooth-loading slider-no-preview slick-type-product slick-lazy" data-slick-type="product-slider">
{% for product in products %}
<div class="product-wrapper col">
<div id="result-wrapper_buy_form_{{ product.id }}" data-wrapper="true" class="productbox productbox-column">
<div class="productbox-inner">
<div class="row">
<div class="col col-12">
<div class="productbox-image">
<div class="productbox-images">
<a href="{{ product.url }}" title="{{ product.name }}">
<div class="productbox-image square square-image">
<div class="inner">
<picture>
<img src="{{ product.image }}" class="img-fluid" loading="lazy" alt="{{ product.name }}" />
</picture>
</div>
</div>
{% if product.top_article and product.top_article != false %}
<div class="ribbon ribbon-4 productbox-ribbon">
{{ snippets.ribbons.4 }}
</div>
{% endif %}
{% if product.on_sale and product.on_sale != false %}
<div class="ribbon ribbon-2 productbox-ribbon">
{{ snippets.ribbons.2 }}
</div>
{% endif %}
{% if product.in_stock and product.in_stock != false %}
<div class="ribbon ribbon-8 productbox-ribbon">
{{ snippets.ribbons.8 }}
</div>
{% endif %}
{% if product.in_stock and product.in_stock <= 0 %}
<div class="ribbon ribbon-7 productbox-ribbon">
{{ snippets.ribbons.7 }}
</div>
{% endif %}
{% if product.age and product.age <= snippets.settings.newProductmaxDays %}
<div class="ribbon ribbon-3 productbox-ribbon">
{{ snippets.ribbons.3 }}
</div>
{% endif %}
{% if product.average_rating and product.average_rating <= snippets.settings.topProductMinStars %}
<div class="ribbon ribbon-6 productbox-ribbon">
{{ snippets.ribbons.6 }}
</div>
{% endif %}
{% if product.age and product.age < 0 %}
<div class="ribbon ribbon-5 productbox-ribbon">
{{ snippets.ribbons.5 }}
</div>
{% endif %}
{% if product.vorbestellbardate and product.vorbestellbardate > 0 %}
<div class="ribbon ribbon-9 productbox-ribbon">
{{ snippets.ribbons.9 }}
</div>
{% endif %}
{% if product.age and product.age > 0 and product.stock <= 0 %}
<div class="ribbon ribbon-5 productbox-ribbon">
{{ snippets.ribbons.5 }}
</div>
{% endif %}
</a>
</div>
</div>
</div>
<div class="col col-12">
<div class="productbox-title">
<a href="{{ product.url }}" title="{{ product.name }}" class="text-clamp-2">
{{ product.name }}
</a>
</div>
{% if product.reviews_avg > 0 %}
<a class="rating" href="{{ product.url }}#tab-votes" title="{{ snippets.productRating }}: {{ product.reviews_avg }}/5">
{% if product.reviews_avg >= 5 %}
<i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i>
{% else %}
{% if product.reviews_avg >= 4 %}
<i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i>{% if product.reviews_avg > 4 %}<i class="{{ snippets.icons.ratingHalf }}"></i>{% else %}<i class="{{ snippets.icons.ratingEmpty }}"></i>{% endif %}
{% else %}
{% if product.reviews_avg >= 3 %}
<i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i>{% if product.reviews_avg > 3 %}<i class="{{ snippets.icons.ratingHalf }}"></i>{% else %}<i class="{{ snippets.icons.ratingEmpty }}"></i>{% endif %}<i class="{{ snippets.icons.ratingEmpty }}"></i>
{% else %}
{% if product.reviews_avg >= 2 %}
<i class="{{ snippets.icons.rating }}"></i><i class="{{ snippets.icons.rating }}"></i>{% if product.reviews_avg > 2 %}<i class="{{ snippets.icons.ratingHalf }}"></i>{% else %}<i class="{{ snippets.icons.ratingEmpty }}"></i>{% endif %}<i class="{{ snippets.icons.ratingEmpty }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i>
{% else %}
{% if product.reviews_avg >= 1 %}
<i class="{{ snippets.icons.rating }}"></i>{% if product.reviews_avg > 1 %}<i class="{{ snippets.icons.ratingHalf }}"></i>{% else %}<i class="{{ snippets.icons.ratingEmpty }}"></i>{% endif %}<i class="{{ snippets.icons.ratingEmpty }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i>
{% else %}
{% if product.reviews_avg > 0 %}
<i class="{{ snippets.icons.ratingHalf }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i><i class="{{ snippets.icons.ratingEmpty }}"></i>
{% endif %}
{% endif %}
{% endif %}
{% endif %}
{% endif %}
{% endif %}
</a>
{% else %}
<div class="rating productbox-rating-empty"></div>
{% endif %}
<div>
<div class="price_wrapper">
{% if product.has_variations or product.bulk_prices != 0 %}
<span class="price_label pricestarting">
{{ snippets.priceStarting }}
</span>
{% endif %}
<div class="price productbox-price {% if product.on_sale %} special-price{% endif %}">
<span>{{ product.price | money_eu }} {{ globals.currency_symbol }} <span class="footnote-reference">*</span></span>
</div>
{% if product.on_sale %}
<div class="price-note">
<div class="instead-of old-price">
<small class="text-muted-util">
<del class="value">{{ product.original_price | money_eu }} {{ globals.currency_symbol }}</del>
</small>
</div>
</div>
{% endif %}
{% if product.base_price > 0 %}
<div class="price-note">
<span class="value">{{ product.base_price | money_eu }} {{ globals.currency_symbol }} {{ snippets.vpePer }} {{ product.base_price_unit }}</span>
</div>
{% else %}
<div class="price-note"> </div>
{% endif %}
</div>
</div>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
<script>
$(function() {
$.evo.generateSlickSlider();
$.evo.popover();
});
</script>
{% endif %}
Diese Seite wurde von einer hilfreichen KI übersetzt, daher kann es zu Sprachfehlern kommen. Vielen Dank für Ihr Verständnis.