Geri sayım hangi saat dilimini kullanır?

Bitiş tarihini (YYYY-MM-DD) ve saatini (HH:MM) girer, ait oldukları UTC farkını seçersiniz. Sayaç, nerede olurlarsa olsunlar her ziyaretçi için aynı anda biter. Fark yaz saatiyle değişmez; bu yüzden bitiş tarihinde geçerli olanı seçin.

Sayaç sıfıra ulaşınca ne olur?

Siz seçersiniz: bölümü gizle, bir bitti mesajı göster ya da sıfırları göstermeye devam et. Bölüm ayrıca bitiş tarihini sayfanın oluşturulduğu zamanla karşılaştırır; böylece zaten bitmiş bir kampanya kaybolmadan önce bir sayaç gösterip söndürmez. Tema düzenleyicide gizlenmiş bir geri sayım, düzenlemeye devam edebilmeniz için bir notla görünür kalır.

JavaScript olmadan ziyaretçiler ne görür?

Başlığı, metni, düğmeyi ve bitiş tarihini metin olarak, örneğin "Ends 31 December", haneler yerine tirelerle. Küçük bir custom element sayacı başlatır ve her saniye, saniyeler gizliyse her dakika günceller.

Geri sayım erişilebilir mi?

Değişen haneler ekran okuyuculardan gizlenir. Bunun yerine ekran okuyucular bitiş tarihini ve kalan gün, saat ve dakikayı içeren bir metin satırı okur; sayaç bu satırı her saniye değil dakikada bir yeniden yazar. Hane animasyonu ziyaretçi azaltılmış hareket tercih ettiğinde ya da siz kapattığınızda kapalıdır.

Geri sayım banner

Belirlenen tarih ve saate canlı geri sayımlı indirim ya da lansman bannerı: çubuk, banner ya da iki sütun, cihaza göre arka plan görseli, seçilen bitiş durumu.

Kategori: Dönüşüm ve kampanyalar
Kullanım yeri: Ana sayfa, Koleksiyon, Açılış sayfaları
Okuduğu veri: Yalnızca içerik
Boyut: 35 KB, küçük bir betik içerir
Lisans: MIT, müşteri işlerinde ücretsiz

Markdown olarak görüntüle ChatGPT’de aç Claude’da aç

Kısaca

Geri sayım banner, belirlediğiniz bitiş tarihine ve saatine bir başlık, metin ve düğmenin yanında geri sayan ücretsiz bir Shopify bölümüdür; ince bir çubuk, görselli bir banner ya da iki sütunlu bir düzen olarak gelir. Son tarih bir UTC farkına sabitlenir; böylece her ziyaretçi aynı bitiş anını görür. Online Store 2.0 temalarında uygulama olmadan çalışır.

Örnek içerikli demo

Ne zaman kullanılır

Ana sayfanın en üstünde sezonluk indirim bannerı
Koleksiyon ya da açılış sayfasında ürün lansmanı veya ön sipariş son tarihi
Bir tatil öncesinde ücretsiz kargo son saati için ince bir çubuk

Tema düzenleyicide

Başlık, başlık etiketi ve boyutu, metin, stili ve yeni sekme seçeneğiyle düğme
Bitiş tarihi, bitiş saati ve UTC farkı; saniyeleri göster
Gün, saat, dakika ve saniye etiketleri; bitiş tarihi ön eki
Sıfırda: bölümü gizle, bir mesaj göster ya da 00’da kal
Düzen: satır içi çubuk, görsel ya da renk üzerinde banner veya iki sütunlu görsel ve metin (görsel solda ya da sağda)
Katman opaklığıyla ayrı masaüstü ve mobil görsel; mobilde içerik konumu
Hane stili: kutular ya da iki nokta üst üsteli düz; cihaza göre hizalama
Arka plan rengi ya da gradyan, metin ve vurgu renkleri
Cihaza göre üst ve alt boşluk, yalnızca masaüstünde/mobilde göster, çapa kimliği, hane animasyonu açma/kapama

