Ürün Kartlarına Genel Bakış

Ürün kartı, önerilerde ve arama sonuçlarında bir ürünün nasıl görüneceğini tanımlar. Kartı tek yerde tasarlar, her yerde kullanırsınız.

Panelde nerede

Sol menüde Tasarım → Ürün Kartları (Design → Product Cards), adres /dashboard/definitions. Bu ekran bir modül satın almayı gerektirmez, her hesapta vardır; kanala bağlıdır (kanal seçili değilse No Site Selected uyarısı çıkar).

Kart nerede kullanılır

Yüzey	Kart seçimi
Öneri widget'ları	Recommendations formunun görüntü bölümündeki Product Card Template (Ürün Kartı Şablonu) alanı
Arama sonuçları	Search yapılandırmasında sonuç ayarlarındaki Product Card Template alanı; seçilirse alttaki varsayılan yerleşim ayarlarını geçersiz kılar

Kart seçmezseniz kanalın varsayılan kartı kullanılır: kart formundaki Set as default product card for this site (Bu site için varsayılan ürün kartı olarak ayarla) kutusunu işaretlediğiniz kart. Bir kanalda tek varsayılan olur; yenisini işaretlemek öncekinin işaretini kaldırır. Hiçbir kart varsayılan değilse widget kendi yerleşik kartını çizer. Kart listesinde varsayılan kartın adının yanında yıldız görünür.

Kart listesi

Kartlar ızgarada, kartın kendisi çizilerek gösterilir: her hücrede kart, kataloğunuzdaki ilk ürünle ve marka temanızla mağazadaki motorla çizilir. Altında ad, varsayılan kartsa Default card (Varsayılan kart) rozeti, kartın nasıl çizildiği (Designer / Own code), açıksa varyant seçici türü ve kartın kaç öneri şeridinde ve aramada kullanıldığı yazar. Menüde Edit (Düzenle), Make default (Varsayılan yap), Duplicate (Kopyala, kopya hiçbir zaman varsayılan olmaz) ve Delete (Sil) bulunur. Aramayı ad ya da açıklamayla yaparsınız; süzgeç kartları çizim biçimine göre ve Unused (Kullanılmayan) olarak ayırır.

Create Product Card ile yeni kart açılır. Yeni kart boş bir tuval değil, Standard hazır tasarımıyla açılır: hemen düzenleyebileceğiniz gerçek bir kart görürsünüz.

Kartı kim düzenleyebilir

Kartları Admin rolü görür, oluşturur, düzenler ve siler; ayrıca özel HTML, CSS ve JavaScript alanlarını (My own code ve tasarımcının Custom CSS kutusu) yalnızca kod düzenleme yetkisi olan kullanıcı düzenler. Marketing rolü kartları görebilir ama oluşturamaz, düzenleyemez, silemez; kaydetmeye çalışırsa 403 alır. JavaScript yazmak ayrıca satın alınan Custom Card Code modülüne bağlıdır; hesapta yoksa API 402 döner ve mesaj sizi hesap yöneticinize yönlendirir. HTML ve CSS için modül gerekmez.

Üç düzeyde çalışırsınız

Düzey	Ne yaparsınız	Sayfa
Designer (Tasarımcı)	Kartı öğe öğe tasarlarsınız: görsel, metin, fiyat, rozet, düğme, renk örnekleri; koşullar ve animasyonlarla	Kart Tasarımcısı
My own code (Kendi kodum)	Tasarımcının veremediği bir düzen için kartın HTML, CSS ve JavaScript'ini kendiniz yazarsınız	Özel Kart Oluşturma
Yapay zekâ	Kartı bir cümleyle tasarlatır ya da düzenletirsiniz	Yapay Zekâ ile Kart Tasarımı

