Häufig gestellte Fragen

Hinzufügen eines benutzerdefinierten Abzeichens #

Dieser Leitfaden zeigt Ihnen, wie Sie ein benutzerdefiniertes Abzeichen zum Empfehlungen-Slider hinzufügen. Der Prozess ist ähnlich für Omnisearch, die Suchseite und Live-Suchcode-Designs.

1. Finden Sie das Attribut, das Sie als Regel verwenden möchten, um das Abzeichen anzuzeigen. Zum Beispiel ‘on_sale’ oder das Produkt, das sich in einer bestimmten Kategorie wie ‘Black_friday’ befindet.

2. Bearbeiten Sie das gewählte Design für Empfehlungen oder Omnisearch.

3. Fügen Sie den Code im gewählten Bereich ein, normalerweise innerhalb des div mit class='clerk-product-image-wrapper'. Im folgenden Beispiel verwenden wir das Kategorienattribut, um das Abzeichen anzuzeigen, wobei 123 die Kategorie-ID der Black Friday-Kategorie ist.

{% for item in products %}
    <div class="clerk-product-wrapper clerk-slider-content">
        <div class="clerk-product-image-wrapper">
            {% if item.categories contains 123  %}
                <div class="clerk-product-badge-sale clerk_BF_badge">
                    BLACK FRIDAY -20%
                </div>
            {% endif %}
                
            ...

        </div>
    </div>
{% endfor %}

Fügen Sie schließlich Ihr Badge-CSS hinzu, um das Badge-Design anzupassen, z.B.:

.clerk_BF_badge{
  background-color:#333333;
  font-size: 15px;
  color: #F4841F;
  top: 0px;
}