Dosyalar

sections/lib-countdown-banner.liquid

İndir

Kodu görün

lib-countdown-banner.liquid dosyasını açın

snippets/lib-button.liquid

İndir

Kodu görün

lib-button.liquid dosyasını açın

snippets/lib-image.liquid

İndir

Kodu görün

lib-image.liquid dosyasını açın

Sade Liquid, CSS ve küçük bir betikle yazıldı. Uygulama da bağımlılık da yok.

Temanıza nasıl eklenir

Bölüm dosyasını temanızın sections klasörüne, listelediği snippet’leri de snippets klasörüne kopyalayın.
Tema düzenleyicide Add section’ı (Bölüm ekle) seçin ve adı “Lib ·” ile başlayan bölümü ekleyin.
Örnek metni mağazanızın kendi metniyle değiştirin, renkleri markanıza göre ayarlayın.

Sık sorulan sorular

Geri sayım hangi saat dilimini kullanır?: Bitiş tarihini (YYYY-MM-DD) ve saatini (HH:MM) girer, ait oldukları UTC farkını seçersiniz. Sayaç, nerede olurlarsa olsunlar her ziyaretçi için aynı anda biter. Fark yaz saatiyle değişmez; bu yüzden bitiş tarihinde geçerli olanı seçin.
Sayaç sıfıra ulaşınca ne olur?: Siz seçersiniz: bölümü gizle, bir bitti mesajı göster ya da sıfırları göstermeye devam et. Bölüm ayrıca bitiş tarihini sayfanın oluşturulduğu zamanla karşılaştırır; böylece zaten bitmiş bir kampanya kaybolmadan önce bir sayaç gösterip söndürmez. Tema düzenleyicide gizlenmiş bir geri sayım, düzenlemeye devam edebilmeniz için bir notla görünür kalır.
JavaScript olmadan ziyaretçiler ne görür?: Başlığı, metni, düğmeyi ve bitiş tarihini metin olarak, örneğin "Ends 31 December", haneler yerine tirelerle. Küçük bir custom element sayacı başlatır ve her saniye, saniyeler gizliyse her dakika günceller.
Geri sayım erişilebilir mi?: Değişen haneler ekran okuyuculardan gizlenir. Bunun yerine ekran okuyucular bitiş tarihini ve kalan gün, saat ve dakikayı içeren bir metin satırı okur; sayaç bu satırı her saniye değil dakikada bir yeniden yazar. Hane animasyonu ziyaretçi azaltılmış hareket tercih ettiğinde ya da siz kapattığınızda kapalıdır.

Yayınlamadan önce

Demolardaki metinler örnek içeriktir. Yayımlamadan önce kendi mağazanızın bilgileriyle değiştirin.
Hareketin azaltılmasını isteyen ziyaretçilerde animasyonlar kapalıdır.
Her dosya burada yayımlanmadan önce Shopify Theme Check ile kontrol edilir.

Temanıza uyarlanmış bir sürüme ya da burada olmayan bir bölüme mi ihtiyacınız var? Şu sayfaya bakın: Shopify tema geliştirme.

Dönüşüm ve kampanyalar
Duyuru çubuğu
Solma ya da kaydırmayla dönen en fazla altı mesajlı ince çubuk; isteğe bağlı oklar, ikonlar, bağlantılar ve her kampanyayı hatırlayan kapat düğmesi.
Dönüşüm ve kampanyalar
Ücretsiz kargo çubuğu
Canlı sepete ve belirlediğiniz eşiğe göre "Ücretsiz kargoya 23 $ kaldı" mesajı ve ilerleme çubuğu. Sepet çekmecesiyle güncellenir; para birimine göre eşik.
Dönüşüm ve kampanyalar
Bülten pop-up’ı
İsteğe bağlı indirim kodlu e-posta kayıt pop-up’ı; bir süre sonra, çıkış niyetinde ya da kaydırınca açılır, sayfa yüklenirken asla. Mobilde küçük bir kart.