Rozetler

Rozet, kartın üzerinde görünen küçük etikettir: "İndirim", "Yeni", "Tükendi". Tasarımcıda rozet, kendi koşulu olan bir öğedir; bu sayfa rozetin ne gösterebileceğini, ne zaman görüneceğini ve nerede duracağını anlatır.

Panelde nerede

Product Cards → kart → Designer (Tasarımcı) → katman ağacında Add element → Badge (Rozet). Rozeti genellikle Image area (Görsel alanı) içine koyarsınız; böylece görselin üstüne biner.

Rozet ne gösterir

Rozetin Badge content (Rozet içeriği) alanı üç kaynaktan birini seçer:

Kaynak	Ne gösterir	Örnek
Fixed text (Sabit metin)	Yazdığınız metin; en fazla 40 karakter	Yeni, Çok satan
Discount % (İndirim yüzdesi)	Liste fiyatı ile satış fiyatından hesaplanan indirim; liste fiyatı yoksa beslemedeki indirim oranı	-25%
Product field (Ürün alanı)	Seçtiğiniz bir ürün alanının değeri	Marka, attr.kampanya

İçerik boş çıkarsa (indirim sıfırsa ya da alan boşsa) rozet hiç çizilmez; boş kutu bırakmaz. İndirim yüzdesi her zaman - işaretiyle ve tam sayıya yuvarlanmış yazılır: -25%.

Bunun çalışması için beslemenizde hem satış hem liste fiyatı ya da bir indirim oranı olmalıdır. Yalnızca tek fiyat gönderiyorsanız indirim hesaplanamaz ve rozet görünmez. Bkz. Alan Eşleştirme.

Rozet ne zaman görünür: koşullar

Yeni bir Discount % rozeti hazır bir koşulla gelir: isOnSale is true. Koşulu olmayan bir indirim rozeti her tam fiyatlı üründe -0% yazardı; bu yüzden başlangıç değeri doğru kurulur. Visibility bölümünde koşulu değiştirebilir, ekleyebilir ya da silebilirsiniz (en fazla 8 koşul, hepsi sağlanmalı).

Rozetlerde işinize yarayan türetilmiş işaretler:

İşaret	Ne zaman doğru
isOnSale	Liste fiyatı satış fiyatından büyük. Beslemenin kendi "indirimde" işaretine bakılmaz; çünkü her ürünü indirimli işaretleyen beslemeler yaygındır
hasDiscount	İndirimde ya da beslemedeki indirim oranı sıfırdan büyük
isOutOfStock	Ürün stokta yok
hasRating, hasSecondImage, hasSwatches	Puan, ikinci görsel, renk kardeşi var

Ayrıca doğrudan ürün alanlarına koşul kurabilirsiniz:

• Yeni ürün: isNew is true. Besleme böyle bir alan taşımıyorsa bu rozet hiç görünmez.
• Çok satan: isBestseller is true.
• Tükendi: isOutOfStock is true.
• Düşük stok: stock less than 4, ayrı bir Text öğesinde (ön ek Son , son ek adet, alan stock). Sayı kutusunu boş bırakırsanız karşılaştırma 0'a göre yapılır ve panel uyarır.

Beslemeniz isNew ya da isBestseller taşımıyorsa bunun yerine bir Yeni Gelenler stratejili widget kurup başlığında belirtebilirsiniz; rozet yerine bölüm başlığı kullanmak olur.

Konum

Rozetin görselin neresinde duracağını Style → Position (Konum) ayarları belirler: insetTop, insetRight, insetBottom, insetLeft ve katman sırası zIndex. Köşe için iki değer yeterlidir: sol üst için insetTop ve insetLeft değerlerini 8px yapın. Konum ayarları yalnızca Image area içindeki öğelerde sunulur; rozeti başka bir kapsayıcıya koyarsanız normal akışta durur.

Aynı köşede birden fazla rozet gerekiyorsa aralarına boşluk koymak için onları bir Group içine alıp o Group'u konumlayın.

Renk

Yeni rozetin başlangıç rengi sabittir (kırmızı zemin, beyaz yazı). Markanızın indirim rengini kullanmak için Colour grubunda background alanına var(--selwise-sale, #e11d48), color alanına var(--selwise-sale-text, #ffffff) yazın; marka rengi seçici de aynı biçimi üretir. İndirim rengi bilinçli olarak ayrı bir değişkendir: marka renginden türetilen bir indirim rengi, özellikle siyah markalarda, bulanık çıkar. Değişkenler için: Marka Teması.

Kaç rozet

Bir kartta ikiden fazla rozet göstermeyin. Üç etiketli bir kart, hiçbirinin fark edilmediği bir karttır.

Eski kartlar

Tasarımcıdan önce yapılmış bir kartta show badges ayarı üç sabit rozeti ürünün kendi işaretlerinden (indirim, yeni, çok satan) çizerdi. Böyle bir kartı Convert current card ile dönüştürürseniz bu üç rozet, koşullu üç rozet öğesine çevrilir ve görünüm değişmez; sonra her birini ayrı ayrı düzenlersiniz. Bkz. Kart Tasarımcısı.