Editör başlığındaki Drawn by (Kartı çizen) anahtarı hem açık olan editörü hem yayınlananı belirler: Designer (Tasarımcı) ya da My own code (Kendi kodum). Özel CSS her iki durumda da uygulanır; özel HTML ve JavaScript yalnızca My own code seçiliyken çizilir ve çalışır. Aynı satırdaki Option chooser (Seçenek seçici) seçenekli ürünlerde beden seçicinin nasıl çizileceğini belirler; bkz. Sepete Ekleme.

Kaydetme ve kullanıldığı yerler

Save Changes (Değişiklikleri Kaydet) ya da ⌘S / Ctrl+S kartı kaydeder ve sizi editörde bırakır; düğmenin yanındaki durum Unsaved changes (Kaydedilmemiş değişiklikler) ya da Saved (Kaydedildi) der, kaydetmeden sekmeyi kapatırsanız tarayıcı sorar. Kartın adının altında kartı kullanan öneri şeritleri ve arama listelenir: bir kart paylaşılır, kaydettiğiniz değişiklik hepsine aynı anda yansır. Kart seçmeyen şeritler varsayılan kartı kullanır.

Marka teması

Kart renkleri, köşeleri ve yazı tipi varsayılan olarak marka temanızdan gelir. Kart seviyesinde ayrı ayar yapmadığınız sürece marka renginizi değiştirdiğinizde tüm kartlar birlikte değişir. Bkz. Marka Teması.

Canlı önizleme

My own code seçiliyken sağdaki Live Preview kartı mağazadaki çizim hattıyla çizer: Single (tek kart) ve Grid (dörtlü sıra), masaüstü ve mobil genişlik, açık ve koyu mağaza zemini arasında geçiş yapabilirsiniz. Store products (Mağaza ürünleri) kartı kendi kataloğunuzdaki ürünlerle, seçenekleriyle birlikte çizer; Sample (Örnek) sabit örnek ürünlere geçer. Edge cases (Zor durumlar) uzun başlıklı (mağaza ürünlerinde kataloğunuzun en uzun başlığı), görselsiz, indirimsiz ve stokta olmayan ürünleri koyar. Varyant seçici önizlemede de mağazadaki gibi çizilir; seçenekli bir ürün yoksa bunu söyleyen bir not çıkar. Tasarımcıda ayrı önizleme yoktur: tuval aynı hattı kullanır ve üstündeki oklarla aynı ürünler arasında gezersiniz. Kendi JavaScript'iniz önizlemede çalışmaz.

Neden boş, neden gri

Gördüğünüz	Sebep
No Site Selected	Kartlar kanala aittir; üst çubuktan kanal seçin
No Product Cards Yet	Henüz kart yok; Create Product Card ile başlayın
Kaydet 403 veriyor	Rolünüz kart düzenleyemiyor (Marketing); Admin gerekir
My own code seçilemiyor ya da editörde yalnızca Slot bindings var	Rolünüzün kod düzenleme yetkisi yok (başlık Code & Bindings olur)
Option chooser açık ama kartta seçici yok	Üründe iki ya da daha fazla seçenek yok; seçeneksiz üründe mağazada da çizilmez. Önizlemede Sample (Örnek) seçenekli örnek ürünleri koyar
JavaScript kaydı 402	Hesapta Custom Card Code modülü yok
Kartta tasarım yerine eski görünüm çıkıyor	My own code seçili ve HTML dolu; tasarım yayınlanmaz

Eski kartlar

Tasarımcıdan önce oluşturulmuş bir kart alan listesinden çizilmeye devam eder; bir tüccar bilerek dönüştürmeden mağazadaki görünümü hiç değişmez. Böyle bir kartı açınca Design sekmesi Convert current card (Mevcut kartı dönüştür) seçeneğini sunar: bugünkü alan listesini düzenlenebilir öğelere çevirir ve mağazada şu an görünenin aynısını üretir. Dönüştürüp kaydedene kadar hiçbir şey değişmez. Bkz. Hazır Tasarımlar.