WordPress'te Flipbox Kaplamaları ve Fareyle Üzerine Gelme Efektleri Nasıl Oluşturulur

WordPress sitenize flipbox kaplamaları ve resim fareyle üzerine gelme efektleri eklemek ister misiniz?

Yüksek kaliteli bir WordPress teması kullanıyor olsanız bile, özelleştirme seçenekleriyle sınırlı hissedebilirsiniz. Bu durumda, sitenize göz alıcı animasyon efektleri eklemek için flipbox'ları ve resim fareyle üzerine gelme efektlerini kullanabilirsiniz.

Bu makalede, WordPress sitenize flip box kaplamaları ve resim fareyle üzerine gelme efektleri eklemeyi göstereceğiz.

Flipbox Nedir?

Flipbox, üzerine fare imlecini getirdiğinizde dönen bir kutudur. Bu fareyle üzerine gelme efektini resimler ve metin kutuları gibi içeriklere ekleyebilirsiniz.

GIF'ler ve duyarlı kaydırıcılar gibi diğer animasyonlu içeriklere benzer şekilde, flipbox efekti onu daha etkileşimli ve ilgi çekici hale getirebilir. Örneğin, bir yazarın fotoğrafını ve adını gösterebilir ve ardından bir okuyucu üzerine geldiğinde biyografisini ortaya çıkarmak için bir flipbox animasyonu kullanabilirsiniz.

Bir WordPress serbest çalışanıysanız, müşterilerinizin logolarını gösterebilir ve ardından her projeye bir bağlantı göstermek için bir çevirme animasyonu kullanabilirsiniz.

Bu animasyonlu efektler web sitenizin kullanıcı deneyimini geliştirebilse de, aşırıya kaçmamak önemlidir. Çok sayıda animasyon bunaltıcı ve kafa karıştırıcı olabilir ve hatta web sitenizin performansını etkileyebilir.

Bununla birlikte, WordPress web sitenize flipbox kaplamaları ve resim fareyle üzerine gelme efektleri nasıl ekleyebileceğinize bir göz atalım.

WordPress'te Flipbox Kaplamaları ve Fareyle Üzerine Gelme Efektleri Nasıl Oluşturulur

WordPress'e animasyon eklemenin, SeedProd sayfa oluşturucusunu kullanmak veya özel kod yazmak dahil olmak üzere birçok farklı yolu vardır.

Ancak, flipbox ve fareyle üzerine gelme efektleri oluşturmanın en iyi yolu Flipbox – Awesomes Flip Boxes Image Overlay eklentisini kullanmaktır. Bu ücretsiz eklenti, resim, metin ve eyleme çağrı düğmelerinin bir karışımını içeren birkaç farklı flipbox stiliyle birlikte gelir.

Yeni Bir Flipbox Oluştur

Yapmanız gereken ilk şey Flipbox – Awesomes Flip Boxes Image Overlay eklentisini kurmak ve etkinleştirmektir. Daha fazla ayrıntı için bir WordPress eklentisinin nasıl kurulacağına dair adım adım kılavuzumuza bakın.

Eklenti kurulup etkinleştirildikten sonra, ilk flipbox'unuzu Flip Box » Yeni Oluştur bölümüne giderek oluşturabilirsiniz.

Bu, kullanabileceğiniz tüm farklı şablonları gösterir.

Bu tasarımlardan herhangi birini kullanmak istemiyorsanız, 'Şablonları İçe Aktar'a tıklayın.

Kullanmak istediğiniz bir şablon görürseniz, onu WordPress blogunuza veya web sitenize eklemek için ‘İçe Aktar’a tıklayın.

Bir tasarım seçtikten sonra, 'Stil Oluştur' düğmesine tıklamanız gerekir.

Görünen açılır pencerede, flipbox tasarımı için bir ad yazın. Bu yalnızca referansınız içindir, bu yüzden istediğiniz herhangi bir şeyi kullanabilirsiniz.

Ayrıca 1., 2. veya 3. seçeneklerden birine tıklayarak hangi düzeni kullanacağınızı seçebilirsiniz.

Bu işlem tamamlandıktan sonra, ‘Kaydet’e tıklayın.

Flipbox'ınıza İçerik Ekleyin

Flipbox'un görünümünü Genel, Ön ve Arka Uç sekmelerini kullanarak değiştirebilirsiniz.

Yazı tiplerini, dolguyu ve kenar boşluklarını değiştirebilirsiniz. Bu ayarların çoğu kendi kendini açıklayıcıdır, bu nedenle ne kadar farklı efektler oluşturabileceğinizi görmek için gözden geçirmeye değer.

Kutunun görünümünden memnun kaldığınızda, içerik ekleme zamanı. Basitçe ekranın altındaki flipbox önizlemesine gidin ve üzerine fareyle gelin.

Göründüğünde, ‘Düzenle’ düğmesine tıklayın.

