WordPress'te Airbnb'den Esinlenen Bir Resim Galerisi Nasıl Oluşturulur

Bir WordPress kullanıcısı mısınız ve popüler kiralama platformu Airbnb tarafından kullanılan resim galerisinin ne kadar iyi göründüğünü fark ettiniz mi? Web sitenizde çoğaltmak istiyorsanız, daha fazla kendinizi yormayın! Doğru araç ve birkaç basit adımla 10 dakikadan daha kısa sürede hızlı bir şekilde yeniden oluşturabilirsiniz.

İster deneyimli bir WordPress kullanıcısı olun ister yeni başlayan biri olun, bu eğitim size işe başlamak için bilmeniz gereken her şeyi verecek!

Bu makale size aşağıdakileri öğretecektir:

• Modül nasıl kurulur
• Modula'da resim galerisi nasıl oluşturulur ?
• Resim galerisi bir Airbnb resim galerisi gibi görünecek şekilde nasıl özelleştirilir
• Ve daha fazlası …

Airbnb'nin Galeri Tasarımı

Özlü ve güçlü bir web sitesi tasarımı, dönüşüm yaratma ve müşterileri tekrar müşterilere dönüştürme başarısı için çok önemlidir. Airbnb'nin listeleme resim galerileriyle amaçladığı da budur.

Airbnb resim galerisinin neden popüler olduğunu keşfedelim:

• Konumun yüksek kaliteli profesyonel çekimleri
• Ana görsellerin basit, temiz ve kullanıcı dostu yerleşimi
• Tüm galerinin temiz bir görüntüsü
• Bir ışık kutusu aracılığıyla tüm fotoğraflar arasında kolayca gezinme yeteneği
• Her görüntü için alt yazı veya açıklama görüntüleme
• Lightbox görüntü geçiş efektleri
• Çeşitli kanallar aracılığıyla galeri paylaşım seçenekleri
• Gezinme okları

Neyse ki, Modula eklentisi ile Airbnb galeri stilini WordPress'te kolayca yeniden oluşturabilirsiniz. Birkaç kolay ayar yapın ve hepsi bu! Okumaya devam edin, bunu yapmanın ve resim galerinizi Airbnb benzeri bir resim galerisine dönüştürmenin ne kadar kolay olduğunu göreceksiniz.

Airbnb'deki Gibi Çarpıcı Bir Resim Galerisi Oluşturun

Resim galerinizi kurmak için bir WordPress web sitesine ve bir barındırma sağlayıcısına ihtiyacınız olacak, bu nedenle adımlara geçmeden önce bunu aklınızda bulundurmanız çok önemlidir. Halihazırda bir web siteniz yoksa, WordPress kurulum kılavuzundaki talimatları izleyerek hızlı bir şekilde bir web sitesi oluşturabilirsiniz.

Web siteniz çalışmaya başladığında, resim galerinizi oluşturmaya yardımcı olması için bir eklenti seçmeniz gerekecek. WordPress deposunda başka resim galerisi eklentileri olmasına rağmen, kullanmanızı tavsiye ettiğimiz Modula'dır. Bu eklenti birçok özelleştirme seçeneğine, temel özelliklere sahip ücretsiz bir sürüme sahiptir ve kullanıcı dostudur.

Bu tür bir resim galerisi oluşturmak, Başlangıç ​​planını 39$'a satın alarak kilidini açabileceğiniz birkaç ayar gerektirir. Satın alma işleminizi gerçekleştirdikten sonra, Airbnb'de olduğu gibi bir galeri oluşturmak ve sergilemek için dört ana adım vardır.

️ Modula'yı yükleyin

İlk adım, Modula'yı yüklemek ve etkinleştirmektir. Bunu yapmak için WordPress Dashboard > Eklentiler > Yeni Ekle seçeneğine gidin.

Yeni açılan sayfanın sağ üst köşesinde bir arama çubuğu göreceksiniz. 'Modula' yazdığınızda, hızlı bir şekilde ilk arama sonucunda görünecektir. Kuruluma başlamak için Şimdi Kur düğmesine tıklayın.

️ Bir resim galerisi oluşturun

Modula'yı kurup etkinleştirdikten sonra Airbnb benzeri galerinizi oluşturmanın zamanı geldi. WordPress Dashboard'unuza gidin, ardından Modula > Galleries'i seçin.

Oradan, galerinizi oluşturmaya başlamak için Yeni Ekle'yi seçin.

Galerinize bir başlık ekleyebileceğiniz yeni bir pencereye yönlendirileceksiniz ve yeni resimler yüklemek istiyorsanız Resim dosyalarını yükle'yi veya zaten içe aktarılmış resimleri kullanıyorsanız Kitaplıktan Seç'i seçin .

