Divi Eklentisi Vurgusu: Caldera Forms Divi ve Extra için Stil Özelleştirici

Yayınlanan: 2017-10-29

Caldera Forms, web sitenizin stiline uyum sağlama konusunda harika bir iş çıkarıyor. Divi ve Extra Theme Customizer'ın tanıdık şekillendirme araçlarını kullanarak stil vermek isterseniz ne olur? Bunu, Divi ve Extra için Caldera Forms Style Customizer adlı üçüncü taraf eklentisiyle yapabilirsiniz.

Caldera Formları, standart Tema Özelleştirici seçenekleri kullanılarak şekillendirilebilir, ancak bu seçenekler temayı şekillendirir. Bu, form metninizin stilini değiştirirseniz, web sitenizin gövde metninin stilini de değiştireceğiniz anlamına gelir. Formlarınızı içeriğinizden ayrı olarak biçimlendirmek istiyorsanız, normalde CSS ile elle stil oluşturmanız gerekir. Caldera Forms Style Customizer for Divi ve Extra, Theme Customizer'a stil özellikleri ekleyerek bu sorunu çözer.

Bu eklenti vurgusunda, Divi ve Extra eklentisi için Caldera Forms Style Customizer'a bir göz atacağız ve kullanımının ne kadar kolay olduğunu göreceğiz. Bu üçüncü taraf eklentisi Caldera Forms aracılığıyla satın alınabilir. Adından da anlaşılacağı gibi, hem Divi hem de Extra ile çalışır.

Kurulum ve Aktivasyon

Eklentiyi normal şekilde yükleyin ve etkinleştirin. Ayarlanacak ayar yok. Özellikler kullanıma hazır.

Bir Formu Özelleştirme

Varsayılan iletişim formunu, tüm varsayılan stille bir sayfaya ekledim. Bu formdaki tüm ayarlamalarımı birer birer yapacağım. Sonra bir veya iki örnek göreceğiz.

Tema Özelleştirici'ye yeni stil özellikleri eklendi. Tema Özelleştirici'yi (veya Modül Özelleştirici - ikisi de çalışır) açın ve Caldera Forms Stil Özelleştirici'ye tıklayın .

Bu, metin, düğmeler, alanlar, geçiş anahtarları, tarih seçici, içerik kırıntıları vb. dahil olmak üzere formun her yönünü özelleştirmek için 20 yeni özelleştirme sekmesi ekler. İşte her bir ayara bir bakış.

Metin Alanları

Metin Alanları metnin, yer tutucunun ve kenarlığın rengini, ayrıca alanların kenarlık genişliğini, kenarlık yarıçapını ve tek satır yüksekliğini değiştirir.

Metin Alanları Üzerine Gelin

Metin Alanları Fareyle üzerine gelindiğinde metin, alan ve kenarlık renkleri değiştirilir.

Metin Alanları Odağı

Metin Alanları Odak, odaklanılan alanın metnin, arka planın ve kenarlığının rengini değiştirir. Bu örnekte, merkezdeki alan vurguludur, ancak koyu arka plana sahip alan odaklıdır.

Açılır Seçim

Açılır Seçim, arka planı, metni, oku ve kenarlık renklerini özelleştirir. Kenarlık genişliğini ve yarıçapını da ayarlayabilirsiniz.

Açılır Seçin Vurgulu

Açılır Menü Vurguluyu Seç, üzerine gelindiğinde arka planın, metnin, okun ve kenarlığın rengini kontrol eder.

Onay kutuları ve Radyo Düğmeleri

Onay Kutuları ve Radyo Düğmeleri, onay kutularınızın ve radyo düğmelerinizin seçili öğelerinin rengini ayarlar.

Geçiş anahtarları

Geçiş Anahtarları, hem seçili olmayan hem de seçili anahtarın arka plan, yazı tipi ve kenarlık renklerini ayrı ayrı ayarlar. Ayrıca her iki anahtarın kenar genişliğini ve yarıçapını birlikte ayarlayabilirsiniz.

Geçiş Anahtarları Hover

Geçiş Anahtarları Hover, seçili ve seçili olmayan anahtarın arka plan, yazı tipi ve kenarlığının renklerini bağımsız olarak ayarlar. Bu, seçili olmayan anahtardır.

Mavi olan seçili anahtardır.

Gönder Düğmesi

Gönder Düğmesi, arka planı, yazı tipini ve kenarlık renklerini ve kenarlık yarıçapını, düğme genişliğini ve konumunu kontrol eder. Yazı tipi boyutunu ve harf aralığını da ayarlayabilirsiniz. Bir metin dönüştürme özelliği, metnin büyük/küçük harf durumunu değiştirir. Küçük harf, büyük harf, büyük harf, baş harf veya devralmayı seçin.

Gönder Düğmesi Vurgusu

Gönder Düğmesi Vurgulu, arka plan, yazı tipi ve kenarlık için vurgulu renklerini kontrol eder.

Yeniden başlatma tuşu

Sıfırla Düğmesi arka planı, yazı tipini ve kenarlık renklerini kontrol eder. Ayrıca yazı tipi boyutunu ve harf aralığını, düğme genişliğini, düğme konumunu, kenarlık genişliğini ve kenarlık yarıçapını da ayarlayabilirsiniz. Bunun da metin dönüşümü var.

