Çok renkli bir degrade düğmesi oluşturmak ister misiniz? Elementor ?
Varsayılan olarak, Elementor düğmeniz için degrade renk oluşturma özelliği vardır, ancak bu yalnızca iki renkle sınırlıdır. Bu makale size çok renkli bir degrade düğmesinin nasıl oluşturulacağını gösterecektir. Elementor bir eklentinin yardımı olmadan, yalnızca Elementor'un özel CSS'sini kullanarak.
Düğmenize çok renkli bir gradyan eklemek, düğmenizin çekici görünmesini ve doğal bir his vermesini sağlayabilir. Merak ediyor olabilirsiniz, “Arkanızda çok renkli bir gradyan düğmesi oluşturmak mümkün mü? web sitesi? ”. Elementor ile her şey mümkün ve kolayca çok renkli bir degrade düğmesi oluşturabilirsiniz.
Elementor'da Çok Renkli Degrade Düğmesi Nasıl Oluşturulur
Öğreticiye başlamadan önce, bu öğreticinin özel CSS ile çalışacağını size bildirmek istiyoruz. Özel CSS özelliği yalnızca şurada kullanılabilir: Elementor Pro; bu nedenle pro sürümüne yükseltme yaptığınızdan emin olun.
Şimdi Elementor düzenleyicinize gidin. Sıfırdan başlayacağız, bu yüzden sadece bir sütunlu bir bölüm oluşturun. Ardından, lütfen widget panelindeki düğme widget'ını seçin, ardından Elementor'un düzenleme alanına sürükleyip bırakın. Düğme widget'ını ekledikten sonra, widget'ı tercihlerinize göre düzenleyebilir ve biçimlendirebilirsiniz.
Widget ayarlarında sekmeye gidin gelişmiş -> Özel CSS. Aşağıdaki CSS snippet'ini kopyalayın ve ardından özel CSS alanına yapıştırın.
selector .elementor-button {
background: linear-gradient(121.28deg, #A4006C 0%, #FFECA8 100%), linear-gradient(121.28deg, #69003F 0%, #FFF8F8 100%), linear-gradient(238.72deg, #00FFFF 0%, #0212A4 100%), radial-gradient(67.16% 100% at 50% 0%, #FF00B8 0%, #FFFFFF 100%), linear-gradient(140.54deg, #7000FF 0%, #001AFF 72.37%), linear-gradient(307.43deg, #FFE927 0%, #00114D 100%), radial-gradient(107% 142.8% at 15.71% 104.5%, #FFFFFF 0%, #A7AA00 100%), #FFFFFF;
background-blend-mode: overlay, difference, difference, overlay, difference, difference, difference, normal;
}
Uygulanan çok renkli degradeden memnunsanız (yukarıdaki resimde olduğu gibi) bu şekilde tutabilir ve dilerseniz projenizi kaydedebilirsiniz. Ancak, onu özelleştirmek istiyorsanız, bunu, CSS snippet'ini daha spesifik olarak CSS bildirim bloğunda değiştirerek yapabilirsiniz.
CSS bildirim bloğu, bir açılış ayracı ile başlar ( {'' ) ve kapanış sağ parantez('') ile biter} ).
Bildirim bloğunu almak için, kullanarak bir degrade oluşturabilirsiniz. araçları çevrimiçi degrade css. Cliquez ici biraz görmek araçları CSS gradyanı. Degradeyi oluşturmayı tamamladığınızda, CSS'yi kopyalayın ve CSS'yi yapıştırarak mevcut bildirim bloğunu yenisiyle değiştirin.
Not: Ayrıca yapabilirsiniz Elementor'da degrade başlığı oluştur .
Şimdi Elementor Pro'yu Alın !!!
Sonuç
Bu makale, Elementor'da çok renkli bir degrade düğmesini ne kadar kolay oluşturabileceğinizi gösterir. Elementor'ı sayfa oluşturucu olarak kullanıyorsanız, web sitesi WordPress ve çok renkli bir gradyan ile çarpıcı bir düğme oluşturmak istiyorsanız, bu makale sizin çözümünüz olabilir.
Tek renkli veya iki renkli düğmeler basit ve sıkıcı görünebilir. Ancak düğmelerinizde çok renkli degradeler oluşturmaya dikkat edin. Düğmelerinizin tuhaf ve sıkıcı görünmemesi için lütfen kullandığınız ton ve renk karışımına dikkat edin.
Buraya ! Size nasıl olduğunu gösteren bu makale için bu kadar Elementor'da çok renkli degrade düğmesi oluştur. Oraya nasıl gideceğinizle ilgili herhangi bir endişeniz varsa, bize içinde bildirin. Yorumlar.
Ancak, ayrıca kaynaklarımızİnternet siteleri oluşturma projelerinizi yürütmek için daha fazla elemana ihtiyacınız varsa, WordPress blog oluşturma ya da Divi: Tüm zamanların en iyi WordPress teması.
Ama bu arada, bu yazıyı farklı sosyal ağlarda paylaş.
...
