Web Tasarımı için Elementor'da Arka Plan Yerleşimi Nasıl Eklenir
Yayınlanan: 2024-07-01Elementor, web tasarımını her zamankinden daha kolay hale getiren, WordPress için lider bir sayfa oluşturucu eklentisidir. Öne çıkan özelliklerinden biri Arka Plan Yerleşimi seçeneğidir. Bu özelliği doğru bir şekilde kullanarak web sitenizin çekiciliğini ve estetiğini bir sonraki seviyeye taşıyabilirsiniz.
Elementor size birden fazla arka plan kaplama seçeneği sunar. Bu yazıda size bu seçeneklerin her biri hakkında adım adım kılavuz göstereceğiz. Öyleyse, web tasarımı için Elementor'da arka plan kaplamasının nasıl ekleneceği hakkındaki makaleye geçelim.
Elementor Arka Plan Yerleşimi Nedir?
Arka plan kaplaması, mevcut bir arka plan görselinin, deseninin veya renginin üzerine eklenen yarı şeffaf bir katmandır. Görsel olarak çarpıcı efektler oluşturmak için kaplamayı farklı renkler, opaklıklar, degradeler ve hatta desenlerle özelleştirebilirsiniz.
Arka Plan Yerleşimi, yerleşik olarak gelen Elementor eklentisinin temel bir özelliğidir. Hem ücretsiz hem de premium sürümlerde kullanabilirsiniz. Bu özellik özellikle düşük kaliteli görüntüler kullanıldığında veya herhangi bir arka planın üstünde metin sergilendiğinde kullanışlıdır.
Elementor Arka Plan Yerleşimi Türleri
Elementor'a ekleyebileceğiniz temel olarak üç tür arka plan kaplaması vardır. Bunlar:
1. Düz Renk Kaplama : Bir web bölümüne veya öğeye yalnızca düz renk kaplama ekler. Düz bir renk ve opaklık düzeyini seçerek bu kaplamayı özelleştirebilirsiniz.
2. Degrade Renk Kaplaması : Degrade, herhangi bir web bölümünün veya öğesinin arka planına çok renkli kaplama efektleri eklemenizi sağlar. Umarım degradenin ne olduğunu zaten biliyorsunuzdur. Veya bekleyin, bu konuyu daha sonra bu yazıda tartışacağız.
3. Görüntü Yer Paylaşımı : Bu özellik, çekiciliğini artırmak için görüntünün üzerine düz bir renk, doku veya desen katmanı uygulamanıza olanak tanır.
Özel notlar Elementor Arka Plan Yerleşimi Hakkında
Elementor'daki Arka Plan Yerleşimi seçeneği, içerik arka planına değil, yalnızca widget arka planına katmanlar eklemenizi sağlar.
Kaplama efektini doğrudan içerik arka planına eklemek için HappyAddons gibi ek bir eklentiye ihtiyacınız vardır.
Yani sitenizde hem Elementor hem de HappyAddons varsa, ihtiyacınız olan her yerde uygun arka plan kaplama seçeneğini kullanabilirsiniz. Yöntemleri inceleyelim.
Birinci Yöntem: Elementor'da Widget Arka Planına Kaplamalar Nasıl Eklenir?
Daha önce de söylediğimiz gibi, Elementor'a ekleyebileceğiniz üç tür arka plan kaplaması vardır. Şimdi size tüm bu tür arka plan katmanlarını Elementor widget'larına nasıl ekleyeceğinizi göstereceğiz.
Tip 01: Elementor Widget'ına Düz Renkli Arka Plan Kaplaması Ekleme
Umarım bölümünüz ve içeriğiniz hazırdır. Tüm bölümün Kapsayıcıyı Düzenle simgesini tıklayın .
Stil sekmesine gidin. İki seçeneğiniz olacak: Arka Plan ve Arka Plan Yerleşimi . Bu iki seçeneği kullanarak Elementor'a arka plan kaplamaları ekleyebilirsiniz.
Örneğin, Arka Plan'ı açın. Fırça simgesini seçin. Aşağıda, arka plana düz bir renk ekleyebileceğiniz Renk seçeneğini göreceksiniz.
Widget bölümünün arka plan kaplaması için bir renk seçtiğimizi görebilirsiniz.
Tip 02: Elementor Widget'ına Degrade Renkli Arka Plan Kaplaması Ekleme
Widget'ı tekrar seçin . Stil sekmesine gidin. Arka Plan seçeneğini genişletin.
Arka Plan Türü'nün yanındaki Degrade seçeneğini seçin . Altında daha fazla renk seçeneği görünen seçenekler göreceksiniz.
Şimdi degrade paletinizi oluşturmak için birincil ve ikincil renk seçin. Renklerin widget'ınızın üzerinde arka plan kaplaması olarak görüntülendiğini göreceksiniz.
Böylece widget arka planınız için degrade renkli arka plan kaplamaları oluşturabilirsiniz. Gradient'te başka birçok seçenek var. Umarım bunları kendiniz keşfedebilir ve kullanabilirsiniz.
Tip 03: Elementor Widget'ına Görüntü Arka Plan Kaplaması Ekleme
Görüntü katmanları için görüntüleri ve sağlam bir tasmayı bir arada kullanabilirsiniz. Görüntüyle birlikte düz bir renk kullanarak mükemmel bir kontrast oluşturarak yukarıdaki içeriğin daha iyi görünmesini sağlayabilirsiniz. Bunu nasıl yapacağımızı görelim.
Stil sekmesine gidin. Arka Plan Yerleşimi seçeneğini genişletin. Resim seçeneğini tıklayın. Yerel sürücüden veya medya kitaplığından bir görüntü seçmenize ve eklemenize izin verilecektir.
Arka Plan Kaplamasına bir resim eklediğimizi görebilirsiniz. Daha sonra içeriğe mükemmel uyum sağlayacak uygun bir konum seçin .
Arka Plan seçeneğini genişletin. Daha sonra görüntüye uygun, uygun bir düz renk seçin . Görüntünün üzerine bir katmanın eklendiğini göreceksiniz.
Arka Plan Yerleşimi seçeneğine gidin.
Elementor panelini aşağı kaydırarak Karışım Moduna gelin. Sağ taraftaki simgeye tıklayın. Karışım modlarının bir listesini açacaktır.
Listedeki tüm karışım ruh hallerini keşfederek beğendiğiniz bir ruh hali seçin . Görüntü üzerindeki etkisini göreceksiniz.
Arka plan kaplamasının ve metin renklerinin neredeyse benzer olduğunu görebilirsiniz. Bu nedenle, metnin daha iyi okunabilmesi için aralarında kontrast oluşturacak şekilde metin rengini değiştirdik.
Böylece Elementor widget'ının arka planına bir Arka Plan Kaplaması ekleyebilirsiniz.
İkinci Yöntem: Elementor'da İçerik Arka Planına Kaplamalar Nasıl Eklenir?
İçeriği arka plana yerleştirme işlemi yukarıdaki yöntemle tamamen aynıdır. Bu HappyAddons eklentisinin ücretsiz bir özelliğidir . Eklenti hakkında henüz fazla bilginiz yoksa HappyAddons'ın ne olduğunu keşfedin.
Kısacası HappyAddons , Elementor eklentisine eklenen heyecan verici bir eklentidir. 120'den fazla ek widget ve 20'den fazla özellik ile birlikte gelir. Bunları kullanarak Elementor'un sınırlamalarının üstesinden gelebilir ve sitenize daha heyecan verici işlevler ekleyebilirsiniz.
Peki HappyAddons'taki Arka Plan Yerleşimi seçenekleri nerede? İçerik widget'ını seçin . Gelişmiş sekmesine gidin. Bu sekmenin altında Arka Plan ve Arka Plan Yerleşimi seçeneklerini göreceksiniz.
Bu iki seçeneğin isimleri ile Elementor'un iki seçeneğinin isimlerinin birebir aynı olduğunu görebilirsiniz. Ve onların çalışma süreçleri de aynı. Süreci keşfedelim.
Tip 01: Eklenen İçeriğe Düz Renkli Arka Plan Kaplaması Ekleme
İçerik widget'ını seçin . Elementor panelindeki Gelişmiş sekmesine gelin. Arka Plan seçeneğini genişletin.
Düz bir renk seçin . Rengin içeriğin arka planına uygulandığını göreceksiniz.
Tip 02: Eklenen İçeriğe Degrade Renkli Arka Plan Kaplaması Ekleme
Yukarıdaki yöntemde olduğu gibi Arka Plan altında Degrade seçeneğini seçin . Birincil ve ikincil rengi ayarlayın. Renk paleti, Elementor tuvalindeki içeriğin arkasında görüntülenecektir.
Tip 03: Eklenen İçeriğe Görüntü Arka Planı Yerleşimi Ekleme
İçerik widget'ını seçin . Gelişmiş sekmesine gidin.
Arka Plan Yerleşimi seçeneğini genişletin. Resim alanına tıklayın.
Yukarıdaki yöntemde açıklandığı gibi yerel sürücünüzden veya medya kitaplığınızdan bir resim ekleyebileceksiniz. Umarım burada da bunu yapabilirsiniz.
Artık metin içeriğinin arka planda öne çıkmasını sağlamak için metin rengi değiştirildi. Umarım bu, içeriği artık daha iyi ve daha okunabilir hale getirmiştir.
Böylece Elementor'daki içeriğinize resim arka plan kaplamaları ekleyebilirsiniz.
Not: Elementor eklentileri genellikle siteleri biraz yavaşlatır. Ancak bu tür web sitelerini hızlandırmanın birçok yolu vardır. Web sitesi hızını nasıl optimize edeceğinizi keşfedin.
Son Notlar!
Günümüzde arka plan kaplaması eklemek çoğu profesyonel web sitesi tasarımcısı arasında yaygın bir uygulama haline geldi. Bu basit ve kolay bir web tasarım özelliğidir ancak web bölümlerinizi ve içeriğinizi muhteşem ve heyecan verici hale getirecek muazzam bir güce sahiptir.
Yıllar önce HTML ve CSS dilleriyle arka plan kaplamaları oluşturmak gerçekten çok zordu. Ancak Elementor onu esnek hale getirdi ve bu da HappyAddons eklentisiyle çok daha ileri götürüldü. Umuyoruz ki, blog gönderisini takip ederek artık web sitenizdeki arka plan ve içerikten oluşan büyüleyici kaplamalar oluşturabileceksiniz.
Bu özellikle ilgili hala sorun yaşıyorsanız lütfen yorum kutusundan veya canlı sohbet seçeneğinden bize ulaşın. Geçerli bir çözümle çok yakında size geri döneceğiz.