Son zamanlarda okuyucularımızdan biri bize herhangi bir WordPress temasına nasıl paralaks efekti ekleyeceğimizi sordu?
Paralaks efekti, arka plan görüntüsünün ön plandaki içeriğe göre daha yavaş kaydırıldığı günümüzde web'de popüler bir trend.
Bu eğitimde, herhangi bir WordPress temasına paralaks efektini kolayca nasıl ekleyeceğinizi göstereceğiz.
Ancak, WordPress'i hiç yüklemediyseniz, keşfedin Bir WordPress blog 7 adımlarını nasıl yüklenir et Nasıl bulmak yüklemek ve blogunuzda bir WordPress tema etkinleştirmek için
Ama neden burada olduğumuza dönelim.
Paralaks etkisi nedir?
Paralaks Etkisi, arka plan öğesinin ön plandaki içeriğe göre daha yavaş kaydırıldığı modern bir web tasarım tekniğidir. Bu efekt, arka plan görüntülerine derinlik katar ve onları etkileşimli hale getirir.
Bizim keşfedin 25 WordPress temaları ile bir web sitesi oluşturmak için paralaks
Paralaks efekti şu cihazlarda kullanılabilir: açılış sayfaları, satış sayfaları veya bir işletme web sitesinin ana sayfası. Uzun bir sayfada farklı bölümleri vurgulamanın harika bir yoludur.
çok premium WordPress temaları ana sayfalarında yerleşik bir paralaks etkisine sahiptir. Paralaks efektini çoğu eklentiyle de kullanabilirsiniz. WordPress sayfaların görsel oluşturulması.
Ancak, hepsi WordPress temaları yerleşik bir paralaks efekti sunmaz ve yalnızca paralaks efekti için görsel bir sayfa oluşturucu kullanmak istemeyebilirsiniz.
Paralaks efektinin herhangi bir WordPress temasına nasıl kolayca ekleneceğine bir göz atalım.
Yöntem 1: Bir eklenti kullanarak herhangi bir WordPress temasına paralaks efekti ekleyin
Bu yöntem, WordPress temanıza herhangi bir kod eklemenizi gerektirmez. Çoğu kullanıcı için daha kolaydır ve önerilir.
Yapmanız gereken ilk şey, eklentiyi yüklemek ve etkinleştirmek. Gelişmiş WordPress Arka Planları. Daha fazla ayrıntı için WordPress eklentisinin nasıl kurulacağına dair adım adım kılavuzumuza bakın.
Eklentiyi etkinleştirdikten sonra, paralaks efekti eklemek istediğiniz sayfayı düzenlemeniz gerekir. Yeni düğmeyi fark edeceksiniz "Gelişmiş WordPress Arka Planları»Görsel düzenleyici araç çubuğunda.
Üzerine tıklamak, eklemek istediğiniz çeşitli arka plan ayarlarını değiştirebileceğiniz bir açılır pencere açacaktır.
Öncelikle, arka plan olarak bir resim seçmeniz ve ardından seçeneği işaretlemeniz gerekir " Stretch'.
O zaman düğmeye tıklamanız gerekir Resim Seç Kullanmak istediğiniz bir resmi indirmek veya seçmek için. Büyük bir görüntü kullandığınızdan emin olun, aksi halde pikselli görünür.
Bundan sonra, efekti etkinleştirmeniz gerekir Paralaks Bir tür paralaks efekti seçerek. Deneyebileceğiniz çok sayıda stil vardır. Kullanılan en yaygın paralaks efekti kaydırmadır.
düğmesine tıklayın Ekle Devam etmek için.
Eklenti bir kısa kod sizinle ilgili Yayıncılık Düzenleyici. Bu gibi görünecek:
[nk_awb awb_type = "image" awb_stretch = "true" awb_image = "22" awb_image_size = "full" awb_parallax = "kaydırma" awb_parallax_speed = "0.5" awb_mouse_parallax_speed = "30" burada [/ nk_awb]
Değiştir " bu içerik Kendi içeriğinize göre sayfanızı kaydedin.
Web sitenizi ziyaret ederek eylemin devam ettiğini görebilirsiniz.
2. Yöntem: CSS ile herhangi bir WordPress temasına "Paralaks" efektini ekleyin
Bu yöntem, "HTML / CSS" hakkında bazı bilgilerin yanı sıra WordPress temalarının ve eklentilerinin nasıl çalıştığını bilmenizi gerektirir.
Öncelikle, WordPress medya kitaplığınıza, paralaks efekti için kullanmak istediğiniz görüntüyü ziyaret ederek yüklemeniz gerekir. medya> Yeni ekle '.
Keşfeterek daha ileri gidin WordPress blog medyayı organize etmek nasıl
Resmi yükledikten sonra, resmi WordPress medya kitaplığında düzenleyerek resmin URL'sini kopyalamanız gerekir.
Ardından, paralaks efektini görüntülemek istediğiniz sayfaya aşağıdaki HTML kodunu eklemeniz gerekir. Bu HTML kodunu şuraya da ekleyebilirsiniz: WordPress teması veya alt tema.
div class = "paralaks"> İçeriğiniz burada ...
Sonra aşağıdaki özel CSS kodunu WordPress temanıza eklemeniz gerekir.
.parallax {background-image: url ( "http://example.com/wp-content/uploads/2017/08/my-background-image.jpg"); yüksekliği: 100%; arka plan bağlanma: Sabit; Arka plan-konumu: merkezi; Arka plan-tekrar: no-tekrar; Arka plan boyutu: kapak; kenar sol: -410px; margin-right: -410px; } .parallax içeriği {genişliği: 50%; kenar: 0 otomatik; Renk: #fff; dolgu üstü: 50px; }
Arka plan resminin URL'sini kendi resminizle değiştirmeyi unutmayın.
Artık değişikliklerinizi kaydedebilir ve web sitenizi ziyaret edebilirsiniz.
Burada ! Artık paralaks efektini WordPress web sitenize ekleyebilirsiniz.
Ayrıca bazı temaları ve premium WordPress eklentilerini keşfedin
diğer kullanabilirsiniz WordPress eklentileri modern bir görünüm vermek ve blogunuzun veya web sitenizin kullanımını optimize etmek için.
Size, bu konuda yardımcı olacak bazı premium WordPress eklentileri sunuyoruz.
1. WooCommerce Bağışı
WooCommerce web sitenizdeki bu uzantı bağışlarını müşteriler tarafından belirtilen miktarlarda kabul edin. Bu onların istedikleri kadar vermelerini sağlayacaktır. Her bağış, normal bir ürünü olarak sunulabilir. WooCommerce.
Müşteri alışveriş sepeti sayfasını atlarsa veya bağış yapmadan doğrudan ödeme sayfasına giderse, ödeme sayfasının üzerinde bağış yapabilmeleri için bir bağlantı görünecektir.
WooCommerce Bağışını kullanmanın her adımı, ekran görüntüleriyle birlikte bir belgede açıklanmıştır. Eklentiyi etkinleştirin ve alışveriş sepetinde "Bağış ekle" alanını bulacaksınız.
Indir | gösteri | Web hosting
2. LinkedIn Daha Fazla
LinkedIn Plus, bir WordPress Plugin Bu, LinkedIn profilinizi blogunuzda sunmanıza olanak tanır. Aynı zamanda çok yazarlı bloglar için de çalışır. WordPress gönderilerinize, sayfalarınıza veya widget'larınıza Takip Et ve Paylaş düğmeleri ekler.
Blogunuza tüm LinkedIn özelliklerini eklemenin ve markanızı tüketicilerle doğrulamanın harika bir yoludur. Profilinizi potansiyel işe alımcılara veya işverenlere tanıtmak için görünümünü özelleştirmenize, ayarları yapılandırmanıza ve diğer gelişmiş seçenekleri etkinleştirmenize olanak tanır.
Indir | gösteri | Web hosting
3. YouTuber
YouTubeR bir WordPress Plugin Web sitenizden YouTube'a video yüklemenize ve YouTube videolarını, oynatma listelerini ve kanalları web sitenize kolayca yerleştirmenize olanak tanıyan benzersiz bir platform.
Bu eklenti ile, web sitenizde istisnai video galerileri oluşturma şansına sahipsiniz.
Diğer özellikleri ise: imkanı WordPress web sitenizden YouTube'a kolayca video yükleyin, entegrasyon web sitenize kolay videolar, oynatma listeleri ve YouTube kanalları, Visual Composer, çalma listelerinde sonsuz kaydırma, mükemmel önbellekleme, duyarlı düzen, ayrıntılı belgeler ve daha fazlası.
Indir | gösteri | Web hosting
Önerilen Kaynaklar
Web sitenizi oluşturmanıza ve yönetmenize yardımcı olacak diğer önerilen kaynaklar hakkında bilgi edinin.
- WordPress'te "Diske yazılamıyor" hatası nasıl düzeltilir
- Nasıl başarılı bir blogcu olun ve WordPress ile nasıl para kazanılır?
- WordPress e-posta ile makaleler yayımlamak nasıl
- Nasıl başarılı bir blogcu olun ve WordPress ile nasıl para kazanılır?
Sonuç
Hepsi bu! Umarız çok yardımcı olmuştur. Çekinme En sevdiğiniz sosyal ağlarda arkadaşlarınızla paylaşın.
Bununla birlikte, ayrıca bize danışabilirsiniz kaynakların bulunduğuİnternet siteleri oluşturma projelerinizi yürütmek için daha fazla elemana ihtiyacınız varsa, WordPress blog oluşturma.
Herhangi bir öneriniz veya yorumunuz varsa, bunları bölümümüzde bırakın. Yorumlar.
...
