Sezon havası, sezonluk performans bedeli olmadan
Mağazada kar yağması küçük bir ayrıntı, ama aralık ayını gerçekten aralık gibi hissettiren şey tam da böyle ayrıntılar. İstemediğiniz taraf ise bunun alışılmış bedeli: bir JavaScript kütüphanesi, başkasının CDN'inden çekilen bir yazı tipi, yıl boyu her sayfada çalışan bir kod ve ocak ayında kapatmayı hatırlamak için kendinize bıraktığınız not. Bu modül bunların hiçbirini yapmaz. Tamamen CSS'tir, takvimini kendisi yönetir ve yaklaşık bir kilobayt yer kaplar.
İki tema
Klasik, sade beyaz kar yağışıdır. Noel karışımı ise tanelerin arasına çanlar, notalar, ağaçlar, kardan adamlar ve hediyeler serpiştirir. Süslemeler kendi renklerini korur; kar glifleri ise seçtiğiniz rengi alır ve hafif bir gölgeyle gelir, böylece beyaz taneler açık temalarda da görünür kalır.
Sezonu bir kez ayarlayın, sonrasını unutun
Bir ilk ve son gün belirleyin — örneğin 1 Aralık ile 6 Ocak arası — modül her ziyarette tarihleri karşılaştırır. Kar kendiliğinden görünür, kendiliğinden durur. Tarihleri boş bırakırsanız siz kapatana kadar yağmayı sürdürür. Mart ayında hâlâ kar yağan mağazaların önüne geçen ayar tam olarak budur.
Ayarlanabilir, ama varsayılanları zaten yerinde
- Yoğunluk — sakin, normal ya da tipi.
- Boyut — tema yazı boyutunuza göre 0,5 ile 5 arası; her tane bu değerin çevresinde hafifçe değişir.
- Miktar — ekranda aynı anda 4 ile 48 tane.
- Renk — geçerli olan her CSS rengi.
- Telefonlarda göster — kapatarak karı 768 pikselden geniş ekranlarla sınırlayın.
Her alan kaydederken doğrulanır: aralıklar denetlenir, tarihlerin geçerli ve doğru sırada olması gerekir, renkler gerçek bir renk olmalıdır ve ondalık virgülle yazılan 1,5 gibi bir boyut sessizce reddedilmek yerine kabul edilir. Hatalı bir giriş, anlaşılır bir mesajla geri gelir ve yazdıklarınızın hiçbiri kaybolmaz.
Doğal görünen bir hareket
Her tane, sayfa her yüklendiğinde rastgele bir konum, boyut ve zamanlama alır; animasyon da düşüşün ortasından başlar. Böylece ekran ilk saniyelerde boş kalmaz ve desen gözle görülür biçimde tekrar etmez.
Tasarımı gereği saygılı
Kar asla tıklamaların ya da metin seçiminin önüne geçmez; her katman pointer-events: none kullanır, dolayısıyla mobildeki bir butona dokunuşunuz hiçbir yerde yutulmaz. Sistemi azaltılmış hareket isteyen ziyaretçiler hiç kar görmez; bu, harekete duyarlı kullanıcılar için hoş bir ayrıntı değil, gerçek bir ihtiyaçtır.
Nerede görüntülenir
Kod, PrestaShop'un varsayılan yerleşimleri üzerine kurulu her temada bulunan standart displayBeforeBodyClosingTag kancasıyla eklenir; stil dosyası ise actionFrontControllerSetMedia üzerinden kaydedilir, böylece normal varlık hattına katılır ve yalnızca sezon etkinken yüklenir. Çok fazla özelleştirilmiş bir temada modülü Tasarım → Konumlar bölümünden başka bir görüntüleme kancasına bağlayabilir ya da {widget name='snowflakesmeg'} ile doğrudan yerleştirebilirsiniz. Kaç kancaya veya widget çağrısına bağlanmış olursa olsun sayfa başına en fazla bir kez çalışır.
Sürüm 2.0 neleri düzeltti
Sürüm 1.x'te altı gerçek sorun vardı; hepsi geride kaldı. PrestaShop 1.7'de iki kez kar yağıyordu, çünkü 1.x hem displayHeader kancasını hem de onun eski header takma adını kaydediyordu — her sayfada üst üste binen iki kar katmanı. Noel modunda, CDN'e erişilemediği anlarda boş kareler çıkıyordu; şenlikli simgeler, kullanımdan kaldırılmış üçüncü taraf bir CDN üzerindeki Font Awesome stil dosyasından geliyor ve mağazanın ve yönetim panelinin her sayfasında yükleniyordu. 2.0 yerel emoji ve metin gliflerini kullanır, dışarıdan hiçbir şey yüklemez. Düşen taneler tıklamaları engelliyordu, özellikle mobilde. Ondalık virgülle yazılan boyut, hiçbir açıklama yapılmadan reddediliyordu. Kar kodu <head> içine basılıyor, belgeyi onarmak tarayıcılara kalıyordu; artık tam </body> etiketinin öncesine yerleşiyor. Bir de sezonu bitirmenin yolu yoktu — tarihler işte bu yüzden var.
Uyumluluk
PrestaShop 1.7, 8 ve 9 ile uyumludur ve sekiz dilde gelir: Almanca, Felemenkçe, Fransızca, İngilizce, İspanyolca, İtalyanca, Lehçe ve Türkçe. Animasyon yalnızca transform üzerinden çalıştığı için tarayıcının birleştirme iş parçacığında kalır; 48 tanede bile ne yerleşim hesabı ne de takılma olur. Veritabanı tablosu, override ve çekirdek değişikliği yoktur; modülü kaldırdığınızda 1.x'ten kalan artıklar dahil tüm ayarlar silinir ve mağazanız tam olarak eski hâline döner.
Sıkça sorulan sorular
Mağazamı yavaşlatır mı?
Hayır. Küçük bir stil dosyası ve yaklaşık bir kilobayt koddan ibarettir; yalnızca transform ile canlandırılır ve harici hiçbir sunucudan bir şey çekmez.
Ocak ayında kapatmayı hatırlamam gerekir mi?
Hayır — sezon tarihleri tam olarak bunun için var. İlk ve son günü bir kez ayarlayın; kar kendiliğinden başlar ve kendiliğinden durur.
JavaScript gerekiyor mu?
Hiç gerekmiyor. JavaScript yok, jQuery yok, harici dosya ya da yazı tipi yok. Üçüncü taraf bir sunucudan hiçbir şey istenmediği için GDPR açısından da içiniz rahat olur.
Kar, butonlarımı engeller mi?
Hayır. Her kar katmanı pointer-events: none kullanır; tıklamalar ve metin seçimi doğrudan içinden geçer.
Mobilde gizleyebilir miyim?
Evet, tek bir anahtar efekti 768 pikselden geniş ekranlarla sınırlar.
Harekete duyarlı ziyaretçiler ne görüyor?
Onlar hiç kar görmez. Modül, prefers-reduced-motion sistem ayarına otomatik olarak uyar.
Temam özel ve hiçbir şey görünmüyor — şimdi ne yapmalıyım?
Modülü Tasarım → Konumlar bölümünden başka bir görüntüleme kancasına bağlayın ya da şablonunuza {widget name='snowflakesmeg'} ekleyin. Yine de sayfa başına yalnızca bir kez çalışır.
Yorumlar (2)
İnceleme değerlendirmeniz gönderilemiyor
Yorumu bildir
Rapor gönderildi
Raporunuz gönderilemiyor