Bu ayarlar nerede bulunur
Bu ayarlar pazar başına yapılandırılır ve bir pazar içinde tüm sayfaları aynı anda etkiler. Düzenleyiciyi açın, sol kenar çubuğundaki pazar sekmesinden (ülke bayrağı simgesi) bir pazar seçin, ardından Ayarlar sekmesine (dişli simgesi) tıklayın. Değişiklikler seçtiğiniz pazara uygulanır ve Yayınla butonuna tıkladığınızda yayına girer. Her ayarın tam listesi için Düzenleyici ayarları referansı bölümüne bakın.
Renk şemaları
Storeep, en fazla 9 renk şemasından oluşan bir paleti kullanır. Mağazanızdaki her bölüm, blok ve bileşen bu şemalardan birine numarasıyla (1'den 9'a kadar) başvurur. Bir şemanın renklerini değiştirmek, o şemayı kullanan her bölümü tüm sayfalarda anında günceller.
Her şemanın içindeki renk rolleri
Her şema, tümü hex renk değerleri olarak ayarlanan şu renk rollerini tanımlar:
- Arka plan: ana bölüm arka plan rengi.
- İç arka plan: bölüm içindeki kartlar ve iç içe geçmiş içerik alanları için kullanılan, hafifçe tonlanmış bir arka plan.
- Başlık rengi: başlık metninin rengi.
- Gövde metin rengi: paragraf metninin rengi.
- Vurgulanan metin rengi: fiyatlar, tasarruf rozetleri ve geri sayım sayacı değerleri için kullanılan, öne çıkarılmış bir metin rengi. Genellikle paletteki en koyu veya en belirgin ton.
- Bağlantı rengi: varsayılan köprü rengi.
- Bağlantı üzerine gelme rengi: bir alışverişçi üzerine geldiğinde köprünün rengi.
- Kenarlık rengi: öğe kenarlıkları ve ayırıcı çizgileri için kullanılan renk.
- Çerçeve rengi: odak halkaları, klavye seçim vurguları ve normal kenarlıklardan daha fazla öne çıkması gereken vurgu çerçeveleri için kullanılan renk.
- Gölge rengi: kutu gölgeleri için kullanılan renk (genellikle bir miktar şeffaflıkla).
- Birincil buton arka planı: birincil butonların dolgu rengi.
- Birincil buton metni: birincil butonların üzerindeki etiket rengi.
- Birincil buton kenarlığı: birincil butonların kenarlık rengi.
- Birincil buton üzerine gelme arka planı: üzerine gelindiğinde birincil butonun dolgu rengi.
- Birincil buton üzerine gelme metni: üzerine gelindiğinde birincil butonun etiket rengi.
- Birincil buton üzerine gelme kenarlığı: üzerine gelindiğinde birincil butonun kenarlık rengi.
- İkincil buton arka planı: ikincil butonların dolgu rengi.
- İkincil buton metni: ikincil butonların üzerindeki etiket rengi.
- İkincil buton kenarlığı: ikincil butonların kenarlık rengi.
- İkincil buton üzerine gelme arka planı: üzerine gelindiğinde ikincil butonun dolgu rengi.
- İkincil buton üzerine gelme metni: üzerine gelindiğinde ikincil butonun etiket rengi.
- İkincil buton üzerine gelme kenarlığı: üzerine gelindiğinde ikincil butonun kenarlık rengi.
- Giriş alanı arka planı: form giriş alanlarının arka plan rengi.
- Giriş alanı metin rengi: form giriş alanlarının içindeki metin rengi.
- Giriş alanı kenarlık rengi: form giriş alanlarının kenarlık rengi.
- Giriş alanı etiket rengi: form alanlarının üzerindeki etiket metni rengi.
- Giriş alanı odak arka planı: bir alışverişçi alana odaklandığında veya üzerine geldiğinde giriş alanının arka plan rengi.
Güçlü renk şemaları için ipuçları
- Çoğu bölümde Arka plan için nötr, açık bir renk kullanın ve canlı renkleri hero ile harekete geçirici mesaj bölümlerinde kullanılan tek bir vurgu şemasına ayırın.
- Birincil buton arka planınızı bölümün Arka planından görsel olarak farklı kılın, çünkü butonun net bir şekilde öne çıkması gerekir.
- İç arka planı ana Arka planın çok hafif bir tonu olarak tutun, böylece kart arka planları rahatsız edici olmadan ayırt edilebilir olur.
- Gövde metin rengi ile Arka plan arasında ve Birincil buton metni ile Birincil buton arka planı arasında en az 4,5:1 kontrast hedefleyin.
Tipografi
Dört yazı tipi rolü, tüm sayfalardaki tipografiyi kontrol eder. Her rol, mevcut kitaplıktan bir yazı tipi ailesine eşlenir.
- Gövde: paragraf metni ve açıklamalar için birincil yazı tipi.
- Başlık: mağazanın tamamındaki tüm başlıklar için yazı tipi.
- Alt başlık: ikincil başlıklar ve bölüm alt başlıkları için yazı tipi, başlık ve gövde stillerini birbirine bağlar.
- Vurgu: fiyatlar, rozetler ve dekoratif vurgular için stilistik bir yazı tipi.
Mevcut yazı tipleri arasında şunlar bulunur: Inter, Helvetica, SF Mono, New York, System UI, Roboto, Open Sans, Lato, Montserrat, Poppins, Raleway, Nunito, Merriweather, Playfair Display, Lora, PT Sans, PT Serif, Quicksand, Space Grotesk, DM Sans, Syne, Manrope, Outfit, Urbanist, Oswald, Bebas Neue, Abel, Abril Fatface ve Acme.
Arapça içerik bulunan mağazalarda yazı tipleri otomatik olarak eşleşen Arapça karşılıklarıyla eşleştirilir: örneğin Inter, Cairo ile ve Poppins, Tajawal ile eşleştirilir. Arapça yazı tipini ayrıca seçmeniz gerekmez.
Sayfa genişliği
Global Sayfa Genişliği ayarı, ana içerik ızgarasının piksel cinsinden maksimum genişliğini kontrol eder. Sayfa genişliğine ayarlanan bölümler bu değerle sınırlandırılır; Tam olarak ayarlanan bölümler ise her zaman tüm görünüm alanını kaplar. Mevcut değerler: 900, 1000, 1100, 1200 (varsayılan), 1300 ve 1400 px. Seçilen genişlikten daha dar görünüm alanlarında bölümler ekranın %100'ünü dolduracak şekilde otomatik olarak küçülür.
Logo
Logo, Üst Bilgi bölümünün logo bloğunun içinde ve alt bilgideki Hakkımızda bloğunun içinde ayarlanır. Kontrol panelindeki logo bloğuna tıklayın, ardından logonuzu cihazınızdan yüklemek veya medya kitaplığınızdan seçmek için + Medya ekle veya + Görsel ekle butonuna tıklayın. Yükledikten sonra görüntüleme genişliğini (20-300 px) ve yüksekliğini (20-300 px) ayarlayın; en boy oranını korumak için diğer boyut otomatik olarak ölçeklenir.
Favicon
Favicon, düzenleyicide Ayarlar → Marka kimliği bölümünde ayarlanır. Favicon alanına tıklayın ve bir görsel yükleyin (önerilen: kare bir görsel). Favicon, tarayıcı sekmelerinde ve yer imlerinde görünür.
Gövde arka plan görseli
Yine Ayarlar → Marka kimliği bölümünde: isteğe bağlı olarak tüm sayfa için bir arka plan görseli ayarlayabilirsiniz. Nasıl ölçekleneceğini (Kapla tüm görünüm alanını doldurur, Sığdır görseli içine sığdırır) ve tekrarlanıp tekrarlanmayacağını (döşeme) veya kayan içeriğin arkasında tek bir görsel olarak kalıp kalmayacağını yapılandırın.
Global özel CSS ve JavaScript
Standart ayarların başaramayacağı gelişmiş özelleştirmeler için Ayarlar, bir Global CSS alanı (en fazla 1.000 karakter) ve bir Global JS alanı (en fazla 1.000 karakter) sağlar. Buraya girilen CSS, mağazanın her sayfasına enjekte edilir; buraya girilen JS, her sayfada çalışır. Bunları tutumlu kullanın ve sayfaya özgü özelleştirmeler için Özel Kod bölümünü tercih edin.