Resimleriniz galeriye eklendikten sonra bu şekilde görmelisiniz. Buradan galeriyi özelleştirmeye başlayabilir ve onu bir Airbnb resim galerisine mümkün olduğunca yakın hale getirebiliriz.

️ Resim galerisini düzenleyin

İşte eğlenceli kısım geliyor. Modula'nın çeşitli özelleştirme seçenekleri vardır, bu nedenle onu Airbnb'nin resim galerisi tasarımına yaklaştırmak oldukça kolay olacaktır.

İlk olarak, bir Airbnb kaydını tıkladığınızda, tıklandığında tüm galeri resimlerini içeren bir ışık kutusu açan sınırlı sayıda resimle (tam olarak beş tane) karşılaşacaksınız. Bunu yeniden oluşturmak için Modula galeri düzenleme modunda aşağı kaydırın ve Modula'nın tüm özelleştirme ayarlarını görün.

Varsayılan olarak, galeri türü Creative Gallery olarak ayarlanmıştır, ancak şimdi onu Custom Grid olarak ayarlamamız gerekiyor. Ardından, ilk beş görüntünün köşelerini sürükleyin ve bu şekilde dolması için genişletin.

İlk bakışta göreceğiniz görüntü sayısını sınırlamak için Genel sekmesi altında Maks. Görüntü Sayısı bölümü bulacaksınız. Devam et ve onu beşe ayarla.

Ardından, Airbnb galeri resimleri arasında biraz boşluk olduğunu fark ediyoruz. Benzer bir sonuç elde etmek için Cilt Payı değerini birkaç piksel düşürün. Varsayılan olarak 10 piksel olarak ayarlanmıştır, ancak masaüstü değerini 8'e düşürebilirsiniz. Hangisinin daha iyi olduğunu görmek için tablet ve telefon değerleriyle de oynayabilirsiniz.

Ardından, Lightbox & Links sekmesine gidin ve lightbox'ı açtığınızda tüm galeri resimlerinizi görüntülemek için Tüm resimleri göster düğmesini etkinleştirin. Bu adımı atlarsanız, ışık kutunuz yalnızca ilk beş görüntü arasında geçiş yapar.

Ardından, farenizi Airbnb galerilerinin üzerine getirdiğinizde hoş bir fareyle üzerine gelme efekti fark ediyoruz. Modula ile farenin üzerine gelme görünümünü düzenleyebilirsiniz. Vurgulu efektler sekmesine gidin, fareyle üzerine gelme rengini daha koyu bir griye ayarlayın ve opaklığı %25'e düşürün.

Airbnb'deki gibi bir işaretçi simgesi olacak şekilde fareyi görüntünün üzerine getirdiğinizde İmleç simgesini de değiştirebilirsiniz.

İnsanların resimler arasında gezinmesini kolaylaştırmak için Işık Kutusu ve Bağlantılar altında şu ayarları açabilirsiniz: Küçük resimler düğmesi , Küçük resimleri otomatik başlat , Altta küçük resimler.

Bazı Airbnb kayıtlarında her resmin altında altyazılar görüntülenebilir. Modula, altyazıları kolayca ayarlamanıza olanak tanır. Işık Kutusu ve Bağlantılar ayarları altındaki Resim başlığını göster'e tıklamayı unutmayın. Resim yazısının konumunu ışık kutusunun solunda, sağında veya ortasında görüntülenecek şekilde bile ayarlayabilirsiniz. Altyazılar sekmesi altında, altyazılarınızı düzenlemek için daha fazla seçeneğiniz olacaktır. Mobil sürüm için renk, yazı tipi, yazı tipi boyutu, yazı stili ve hatta yazı tipi boyutunu ayarlayabilirsiniz.

Airbnb galerisinde ışık kutusunu açtığınızda, resim galerisinde dolaşmanıza yardımcı olacak gezinme düğmelerini fark edebilirsiniz. Modula size bu işlevi de sunuyor. Işık Kutusu ve Bağlantılar sekmesi altındaki Gezinme düğmeleri ayarını açın.

Airbnb'deki lightbox'a gelince, düz siyah bir arka plan rengi göreceksiniz. Bunu Modula ile de başarabilirsiniz. Aynı Işık Kutusu ve Bağlantılar sekmesi altında, Işık Kutusu arka plan rengini görene kadar aşağı kaydırın. Burada istediğiniz rengi ayarlayabilir ve opaklığı belirleyebilir veya düz bir renk yapabilirsiniz.

