Metin kayan yazı öğesi, herhangi bir web tasarımcısının hile çantasına hoş bir ek olabilir. Bir sayfaya biraz hareket ekleyerek tamamen hareketsiz kalmasını engeller. Resimler, statik metin ve düğmeler gibi diğer öğelerle iyi çalışır. Son olarak doğru eklentiyle, web sitesinin tasarımına uyacak şekilde eklemek ve stilize etmek inanılmaz derecede kolay olabilir.
Metin kayan yazılarla ilgili en iyi şeyleri – çok yönlülük, kullanım kolaylığı ve şık görünüm – bir araya getirdik ve bunları basit bir Metin Kayan Yazı widget’ında size getirdik. Elementor için özel yapım widget’ların en büyük ücretsiz koleksiyonu olan WordPress Addons for Elementor’u oluşturan altmış widget’tan biridir.
Eklentideki tüm harika pencere öğelerini keşfetmekten memnuniyet duysanız da, bu fırsatı Metin Seçim Çerçevesi bileşeninin kullanılabileceği bazı şeyleri göstermek için kullanacağız. Umarız, sizi kendi harika kayan yazılarınızı yaratmaya yönlendirir.
Ve Gutenberg editörüyle çalışmayı tercih ederseniz, merak etmeyin – biz sizi koruduk. WordPress Blocks for Gutenberg eklentimiz bir Metin Kayan Yazı bloğuna sahiptir.
Makalede şunları okuyacaksınız:
-
Elementor için WordPress Eklentileriyle Metin Seçim Çerçevesi Oluşturma
-
Seçim Çerçevesinin İçeriğini Düzenleme
-
Seçim Çerçevesini Şekillendirmek
-
Son Dokunuşları Uygulamak
-
Gutenberg için WordPress Blokları ile Metin Seçim Çerçevesi Oluşturma
Elementor için WordPress Eklentileriyle Metin Seçim Çerçevesi Oluşturma
Widget yalnızca Elementor ile çalıştığından, öncelikle bu popüler sayfa oluşturucuyu yüklediğinizden ve etkinleştirdiğinizden emin olmalısınız. Elementor eklentisi için WordPress Eklentilerimiz, Elementor’un ücretsiz veya profesyonel sürümüyle eşit derecede harika çalışır.
Kısa not: Okumak yerine izlemeyi tercih ederseniz, kılavuzun bu bölümüyle aşağı yukarı aynı noktaları kapsayan bir videoyu burada bulabilirsiniz.
Elementor ve WordPress Eklentilerini yükleyip etkinleştirdikten sonra, bir gönderiye veya sayfaya gidin. Bu durum mevcut bir gönderi veya sayfa olabilir veya içinde oynamak için yeni bir tane oluşturabilirsiniz. Sayfa veya gönderi açıldığında ve onu Elementor ile düzenlediğinizde, Metni aramak için sol taraftaki menüyü kullanmanız yeterlidir. Kayan yazı widget’ı. İlk ücretsiz bölüme sürüklemek bizi başlatacak.
Bu durum eklenti sayfasındaki gibi bir örneği nasıl yaptığımızı size göstereceğimiz alandır.
Seçim Çerçevesinin İçeriğini Düzenleme
Seçim çerçevesinin içeriğini düzenlemek oldukça basittir. Seçim çerçevesinin metni birkaç bölümden oluşur – sol taraftaki menüde görebileceğiniz öğeler. Daha fazla metin bölümü eklemek istiyorsanız Öğe Ekle düğmesine basın. Bir öğeyi kaldırmak, her öğenin yanında “x” ile işaretlenmiş düğmeye basmak kadar basittir. Ürün sayısını ikiye indirmeyi tercih ettik.
Öğenin metnini değiştirmek için üzerine tıklamanız yeterlidir. Stil menüsünde metni biçimlendirmek için pek çok seçeneğiniz olacak. Fakat şimdilik burada yapabileceğiniz tek şey öğelerin söylediklerini değiştirmek. İkimizi de “Otomatik kaydırma” olarak değiştirdik.
Artık seçim çerçevesinin içeriği ayarlandığına göre, onu şekillendirmeye geçebiliriz.
Seçim Çerçevesini Şekillendirmek
Stil seçenekleri, istediğiniz rengi seçebileceğiniz veya onaltılık bir kod girebileceğiniz bir renk seçiciyle açılır. Bununla birlikte Tipografi seçenekleriyle daha çok ilgileniyoruz, çünkü yazı tipini, boyutunu, ağırlığını, stilini ve ayrıca satır yüksekliğini ve aralığını seçebileceğimiz yer burasıdır.
Orada birkaç seçeneği değiştirdik. Yazı tipini Montserrat olarak değiştirdik, harflerin boyutunu 160 piksel olarak değiştirdik. Ağırlık seçeneğini 700 yaparak başlığı kalın hale getirdik ve büyük harfe çevirdik.
Bir sonraki ilginç seçenek, metin konturu efektidir – onu “evet” olarak değiştirdik ve metnimizi bir taslak haline getirdik. Bu durum metin kontur rengini değiştirmek için ek seçenekler açtı – bizimkini #dbdbdb olarak değiştirdik – ve değiştirmediğimiz metin kontur genişliğini. Son seçenek, öğeler arasındaki boşluğu değiştirmenize izin verir – bizimkini 30 olarak değiştirdik.
Son Dokunuşları Uygulamak
Oluşturduğumuz örnek, seçim çerçevesi metnimizin bir görüntünün altından ve bazı metnin üzerinden geçtiği bir örtüşme içeriyor. Seçim çerçevesinin kendisi tam genişlikte, kutulu değil. Seçim çerçevesini içeren bölüm için Bölümü Düzenle düğmesine basarak ve ardından Düzen seçeneklerinde içerik genişliğini tam genişliğe ayarlayarak bunu değiştirdik.
Resim ve metin için, biri bölüm başlığı widget’ı, diğeri resim widget’ı içeren iki sütunlu bir bölüm ekledik. Daha sonra tüm bölümü aldık ve gelişmiş seçeneklerinde üst kenar boşluğunu -90 olarak ayarladık.
Bununla işimiz bitti – yapmak için yola çıktığımız örneği yarattık.
Gutenberg için WordPress Blokları ile Metin Seçim Çerçevesi Oluşturma
Gutenberg editörünü ve WordPress Blocks eklentisini kullanarak WordPress web sitenizde nasıl bir metin çerçevesi oluşturabileceğinizi görelim. Gutenberg’de Text Marquee bloğu ile bir metin kayan yazı eklemenin ne kadar kolay olduğunu göstermek için bloğun web sayfasındaki tasarımlardan birini kullanacağız.
Arka plan görüntüsü oluşturmak için Advanced Columns bloğumuzu kullanarak bir sayfa hazırladık. Bloğu tek bir sütunu tam genişlikte gösterecek şekilde ayarlamak ve bir arka plan görüntüsü seçmek kadar kolaydı. Görüntü ayarları için, konum olarak Merkez Merkez, arka plan tekrar kuralı olarak Tekrar yok ve boyut olarak Kapak’ı seçtik. Hatta üst ve alt kısımlara biraz dolgu ekledik.
Bununla Text Marquee bloğunu eklemeye hazırdık. Sağ taraftaki seçenekler panelinde ilk olarak içerik seçenekleri gelir. Seçim çerçevesi için metin eklemek, bir ayırıcı simgesi ayarlamak, animasyonun süresini seçmek ve metnin yönünü tersine çevirmek için kullanılan birkaç öğe içerirler.
Mevcut üç öğedeki metni değiştirdik ve dördüncüsünü ekledik.
Seçim çerçevesine stil verme seçenekleri arasında metin rengini ve tipografiyi seçme, metin konturu efektlerini etkinleştirme ve metin kenar boşluğunu ayarlama yer alır.
Rengi #ffffff ve yazı tipi boyutunu 120px olarak ayarlıyoruz. Metin aralığını da 67px olarak ayarladık.
Gutenberg editörünü ve Gutenberg için WordPress Blocks eklentisini kullanarak WordPress’e bir metin çerçevesi eklemek işte bu kadar kolay.
Konunun Özeti
WordPress, Elementor gibi sayfa oluşturucular ve Elementor için WordPress Eklentileri gibi eklentiler sayesinde sonsuz özelleştirme seçenekleriyle birlikte gelir. Size birkaç tıklamayla nasıl harika bir metin kayan yazı oluşturabileceğinizi ve hatta onu bir resimle nasıl oluşturabileceğinizi gösterdik. Ama şüphesiz, bu parçacığı kullanmanın ve onu gerçekten kendinize ait yapmanın farklı bir yolunu bulacaksınız. Metin kayan yazı, içeriğinizi gerçekten öne çıkarmak için diğer heyecan verici metin efektleriyle birleştirilebilir. WordPress’te büyük harf eklemek gerçekten olabildiğince basittir ve güzel, zarif bir görünüm oluşturmaya yardımcı olur. Geri kalanından öne çıkarmak istediğiniz metin parçalarınız veya bilgileriniz varsa, dinamik metin gönderileri oluşturmak için modern ve ilgi çekici bir çözüm olan bir vurgulama efekti eklemeyi düşünün.