SLIDER

Web siteleri, görsel çekiciliği artırmak ve içeriği dinamik bir şekilde sunmak için önemli araçlar kullanır. Bu araçlardan biri de slider bloklarıdır.

Slider blokları, web sitelerinde dikkat çekici bir şekilde içerikleri ve görselleri döngüsel veya geçişli bir şekilde sunmayı sağlayan etkili bir araçtır.

Slider blokları, sayfa ziyaretçilerine ürünleri, hizmetleri, haberleri veya önemli bilgileri görsel bir şekilde tanıtma ve vurgulama imkanı sunar.

Birden fazla görsel veya içerik öğesini bir arada sergileyerek kullanıcıların dikkatini çeker ve ilgilerini çeken detayları keşfetmelerine olanak tanır.

Yeni blok oluşturmak veya temanızda bulunan bir Slider bloğunu düzenlemek için "Tasarım > Tema Yönetimi > Özelleştir > Gelişmiş > Blok Yönetimi" sayfasına tıklayınız.

İsterseniz alternatif olarak "Tasarım > Tema Yönetimi > Özelleştir" sayfasından da hızlı düzenleme seçeneği ile blokları yönetebilirsiniz.

Blok yönetimi sayfasında var olan bir bloğu düzenlemek için düzenleme kalemine tıklayabilirsiniz.

Yeni Slider bloğu eklemek için ilgili satırda yer alan "+Yeni" butonuna tıklayınız.  

Yeni ekleme alanında "Slider" yanında bulunan artı simgesine tıklayarak ekleyebilirsiniz.

Eklediğiniz bloğun içeriğine ulaşmak için düzenleme kalemine tıklayınız.

Blok Ayarları 

1. Blok Başlığı : Eklenen bloğun sitede görüntülenecek başlık bilgisidir.

2. Tema : Blokta kullanılacak tema seçimini yapabilirsiniz. Standart veya özel tema (Özel temada blok kodlaması var ise) olarak kullandığınız temalardan seçim yapabilirsiniz. Aktif temanız dışında sitenizde yüklü olan diğer temalardan da seçim yapabilirsiniz.

3. Şablon : Seçtiğiniz tema içeriğinde tanımlı şablonlar içinden seçim yapabilirsiniz. Seçtiğiniz şablon bloğun tasarımsal görünümü etkileyecektir.

4. Yetkilendirme : Blok görünürlüğü üye, bayi ve ziyaretçi bazında yönetilebilir. Sadece aktif edilen gruplarda blok görüntülenir.

5. Görünüm : Eklediğiniz bloğun hangi cihazlarda görüntülenebileceğini yönetebilirsiniz. Bu şekilde farklı cihazlar için farklı görünümler oluşturabilirsiniz.

6. Dil Ayarları : Sitenizde aktif olan dillere özel bloklar oluşturabilirsiniz. Eklediğiniz bloğun sadece belirli dillerde görünmesini istiyorsanız bu alandan seçim yapabilirsiniz.

7. Yayınlanma Ayarları : Eklediğiniz bloğun belirli bir tarihte yayınlanma ve yayından kalkma durumunu belirleyebilirsiniz. Kampanya dönemlerinizde yayınlamak istediğiniz içerikleri önceden hazırlayabilir ve ilgili tarih geldiğinde otomatik yayınlanmasını sağlayabilirsiniz.

8. Dil Seçimi : Blok içerisine eklenen görselleri kullandığınız tüm diller için özelleştirebilirsiniz. Her dil için seçim yaptıktan sonra resim alanından ekleme yapabilirsiniz. 

9. Resimler : Blokta görüntülenecek resimleri ekleyebilirsiniz. Ekleme yapmak için "Yeni" seçeneğine tıklayabilirsiniz.

10. Slide Adedi : Slider bloklarında eklenen görsellerin yanyana görünme durumlarını düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. Tek satırda maksimum 12 adet görsel görüntülenebilir. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 1 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız ilgili alanlara 3 yazabilirsiniz. 

11. Kenar Boşluğu : Slider bloğunda yanyana birden fazla görsel eklemesi yaparken, görseller arasındaki boşluk değerini (px) belirleyebilirsiniz. Tekli slider kullanımı var ise standart ayarlarda bırakabilirsiniz.

12. Ayarlar : Slider bloklarına özel görsel üzerinden görüntülenebilecek yazı ve buton özelleştirmeleri yapabilirsiniz.

- Blok Başlığını Göster : Oluşturduğunuz bloğun "Blok Başlığı" bilgisinin siteye yansıma durumunu yönetebilirsiniz.