Airbnb, kaydı çeşitli sosyal kanallarda paylaşmak için ışık kutusunda bir paylaşma düğmesine sahiptir. Modula ayrıca en popüler platformlardan bazılarına erişim sunan bu işlevselliğe sahiptir. Aynı Işık Kutusu ve Bağlantılar sekmesi altında, Paylaş düğmesi seçeneğini etkinleştirdiğinizde altı yeni paylaşım seçeneğinin belirdiğini göreceksiniz: Facebook, Twitter, Pinterest, WhatsApp, LinkedIn ve E-posta. Galerinizde hangilerinin görünmesini istediğinizi ayrı ayrı seçebilirsiniz.

Airbnb'deki ışık kutusu, kullanıcıların ışık kutusu galerisini kapatmak için tıklayabilecekleri görünür bir kapatma düğmesine sahiptir. Modula ile de bir kapatma butonu görüntüleyebilirsiniz.

Son olarak, ayarları kaydetmek için Galeriyi Güncelle'ye tıklamayı unutmayın.

Airbnb'de gösterilen ilk beş resimden birine tıkladığınızda, resim galerisinin tamamına yönlendirileceksiniz. Ancak resimlerden birine tekrar tıkladıktan sonra ışık kutusu açılacaktır. Modula ile bunu başarmak için Galeriler'e gidebilir ve az önce oluşturduğunuz galeride Çoğaltılmış galeri'yi seçebilirsiniz. Yeni bir tane görünecek ve sonra onu özelleştirebiliriz.

Yeni oluşturulan galeri ile devam edin ve beğendiğiniz bir düzen elde edene kadar özel ızgarayla oynayın.

Genel ayarlara inmeyi ve Maks Görüntü Sayısındaki 5'i silmeyi unutmayın. Yeni düzenlenen galeriyi kaydedin ve sağdaki kısa kodu kopyalayın.

️ Galerinizi görüntüleyin

Yapacağımız ilk gösterim, galerinin tamamıdır.

WordPress Dashboard'unuza gidin ve Sayfalar > Yeni Ekle'yi seçin. Bu sayfa, resim galerisinin tam görüntüsü olarak hizmet edecektir. Müstehcen bir başlık verin ve kısa kodu Kısa Kod bloğuna yapıştırın.

Ardından, Yayınla veya Güncelle düğmesine basın. Daha sonra, bu sayfanın URL'sini kopyalayın. Bu URL'ye birazdan ihtiyacımız olacak.

Airbnb benzeri resim galerisinin görüntülenmesini istediğiniz sayfaya gidin ve oluşturduğumuz ilk galerinin kısa kodunu yapıştırın.

Yapmamız gereken son şey bu iki galeriyi birbirine bağlamak. Modula > Galeriler'e gidin ve oluşturduğumuz ilk galeriyi seçin. İlk görüntüyü düzenlemek için kalem simgesine tıklayın.

Düzenleme bölümüne girdikten sonra, tam galeri sayfası URL'sini URL kutusuna yapıştırın. Kaydet&Kapat düğmesine tıklayın.

Aşağıdaki dört resim ile bu işlemi tekrarlayın ve Galeriyi Güncelle düğmesine tıklamayı unutmayın.

Sayfanıza gidin ve yeni oluşturduğunuz Airbnb benzeri resim galerinizi görün

Nihai sonuçlar: Airbnb ve Modula

Gördüğünüz gibi Modula ile Airbnb resim galerisi tasarımına çok yaklaşabilirsiniz. Aralarında hafif boşluk bulunan beş resimli düzenden altyazılı ışık kutusuna, gezinme oklarına, sosyal paylaşım düğmelerine ve hatta özel bir ızgarada görüntülenen tüm resimleri içeren ara sayfaya kadar.

Modula, resim galerinizi bir sonraki seviyeye taşımak için daha da fazla özellik ve ayarla ötesine geçen çok yönlü bir resim galerisi eklentisidir.

Son düşünceler

İyi tasarlanmış bir web sitesi, kaç ziyaretçinin dönüşüm sağladığını ve hizmetlerinizi tekrar kullandığını önemli ölçüde etkileyebilir. Doğru eklenti ve birkaç kolay adımla Airbnb'den ilham alan bir WordPress resim galerisini hızlı bir şekilde oluşturabilirsiniz. Bu tür bir galeri, yüksek kaliteli resimleri sergilemek ve web sitenizin ziyaretçilerine samimi bir kullanıcı deneyimi sunmak için harika bir yöntemdir.

Galerinizi tatil kiralama, emlak ilanları veya başka herhangi bir nedenle kullanıyor olun, Modula, web sitenizin ziyaretçilerini çeken ve onlarla bağlantı kuran Airbnb'den ilham alan bir resim galerisi oluşturmak için en iyi WordPress eklentisidir.

Modula'yı bugün edinin ve resim galerilerinizi özelleştirmeye başlayın!