Sıfırlama Düğmesi Vurgusu

Düğme Vurgusunu Sıfırla, arka plan, metin ve kenarlık için düğme renklerini ayarlar.

Diğer Düğmeler

Caldera'nın birkaç başka düğme türü vardır. Diğer Düğmeler, Gönder ve Sıfırla dışındaki her şeyi kontrol eder. Yazı tipi, kenarlık ve arka plan için renkleri ayarlayın ve kenarlık genişliğini ve yarıçapını ayarlayın. Bu örnekte Önceki ve Sonraki düğmeleri oluşturdum.

Diğer Düğmeler Vurgulu

Diğer Düğmeler Vurgu, yazı tipleri, kenarlık ve arka plan için vurgulu renklerini kontrol eder.

Tarih Seçici

Tarih Seçici, aynı sekmede normal ve vurgulu renkleri içerir. Yazı tipi ve arka plan için renkleri ayarlayın. Bu örnekte 10'un üzerinde geziniyorum ve 12 seçildi.

Dosya Listesini Yükle

Dosya Listesini Karşıya Yükle, yüklenen dosyalar listesindeki arka plan ve metin renklerini kontrol eder.

Bölüm sonu

Bölüm Sonu, bölüm sonunun rengini, kenarlık genişliğini ve üst ve alt kenar boşluklarını kontrol eder.

Galeta unu

Breadcrumbs, hem etkin sayfa hem de diğer bağlantılar, ayırıcı, arka plan ve kenarlık için yazı tiplerinin renklerini seçmenize olanak tanır. Kenarlık genişliğini ve yarıçapını ayarlayın.

Başarı Uyarısı

Başarı Uyarısı yazı tipini, arka planı ve kenarlık renklerini ve kenarlık yarıçapını ve genişliğini ayarlar. Ayrıca kutu yüksekliğini de ayarlar.

Çeşitli

Çeşitli, gerekli simge, hatalı alanlar, açıklama metni, kredi kartı rengi ve kredi kartı simgesi konumu için renkler üzerinde kontrol sağlar. Açıklama metni, yazı tipi boyutunu, harf aralığını ve metin dönüştürme seçeneklerini içerir. Ben büyük harf seçtim.

Örnekler

Bir özgeçmiş yükleme formu oluşturdum (aslında bu, Caldera Forms'da yerleşiktir, ancak seçmek için düğmeye tıkladım) ve onu bir modal olarak ayarladım. İlk önce sayfaya Divi Builder ile stil vermek istiyorum.

Bir arka plan resmi ekledim ve arka planla karışmak yerine kontrast oluşturan renkleri seçtim.

Bu, aynı ayarları farklı bir arka planla kullanır. Bu sefer formu modal olarak kullanmadım. Beyaz bir arka plana sahip olmak yerine, form alanları doğrudan görüntünün üzerine yerleştirilir.

İthalat ihracat

Özelleştiricide oluşturduğunuz Caldera Forms stillerinizi içe veya dışa aktarmak kolaydır. Dashboard'da Caldera Forms , Styles – Import / Export'a gidin . Bu, stilleri bir JSON dosyası olarak içe ve dışa aktararak Caldera Form stillerinizi bu eklentiyi kullanan herhangi bir web sitesinde kolayca kullanmanıza olanak tanır. İçe aktarılan dosyanın stiliyle tüm stilinizin üzerine yazılacaktır.

Lisans ve Destek

Eklenti bir yıllık lisans olarak satın alınabilir (yıllık yinelenen). Lisans, eklentinin bir, beş veya on beş web sitesinde (hangi katman seçtiğinize bağlı olarak) kullanılmasına izin verir ve bir yıllık destek ve güncelleme içerir.

Son düşünceler

Bu eklentiyi kullanımı kolay buldu. Özelleştirici ayarları sezgiseldir. İyi etiketlenmişler ve mantıklı bir şekilde düzenlenmişler. İstediğim ayarları bulmakta hiç sorun yaşamadım. Bir kerede varsayılan ayarlara geri dönmenin veya genel ayarlamalar yapmanın (tüm renklerin genel koyuluğunu artırma veya azaltma gibi) kolay bir yolunu görmek istiyorum. Bu muhtemelen gerçekçi değil, ama kulağa ilginç geliyor.

Özelleştirici ayarlarıyla tek tek formlara stil vermek mümkün değildir. Tüm formlar bu aynı stili küresel bir ayar olarak kullanır ve Caldera'nın stil özelliklerini kullanarak bireysel olarak stillendirilmeleri gerekir. Bu, Tema Özelleştiricinin doğasıdır. Caldera Formlarınızı global bazda şekillendirmekle ilgileniyorsanız, bunu yapmanın Divi ve Extra için Caldera Forms Style Customizer'ı kullanmaktan daha kolay bir yolu yoktur.

Senden duymak istiyoruz. Divi ve Extra eklentisi için Caldera Forms Style Customizer'ı denediniz mi? Yorumlarda bunun hakkında ne düşündüğünüzü bize bildirin.

Irina Strelnikova / Shutterstock.com aracılığıyla Öne Çıkan Görsel