- Resim Boyutlandırma Aktif : Eklediğiniz görselin boyutları bloğun bulunduğu konuma uygun değil ise otomatik boyutlandırılmasını sağlar. Görsel boyutlandırmasına müdahale edilmesini istemiyorsanız pasif bırakabilirsiniz.

- Sol Sağ Okları Göster : Slider üzerinde görseller arasında geçiş yapılması için kullanılabilecek okların gösterim durumlarını yönetebilirsiniz.

- Alt Resimleri Göster : Slider büyük görsellerinin altında küçük görsellerin (thumbnail) gösterim durumlarını yönetebilirsiniz.

- Gösterim Süresi : Slider bloğuna eklenen her görselin kaç saniye sonrasında diğer görsele geçiş yapacağını belirleyebilirsiniz. 

- Efekt : Görsel geçişleri sırasında kullanılacak tasarımsal efektler kullanabilirsiniz.

- Sayfalama Tipi : Görsellerin sayfa numaraları ile birlikte görünmesini sağlar.

- Slide (Slide Tamamlanınca Başa Döner) : Slider alanındaki en son görsele gelindiğinde en baştaki görsele otomatik dönmesini sağlar.

- Yazı Konumu : Görsel üzerine eklenen metinlerin konumunu seçebilirsiniz.

- Yazı Boyutu : Görsel üzerine eklenen metinlerin boyutunu değiştirebilirsiniz.

- Başlık Rengi : Eklenen metinlerden başlık konumunda olan içeriğin rengini belirleyebilirsiniz. Renkler tema düzenleme sayfasında yer alan font seçeneklerinden gelmektedir. 

- Yazı Rengi : Eklenen metinlerin genel yazı renklerini belirleyebilirsiniz. Renkler tema düzenleme sayfasında yer alan font seçeneklerinden gelmektedir.

- Buton Rengi : Görseller üzerinde buton görünümü yapılabilmektedir. Eklenen butonun rengini değiştirebilirsiniz. Renkler tema düzenleme sayfasında yer alan buton seçeneklerinden gelmektedir. 

- Overlay Rengi : Eklenen görsellerin üzerine renkler ile gölgelendirme işlemi sağlamak için kullanabilirsiniz. 

- Görsel Efektleri : Görsel üzerine efekt ekleyebilirsiniz. Örnek olarak opacity ile görselleri soluk gösterebilir ve mouse ile üzerine gelindiğinde orjinal görsel görünümünü sunabilirsiniz.

Slider bloğu içerisinde bulunan sekmelerin kullanımı için Blok Sekmeleri Kullanımı makalemizi inceleyebilirsiniz.

Resimler

1. Başlık : Eklenen her resim için başlık bilgisi tanımlayabilirsiniz. Eklediğiniz başlık kullandığınız temanın özelliklerine göre görsel ile görüntülenebilmektedir.

2. URL : Eklenen resim alanına tıklandığında yönlendirilmesini istediğiniz bağlantı adresleri ekleyebilirsiniz. Sistem tanımlı (kategori, sayfa, marka...) link gruplarından seçebilir veya sabit link ile bağlantı adesleri tanımlayabilirsiniz.

3. Geniş Ekranlar : Blokta görüntülenecek resimleri editör alanına tıklayarak ekleyebilirsiniz. 

4. Gelişmiş Ayarlar : Görsel özelinde görüntülenebilecek içerikleri bu alandan ekleyebilirsiniz.

- Mobil/Tablet(İsteğe Bağlı) : Mobil ve tablet cihazlarda farklı boyutlarda görseller eklemek için kullanabilirsiniz. Kullandığınız temaya göre çalışma durumu farklılık gösterebilmektedir.

- Resim 2 : Kullandığınız temada slider bloğundaki küçük görselleri (thumbnail) bu alandan ekleyebilirsiniz. Eklenen görseller slider alanındaki büyük görsellerin altında görüntülenecektir. Kullandığınız temada bu alan aktif değil ise herhangi bir ekleme yapmanıza gerek yoktur.

- Veri 1/2/3/4 : Slider üzerinde metin ve buton gösterimi yapmak için veri alanlarını kullanabilirsiniz. "Veri 1/2/3" alanları metin içerikleri, "Veri 4" alanı ise buton görünümü ekler. 

- İçerik : Veri alanları dışında görsel üzerine metin eklemek için kullanılmaktadır.

NOT : Veri ve içerik alanının kullanımı ve hangilerinin kullanıldığı aktif temanıza göre değişiklik gösterebilmektedir. Slider eklemesi yaparken bu alanların hepsini doldurup kullandığınız temada hangi alanların aktif olduğunu test edebilirsiniz.

ÖRNEKLER

Tekli Slider

Thumbnail Kullanımlı Slider

Yanyana Görsel Kullanılan Slider