Örnek ürün: https://customix-demo-store.myshopify.com/products/jd002-god-says-i-am-name-letter-in-bible-toile-de-jouy-style-personalized-jewelry-dish

1. Adım: Tasarım varlıklarını hazırlayın

Metin Sayısına Göre Dinamik Düzen Görüntüleme özelliğini etkinleştirmek için iki set tasarım varlığı hazırlamanız gerekir. Bu varlıklar, müşterilerin girdiği karakterlere göre farklı düzenlerin nasıl görüntüleneceğini belirler.

a. Büyük alfabe görselleri (ana karakter)

Bu varlık seti, düzende görüntülenen büyük ana karakteri kontrol eder.
Dosya sırası yapısı:

  • 1. dosya → Boş görsel (zorunlu yer tutucu)
  • 2–27. dosyalar → Küçük harfler a–z
  • 28–54. dosyalar → Büyük harfler A–Z
  • 55–64. dosyalar → Rakamlar 0–9 (isteğe bağlı)

b. Quote düzeni klasörleri

1. bölümdeki mantıkla aynı şekilde, 54 karakter durumuna karşılık gelen 54 klasör hazırlayın:

  • Küçük harfler için 27 klasör a–z
  • Büyük harfler için 27 klasör A–Z

Her klasör, belirli bir karakter için Quote düzenini temsil eder.

Quotes varlığı

2. Adım: Şablona öğeleri ekleyin

Tüm tasarım varlıklarını hazırladıktan sonra sıradaki adım, bu öğeleri bir şablona eklemek ve düzenleri ayarlamaktır.

a. Varlıkları Varlıklar kitaplığına yükleyin

  • Hazırladığınız tüm dosya ve klasörleri Varlıklar → Görseller bölümüne yükleyin
  • Klasör yapısının (backgrounds, alphabets, quotes) doğru yüklendiğinden emin olun
Malzemeleri Varlıklara yükleme

b. Örnek şablon oluşturun

Yeni bir şablon oluşturun ve öğe eklemeye başlayın; ilk öğe, 3 renkli bir Arka plan olsun: mavi, kırmızı, siyah.
Ardından 3 Alphabet katmanı ekleyin, bu katmanları yeniden boyutlandırıp tasarımda istediğiniz konuma yerleştirin.

Alphabet katmanları ekleme

Sonra aynı 3 renge karşılık gelen 3 Quote katmanı ekleyin; bunları da Alphabet katmanlarına göre hizalayıp konumlandırın

Quotes katmanı ekleme

c. Düzen oluşturun

6 katmanın tümünü seçin ve bunları Layout 1 olarak gruplamak için Düzen oluşturun simgesine tıklayın.

Düzen olarak gruplama

Layout 1'e tıklayın ve aynı yapıya sahip Layout 2'yi çoğaltmak için Ctrl + C and Ctrl + V tuş kombinasyonunu kullanın

Layout 2'ye çoğaltma

Ardından Layout 2'yi genişletin, ilk karaktere karşılık gelen 6 katmanı seçin ve aşağıdaki referans görselde gösterildiği gibi ikinci karakter için 6 ek katman oluşturmak üzere yine Ctrl + C and Ctrl + V kombinasyonunu kullanın.

2. karakter için katmanlar oluşturma

Bir sonraki yapılandırma adımına geçmeden önce mevcut yapıyı korumak için şablonu kaydedin

3. Adım: Seçenek seti eşlemesi ve mantığı

Bu adımda, müşterilerin girdiği metne göre düzenleri, alfabeleri ve Quote'ları otomatik olarak değiştirecek seçenek setlerini ve mantığı yapılandıracağız.

a. Metin alanı seçeneği ekleyin

  • Seçenek setleri → Ekleyin → Metin alanı yolunu izleyin
  • Bu alan, müşterilerin metinlerini (ör. isim) girmesi için kullanılacaktır
Metin alanı ekleme

b. Karakter tabanlı renk örneklerini etkinleştirin

Metin alanı ayarlarında Renk örneklerini karakterlere göre gösterin seçeneğini etkinleştirin, ardından şu atamaları yapın:

  • Blue Alphabet → 1. karakter
  • Blue Alphabet 2 → 2. karakter
Karakter tabanlı renk örneklerini etkinleştirme

c. Metin uzunluğuna göre düzen değiştirmeyi etkinleştirin

Düzen renk örneklerini metin uzunluğuna göre gösterin özelliğini etkinleştirin; böylece düzenler, müşterinin girdiği karakter sayısına göre otomatik olarak ayarlanır.

  • Metin uzunluğu = 1 karakter → Layout 1'i göster
  • Metin uzunluğu = 2 karakter → Layout 2'yi göster
Metin uzunluğuna göre düzen değiştirmeyi etkinleştirme

d. Karakter senkronizasyonu için Genel kimlik ayarlayın

Şimdi, müşterilerin girdiği ilk karakterden etkilenecek tüm katmanlar için Genel kimliği ayarlamanız gerekir:

  • Blue Alphabet
  • Black Alphabet
  • Red Alphabet
  • Blue Quotes
  • Black Quotes
  • Red Quotes

⚠️ Quote seçenek setlerinin içindeki iç içe seçenek değerlerini seçmeyin ve Genel kimliği = 1 olarak ayarlayın
Blue Alphabet, A karakterine geçtiğinde Genel kimliği = 1 olan diğer tüm katmanlar otomatik olarak karşılık gelen A değerine geçer. Aynı işlemi ikinci karakter için de tekrarlayın.

Aynı düzeydeki seçenek seti için Genel kimlik ayarlama

e. Arka plan rengine göre görüntüleme koşullarını ayarlayın

Renklerin doğru eşleşmesini sağlamak için tüm Black katmanlarını (Alphabet + Quotes) seçin ve şu koşulu ekleyin: Yalnızca Background = Black olduğunda göster

Arka plan rengine göre görüntüleme koşulunu ayarlama

Aynı ayarı kırmızı ve mavi karakterler için de tekrarlayın. Bu, seçilen arka plana göre yalnızca doğru renkteki varlıkların görüntülenmesini sağlar.

f. Gereksiz seçenekleri gizleyin

Gereksiz seçenekleri toplu gizleme

Nihai sonuç

Müşteri 1 karakter girdiğinde (ör. c) yalnızca Layout 1 gösterilir ve C için Quote ve alfabe görüntülenir

1 karakter yazma sonucu

Müşteri 2 karakter girdiğinde (ör. cd) Layout 2 gösterilir; ardından C ve D için Quote'lar ve alfabeler buna uygun şekilde görüntülenir.

2 karakter yazma sonucu

Güncelleme tarihi: 18/08/2026