İçerik, ziyaretçilerinizin web sitenize gelmesini sağlayan şeydir, fakat ilk izlenimler de önemlidir: ilk etapta onları bu şekilde cezbedersiniz. İyi içerik, güzel bir sunumu hak eder – hatta bunu gerektirir. Web siteniz ilkel görünüyorsa, içeriğinizin kalitesi ne olursa olsun profesyonelce görünmeyebilir.
Kaydırıcıların devreye girdiği yer burasıdır. Özellikle bu eğitimde, WordPress kartları kaydırıcısı. Genel olarak, kaydırıcı, görüntüleri ve videoları görüntülemek için kullanılan dinamik bir tasarım öğesidir. Genel olarak, aynı anda bir resim veya video gösterir ve bir süre sonra veya kullanıcı eylemiyle değişir. Kart kaydırıcı, görüntülerin kart galerisine benzer şekilde bir kart destesine benzeyecek şekilde görüntülendiği ve canlandırıldığı bir kaydırıcıdır.
Bu eğitimde, WordPress web sitenize nasıl kart kaydırıcı ekleyeceğinizi göstereceğiz. Fakat bunu yapmadan önce, bir kart kaydırıcının web sitenizi iyileştirebileceği durumları ve bundan en iyi ne zaman kaçınılacağını tartışmak için biraz zaman ayırmak istiyoruz. İşte tartışacaklarımız:
-
Kart Kaydırıcı Nedir?
-
Bir Kart Kaydırıcısının Dezavantajı
-
Elementor için Qi Eklentileriyle Kart Kaydırıcısı Nasıl Eklenir
Kart Kaydırıcı Nedir?
Bir kart kaydırıcısı gösterişlidir, yani bir kart galerisine benzer şekilde, onu fotoğraflar ve resimler için bir vitrin özelliği olarak kullanabilirsiniz.
Herhangi bir galeride olduğu gibi, kartların da ek bir işlevi olabilir: kartlara bir bağlantı ekleyebilir ve bunları bir gezinme özelliği olarak kullanabilirsiniz. Bir portföy web sitesinin parçası olarak, her sayfa önceki bir projeye bağlanabilir. Örneğin bir film projesi web sitesinde, kaydırıcıdaki resimler, oyuncu kadrosunun profil sayfalarına veya benzerlerine bağlantı veren karakter portreleri olabilir. Web siteniz için bu tür cesur bir tasarım seçeneği işe yarayabilirse, bir menü yerine bir kart kaydırıcı bile kullanılabilir.
Bir kart kaydırıcının ek bir avantajı daha vardır: animasyonlu ve tıklanabilir olması, kullanıcı etkileşimini davet ederek web sitenizi daha ilgi çekici hale getirir: ziyaretçilerinize yapacak bir şeyler verir.
Bir Kart Kaydırıcısının Dezavantajı
Kaydırıcılar bu harika görsel özelliklerdir, neden onları eklemiyorsunuz? WordPress, tüm bu harika görünen eklentilere ve özelliklere sahiptir ve acemi bir tasarımcının her şeyi ve mutfak lavabosunu web sitesine dökmesi anlaşılabilir olacaktır.
Bu tasarım yaklaşımı genellikle kötü bir fikirdir, fakat kart kaydırıcı söz konusu olduğunda, göz önünde bulundurmanız gereken önemli bir şey vardır: görüntü boyutu. Bir vitrin özelliği, yüksek kaliteli, yüksek çözünürlüklü görüntüler kullanır ve bunların yüklenmesi yavaş olabilir.
Web sitesi yükleme hızı, hemen çıkma oranınızı etkileyebilir (insanların bir sayfanın tamamen yüklenmesini beklemekten vazgeçmesi nedeniyle) ve bunun SERP konumlarınız üzerinde olumsuz bir etkisi olabilir. Bu yüzden büyük özellikleri dikkatli bir şekilde kullanın ve olumsuz etkilerini azaltmak için görüntülerinizi optimize edin.
Ve şimdi, bir kart kaydırıcının web sitenizi iyileştirebileceğinden eminseniz, en ince ayrıntılara geçelim.
Elementor için Qi Eklentileriyle Kart Kaydırıcısı Nasıl Eklenir
Elementor için kendi Qi Eklentilerimiz ile, Elementor’un zaten etkileyici olan yeteneklerini büyük ölçüde genişleten, profesyonelce tasarlanmış 60 yepyeni widget’a sahip olursunuz. Bunları kullanmak için, WordPress’in önde gelen görsel düzenleyicisi olan Elementor’u yüklemiş olmanız gerekir – Elementor’un ücretsiz sürümü iş görecektir. Daha sonra Qi Addons for Elementor eklentisini kurun ve aralarında kaydırıcı olan kartlar da dahil olmak üzere tüm bu yeni tasarım öğelerine erişebileceksiniz.
Ve aşağıdaki videoda olduğu gibi dakikalar içinde hepsini kurabilirsiniz.
Bununla birlikte öğreticilerinizi metin biçiminde tercih edebilirsiniz. Durum buysa, okumaya devam edin. Kart kaydırıcıyı kullanmaya başlamak için sol taraftaki menüde widget’ı bulun ve sayfada olmasını istediğiniz yere sürükleyin.
Widget’ın varsayılan sürümünün üç resme sahip olduğunu göreceksiniz. Bunlar, içerik sekmesinin Genel bölümünde öğeler olarak listelenir.
Yukarıdaki ilk seçenek, görüntü “destenizin” yönünü değiştirmek için kullanabileceğiniz Görüntü Karıştırma Stili’dir. Sağa Karıştır ve Sola Karıştır arasında seçim yapabilirsiniz. Varsayılan değer olan Shuffle Right’ta bırakacağız.
Sırada Görüntü Öğeleri var. Kart kaydırıcınıza istediğiniz resimleri ekleyebileceğiniz yer burasıdır. Kaydırıcının varsayılan sürümü üç resim içerir, fakat + Öğe Ekle düğmesine tıklayarak daha fazlasını ekleyebilirsiniz. Üç resim kullanacağız, bu yüzden daha fazla eklemeyeceğiz. Ayrıca herhangi bir öğeyi X düğmesine tıklayarak silebilir veya Kopyala düğmesine tıklayarak kopyalayabilirsiniz.
Bir öğeye resim eklemek için öğeye tıklayın. Bağlantı alanına girerek görüntüye bir bağlantı ekleyebilirsiniz. Bir resme tıklayan bir ziyaretçi, bağlantı verilen sayfaya yönlendirilir. Bağlantıları şimdi eklemeyeceğiz, fakat görüntünün bulunduğu sayfanın en üstüne bağlantı vermek için # işaretini ekleyeceğiz.
Öğe Resmi kutusu, resminizi fiilen eklediğiniz yerdir. Öğe Resmi kutusunun üzerine gelirken Resim Seç düğmesine tıklayın.
Yeni bir görsel yükleyebilir veya medya kitaplığında bulunan bir görseli seçebilirsiniz. Seçiminizi yaptıktan sonra Medya Ekle düğmesini tıklayın.
Yer tutucu resimleri değiştirerek, kalan öğelerimiz için de aynısını yaptık. Genel bölümündeki son kontrol Görüntü Oranları menüsüdür. Burası, resimlerinizin boyutunu ve oranlarını seçtiğiniz yerdir. Burada Küçük Resim, Kare, Manzara ve Portre dahil olmak üzere çeşitli seçenekler arasından seçim yapabilirsiniz. Görüntülerimizin boyutunu koruyarak Orijinal’i seçtik.
Stil sekmesine ve Stil bölümüne geçtiğimizde, yalnızca bir denetim olduğunu görüyoruz: Ofset Adımı kaydırıcısı. Bu kontrolü kaydırarak veya piksel sayısını girerek, kart destenizin üstünde olmayan resimleri az veya çok göstermek için kullanabilirsiniz. 50 piksel ile gittik.
Son bölüm, tamamen gezinme oklarınızın nasıl göründüğü ve davrandığıyla ilgili Kaydırıcı Gezinme Stili’dir. Burası, Simge Kitaplığından bir ok seçerek Önceki Gezinti Okları ve Sonraki Gezinti Okları olarak farklı ok simgeleri ayarlayabileceğiniz veya fareyle üzerine gelindiğinde görünen SVG Yükle düğmesine tıklayarak kendi ok simgelerinizi yükleyebileceğiniz yerdir. Bu durum galeriye resim eklemekle hemen hemen aynı şekilde çalışır ve biz de bunu yapacağız.
Bu sekmenin bir sonraki bölümü, gezinme oklarınızın Normal ve Fareyle Üzerine Gelme durumlarını yönetir.
Normal bölümünde, ilk olarak renk kontrolleri görünür: Gezinme Ok Rengi ve Gezinme Ok Arka Plan Rengi. Herhangi biri için bir renk girebilir veya seçiciden bir renk seçebilirsiniz. Gezinme Ok Rengi (#1e1e1e) için çok açık bir gri seçeceğiz, fakat Gezinme Oku Arka Plan Rengine dokunmayacağız.
Sırada, Gezinme Ok Boyutu kaydırıcımız var. Bir değer girebilir veya istediğiniz yere kaydırabilirsiniz. 22 piksel olarak ayarlayacağız.
Gezinme oku arka planının boyutunu değiştirmek istemeniz durumunda Gezinme Oku Tutucu Yüksekliği ve Gezinme Oku Tutucu Ağırlığı sürgüleri vardır. Bu eğitimde onları kullanmayacağız.
Son olarak Üst Gezinme Kenar Boşluğu, Gezinme Sol Uzaklığı ve Oklar Arasındaki Boşluk kaydırıcıları, kaydırıcının kendisindeki görüntülere veya birbirlerine göre okların konumunu değiştirmek için kullanılır. Navigation Margin Top’u 6 piksele, Navigation Left Offset’i %2,7’ye ve Oklar Arasındaki Boşluğu 28 piksele ayarlayacağız.
Gezinme oklarınızın üzerine gelme davranışını yöneten sekmenin Fareyle Üzerine Gelme bölümünde, önemli bir ekleme dışında Normal ile aynı ok stil seçeneklerine sahip olduğunu görebilirsiniz: Vurgulu Ok Hareketini Etkinleştir menüsü. Varsayılan değeri olan Evet’te bırakacağız, yani ok fareyle üzerine gelindiğinde hareket eder. Diğer tüm kontrolleri olduğu gibi bırakacağız.
Ve işte karşınızda: Kaydırıcınız bitti.
Zarif bir vitrin ve onu kurabileceğiniz neredeyse sınırsız sayıda yoldan yalnızca biri.
Çözüm Yolu
Elementor için Qi Eklentileri ile, WordPress web sitenize kart kaydırıcı gibi dikkat çekici ve ilgi çekici bir widget eklemek yalnızca birkaç dakikanızı alır. Bu tür gösterişli, göze çarpan bir özelliği kullanabilecek bir web sitesi tasarlıyorsanız, artık Elementor için Qi Eklentilerinin sizi kapsadığını biliyorsunuzdur. Ve Elementor’un ücretsiz sürümüyle birlikte kullanıyorsanız, Addons’ın tüm harika özellikleri tamamen ücretsiz olarak parmaklarınızın ucunda olacak.