Flipbox'un ön yüzünde görünen başlığı değiştirmek için, bunu 'Ön Başlık' alanına yazabilirsiniz.

Bundan sonra, ‘Yazı Tipi Simgesi’ alanına tıklayarak ve ardından görünen açılır pencereden yeni bir resim seçerek ön simgeyi değiştirebilirsiniz.

Ardından, flipbox'un önüne bir resim ekleyebilirsiniz. 'Resim Yükle'ye tıklamanız ve ardından medya kütüphanesinden bir dosya seçmeniz veya bilgisayarınızdan yeni bir resim yüklemeniz yeterlidir.

Kullanmak istediğiniz bir resminiz yoksa, Canva gibi web tasarım yazılımlarını kullanarak bir tane oluşturabilirsiniz.

Ön flipbox'tan memnun kaldığınızda, arka tarafı tasarlamanın zamanı gelmiş demektir. Başlamak için, ‘Arka Bilgi’ kutusuna görüntülemek istediğiniz içeriği yazın.

Genellikle, ziyaretçileri ilgili bir sayfaya göndermek için bir harekete geçirici mesaj kullanmak istersiniz; örneğin popüler bir ürünün listesi, fiyat bilgileri veya başka bir içerik.

Eylem çağrısı düğmesinde görünen metni değiştirmek için, 'Backend Button Text' alanına yazmanız yeterlidir. Ardından 'Link' alanına hedef URL'yi ekleyebilirsiniz.

Son olarak, arka plan resmini değiştirmek için ‘Şimdi Yükle’ye tıklayın.

Flipbox'ın arkasının nasıl ayarlandığından memnun kaldığınızda, 'Gönder'e tıklama zamanı gelmiştir.

Önizleme şimdi tüm değişikliklerinizi gösterecek şekilde güncellenecektir.

Birden Fazla Flipbox Oluşturun

Bu noktada, 'Yeni Flipbox Ekle' bölümündeki '+' işaretine tıklayarak daha fazla kutu eklemek isteyebilirsiniz.

Bu, aynı stile sahip birden fazla flipbox oluşturmanıza ve ardından bunları sütunlara ve satırlara ayırmanıza olanak tanır.

Yukarıda açıklanan işlemi izleyerek artık daha fazla flipbox oluşturabilirsiniz.

Örneğin, fiyatlandırma planlarınızın her biri için bir flipbox oluşturabilirsiniz.

Flipbox'ı WordPress Sitenize Ekleyin

Flipbox'tan memnun kaldığınızda, eklentinin otomatik olarak sağladığı bir kısa kod kullanarak onu WordPress web sitenize ekleyebilirsiniz.

Ekranınızın sağ tarafında, ‘Kısa Kod’ kutusundaki değeri kopyalayın.

Artık flipbox'ı kısa kod kullanarak herhangi bir sayfaya, gönderiye veya widget'a hazır alana ekleyebilirsiniz.

Kısa kodun nasıl yerleştirileceğine dair adım adım talimatlar için lütfen WordPress'e kısa kod ekleme kılavuzumuza bakın.

Eklentide ayrıca, WordPress temanızın herhangi bir widget'a hazır alanına ekleyebileceğiniz bir flipbox widget'ı da bulunmaktadır.

Birden fazla flipbox animasyonu oluşturduysanız, kimliği bilmeniz gerekecektir. Bu bilgiyi almak için Flip Box » Flip Box bölümüne gidip ‘Kimlik’ sütununa bakabilirsiniz.

Aşağıdaki resimde, flipbox kimliği 1'dir.

Bu bilgilere sahip olduğunuzda, Görünüm » Widget'lar bölümüne gidin.

Burada '+' düğmesine tıklamanız gerekir.

Artık 'Flipbox' yazabilirsiniz.

Doğru widget göründüğünde, onu kenar çubuğuna, alt bilgiye veya benzer bir bölüme sürükleyip bırakmanız yeterlidir.

Flipbox widget'ı varsayılan olarak animasyonlarınızdan birini gösterecektir.

Bunun yerine farklı bir flipbox göstermek için, alanına kimliğini yazın.

Widget'ın görünümünden memnun kaldığınızda, ‘Güncelle’ye tıklayın.

Daha fazla bilgi için lütfen WordPress'te widget'ların nasıl ekleneceği ve kullanılacağı hakkındaki kılavuzumuza bakın.

Bu makalenin, WordPress sitenize flipbox kaplamaları ve fareyle üzerine gelme efektleri eklemeyi öğrenmenize yardımcı olduğunu umuyoruz. Ayrıca resim galerisi oluşturma rehberimize göz atmak veya uzmanlarımızın seçtiği en iyi WordPress kaydırıcı eklentilerini görmek isteyebilirsiniz.

Bu makaleyi beğendiyseniz, lütfen WordPress video eğitimleri için YouTube Kanalımıza abone olun. Bizi ayrıca Twitter ve Facebook'ta da bulabilirsiniz.