Web sitelerinde kullanıcı deneyimini güçlendirmek ve içerikleri daha etkili bir şekilde sunmak için kullanılan en önemli unsurlardan biri slider (kaydırıcı) bloklarıdır. Görsel açıdan zengin, düzenli ve dikkat çekici bir yapı sunan sliderlar; ürünlerin, kampanyaların, duyuruların ve öne çıkarılmak istenen içeriklerin ön plana taşınmasını sağlar.
Gelişmiş Slider yapısı ise standart slider kullanımının ötesine geçerek, farklı cihaz boyutlarına özel ayarlamalar, dinamik içerik yönetimi, animasyon seçenekleri ve gelişmiş düzenleme imkânları sunar. Bu sayede hem masaüstü hem de mobil cihazlarda daha uyumlu, daha hızlı ve daha etkili bir görüntüleme deneyimi elde edilir.
Ziyaretçinin ilgisini ilk bakışta yakalayan ve sayfa üzerindeki yönlendirmeleri kolaylaştıran Gelişmiş Slider, modern web tasarımlarının vazgeçilmez bir bileşeni haline gelmiştir.
Gelişmiş Slider yapısı birçok farklı amaç için kullanılabilir:
Ana sayfa kampanya ve duyuruları
Ürün ve koleksiyon tanıtımları
Hizmet ve kategori vurguları
Blog ve haber alanları
Marka ve iş birliği tanıtımları
Bu alanlar sayesinde sitenin en önemli içerikleri, ziyaretçilere etkili bir ilk izlenimle sunulur.
- Gelişmiş Slider düzenleme işlemi için "Online Mağaza > Tema Yönetimi" sayfasına veya "Online Mağaza > Blok Yönetimi" sayfasına tıklayın.
- "Tema Yönetimi" sayfasından işlem yapmak için “Özelleştir” butonuna tıklayın.
- “Tema Özelleştir” seçeneğini kullanılırsa açılan sayfada “Gelişmiş” butonuna tıklayın.
- Blok yönetimi sayfasında mevcut bir slider bloğunu düzenlemek için ilgili bloğun yanındaki düzenleme kalemi ikonuna tıklayabilirsiniz.
- Yeni bir "Gelişmiş Slider" bloğu eklemek için, bulunduğunuz satırdaki “+Yeni” butonunu kullanabilirsiniz.
- Yeni ekleme alanında, “Sistem Blokları” sekmesine geçerek “Gelişmiş Slider” bloğunun yanında bulunan artı (+) ikonuna ile bloğu ekleyebilirsiniz.
- Eklediğiniz bloğun içeriğine ulaşmak için düzenleme ikonuna tıklayınız.
Genel Ayarlar
- Blok Başlığı : Eklediğiniz bloğun yönetim panelinde görüntülenecek başlık bilgisidir.
- Tema : Blokta kullanılacak temayı seçebilirsiniz. Standart veya özel tema (özel temada blok kodlaması mevcut ise) seçeneklerinden birini kullanabilirsiniz.
- Şablon : Seçtiğiniz tema içerisinde tanımlı şablonlardan birini seçebilirsiniz. Bu seçim, bloğun tasarımsal görünümünü belirler.
- Yetkilendirme : Bloğun görünürlüğünü üye, bayi ve ziyaretçi bazında yönetebilirsiniz. Yalnızca aktif edilen gruplar bloğu görebilir.
- Görünüm : Eklediğiniz bloğun hangi cihazlarda görüntüleneceğini belirleyebilirsiniz. Böylece farklı cihazlar için farklı blok görünümleri oluşturabilirsiniz.
- Dil Ayarları : Sitenizde aktif olan dillere özel bloklar oluşturabilirsiniz. Bloğun yalnızca belirli dillerde görünmesini istiyorsanız bu alandan ilgili dilleri seçebilirsiniz. Herhangi bir seçim yapılmazsa blok sitedeki tüm dillerde görüntülenir.
Resimler
- Resimler : Slider bloğuna eklediğiniz görseller bu alanda listelenir. Mevcut görseller üzerinde düzenleme yapabilir ve “Ekle” butonunu kullanarak yeni görseller ekleyebilirsiniz.
- Başlık / Alt Başlık : Blokta görüntülenecek Eklenen metinlerin görünümü ve konumu, blokta kullanılan slider şablonuna göre değişiklik gösterebilir.
- URL : Kullanıcı slider görseline tıkladığında yönlendirileceği bağlantı adresini tanımlayabilirsiniz.
- Büyük Ekran : Slider bloğunda kullanılacak görsel, “Büyük Ekran” alanından yüklenmelidir. Görsel ölçüleri, kullanılan şablona bağlı olarak farklılık gösterebilir. Birden fazla görsel eklendiğinde, tüm görsellerin aynı boyutta olması önerilir.
- Mobil/Tablet : Mobil cihazlarda farklı bir görsel göstermek için “Mobil/Tablet” alanına görsel ekleyebilirsiniz. Bu durumda mobilde, masaüstü görseli yerine eklediğiniz mobil görsel görüntülenir. Görseli mobil boyutlara uygun şekilde hazırlayın.
- Küçük Resim (Thumbnail) : Slider görsellerinin altında küçük önizleme (thumbnail) görselleri göstermek için "Küçük Resim" alanını kullanabilirsiniz. Bu alana görsel ekledikten sonra özelliğin etkin olması için “Blok Ayarları > Küçük Resimleri Göster” seçeneğinin aktif edilmesi gerekmektedir.
- Buton Metni : Görsel üzerinde kullanıcıları yönlendirmek için “Buton Metni” alanını kullanabilirsiniz. Bu alana metin eklendiğinde, görsel üzerinde bir buton otomatik olarak oluşturulur. Kullanılan slider şablonuna göre görünüm durumu ve konumu değişebilir.
- Veri 1-2-3 / İçerik : Görsel üzerinde ek metin alanlarını göstermek için kullanılabilir. Eklenen metinlerin yansıma durumu ve görsel üzerindeki konumları, kullanılan şablona göre değişiklik gösterebilir. Bu alan boş bırakıldığında görsel üzerinde herhangi bir metin görüntülenmez.
- Resimleri ekledikten sonra pasife alabilir, kopyalayabilir, düzenleyebilir veya silebilirsiniz. Düzenleme yapmak için düzenleme kalemini kullanabilirsiniz.
Blok Ayarları
- Başlık / Alt Başlık : Slider blok alanının üstünde görüntülenecek başlık ve alt başlığı tanımlamanızı sağlar. Boş bırakıldığında, blok üzerinde herhangi bir başlık görüntülenmez.
- Navigasyonu Göster : Slider üzerinde ileri geri geçiş oklarının görünmesini sağlar.
- Küçük Resimleri Göster : Slider altına küçük önizleme (thumbnail) görsellerinin eklenmesini sağlar. Aktif edildiğinde, görsel ekleme/düzenleme penceresi üzerinden thumbnail resmi ekleyebilirsiniz.
- Sayfalama Göster : Slider içinde kaçıncı görselde olunduğunu gösteren nokta veya numaralı göstergeleri aktif eder.
- Sayfalama Türü : Sayfalama göstergesinin biçimini (örneğin nokta, sayı, çubuk) seçmenizi sağlar.
- Döngü : Slider’ın son görsele geldiğinde yeniden başa dönerek sürekli oynatılmasını sağlar.
- Otomatik Oynatma (ms) : Slider’ın otomatik geçiş süresini milisaniye cinsinden belirler.
- Efekt : Görseller arası geçişte kullanılacak animasyon türünü (örneğin slide, fade vb.) seçmenizi sağlar.
- Slide Adedi : Slider bloğuna eklenen görsellerin yan yana kaç adet görüneceğini belirler. Sistem 12’li grid yapısına göre çalışır ve tek satırda en fazla 12 görsel gösterilebilir. Mobil ve masaüstü için kaydırma çubuklarıyla farklı değerler belirleyebilirsiniz. Örneğin, görselin sayfayı tam kaplayarak tekli görünmesi isteniyorsa değer 1 olarak ayarlanmalıdır. Cihaz bazlı özelleştirme için “Gelişmiş” seçeneği kullanılabilir. Gelişmiş seçeneğinde "XS" ve "SM" mobil cihazlar, "MD", "LG", "XL" ve "XXL" daha büyük ekranlar için kullanılmaktadır. Yan yana 3 görsel gösterilmek istenirse ilgili alanlara 3 değeri girilmelidir.
- Kenar Boşluğu : Slider bloğunda yan yana birden fazla görsel kullanıldığında, görseller arasındaki boşluk (px) değerini belirler. Tekli slider kullanımında varsayılan ayarlarda bırakılabilir. Mobil ve masaüstü için kaydırma çubuklarıyla farklı değerler ayarlanabilir. Cihaz bazlı özelleştirme için “Gelişmiş” seçeneğini kullanabilirsiniz.