İletişim Formunuzu Nasıl Özelleştirirsiniz 7 Kolay Şekilde Stil Oluşturun

İletişim formu, her web sitesinin çok önemli bir unsurudur. Bunları çeşitli türlerdeki bilgileri toplamak ve paylaşmak için kullanıyoruz ve bu nedenle web sitemizin geri kalanı kadar iyi görünmelerine özen göstermeliyiz . Fazla sade, sayfaya ait olmayan bir tarza sahip bir iletişim formu, kullanıcılarınıza güven duygusunu aşılayamaz ve tam istedikleri anda kitlenizi kaybetmek yazık olur. bir adım daha ilerleyin ve bazı verilerini iletişim formunuzda bırakın.

Bir iletişim formu oluşturmanın çok popüler bir yolu, her türlü iletişim formunu kolayca oluşturmanıza izin veren birçok WordPress temasına genellikle ücretsiz olarak dahil edilen pratik ve kullanımı kolay bir araç olan Contact Form 7 eklentisidir . Bu eklenti, bir iletişim formu oluşturmanın tüm teknik yönlerini kapsar - onu biçimlendirmek için ek becerilere veya başka bir eklentiye ihtiyacınız olacak.

Bu yazıda, ücretsiz bir araçla iletişim formlarınızı web sitenizin tasarımına uyacak şekilde nasıl kolayca şekillendirebileceğinizi göstereceğiz.

Aşağıdakiler hakkında daha fazla bilgi edinmek için bizi izlemeye devam edin:

• İletişim Formlarınızı Stilize Etmek İçin Elementor için Qi Eklentilerini Kullanma
• İletişim Formu Stilini Ayarlama

İletişim Formlarınızı Stilize Etmek İçin Elementor için Qi Eklentilerini Kullanma

Qi Addons for Elementor , 60 widget ile birlikte gelen ücretsiz, zengin özelliklere sahip bir eklentidir ve formlarınızı şekillendirmenize yardımcı olmak için özel olarak oluşturulmuş bir Contact Form 7 widget'ı içerir . Eklenti sıfır kodlama bilgisi gerektirir ve kelimenin tam anlamıyla herkes onu rahatlıkla kullanabilir. Size iletişim formu oluşturma seçeneği sunmaz, ancak Contact Form 7 eklentisini kullanıyorsanız Qi ile formlarınızı web sitenizin stiline mükemmel şekilde uyacak şekilde özelleştirebilir ve yeniden tasarlayabilirsiniz.

Elementor için Qi Eklentileri'nin kurulumu ve yapılandırılması kolaydır ve prosedür, diğer eklentilerle hemen hemen aynıdır.

Kurduktan sonra, biçimlendirmek istediğiniz iletişim formunun bulunduğu sayfaya gidin ve Elementor'da düzenlemeyi seçin.

Ardından, İletişim Formu 7 pencere öğesini bulmak için soldaki menüdeki arama alanına İletişim Formu 7 yazın .

Şimdi, aldığınızda, üzerine tıklayın ve iletişim formunuzun olmasını istediğiniz yerin üzerine gelin .

Bu şekilde eklediğiniz form Contact Form 7 eklentisi ile oluşturduğunuz formdur, bu widget sadece forma stil vermenize yardımcı olmak için yapılmıştır, onunla form oluşturamazsınız . Böylece, artık iletişim formunuzu olmasını istediğiniz yere yerleştirdiniz ve sol taraftaki menüde İletişim Formu 7 widget ayarlarını görebilirsiniz.

Menüdeki ilk sekme , sayfada ne tür bir iletişim formu olmasını istediğinizi seçme seçeneği sunar. Üç seçenek arasından seçim yapabiliriz – İletişim formu 1, Bülten ve Bize Ulaşın, elbette siteniz için daha önce oluşturduğunuz formlardan herhangi birini seçebilirsiniz. Şimdi size sitemizdeki Bize Ulaşın formunu nasıl özelleştirdiğimizi gösterelim.

İletişim Formu Stilini Ayarlama

Formu şekillendirme seçeneklerini açmak için Stil sekmesine tıklayın .

İlk seçenek, yazı tipini, yazı tipinin boyutunu, etiket kelimeleri arasındaki boşluğu, yazı tipi stilini, kelimelerdeki harfler arasındaki boşluğu ayarlayabileceğiniz Etiket tipografisine atıfta bulunur ve harika olan şey, tüm değişiklikleri görebilmenizdir. hemen yaşa ki körü körüne hiçbir şey yapmıyorsun .

Aşağıdaki resimde seçimlerimizin etiket tipografisine nasıl yansıdığını tam olarak görebilirsiniz.

Sonraki seçenek etiket rengiyle ilgilidir.

İhtiyaçlarınıza bağlı olarak kendi gölgenizi oluşturabilirsiniz. Etiketimiz için sayfanın arka plan rengine uygun olduğu için lacivert seçiyoruz.

Şimdi, hepiniz etiket stilini ayarladığınızda, sonraki ayarlar giriş stiliyle ilgilidir.

Burada da benzer seçeneklere sahip olacaksınız – giriş tipografisi yazı tipi stilini, boyutunu ve rengini seçebilirsiniz. Varsayılan olarak beyaz olmasını istemiyorsanız , giriş alanının arka plan rengini de ayarlayabilirsiniz . Ayrıca giriş alanlarının kenarlık stilini ayarlamak için ayarları burada bulacaksınız ve düz, kesikli, oluklu, noktalı, çift veya hiçbiri arasında seçim yapabilir ve her bir seçenek için ek ayarlamalar yapabilirsiniz.

Giriş alanları etkinken de farklı stiller ayarlayabilirsiniz . Aynı seçeneklerin tümü hizmetinizdedir, ancak yalnızca giriş alanları etkin olduğunda uygulanacaktır.

Sonraki ayarlar, onay kutusu stiliyle ilgilidir . Bu küçük öğe bir iletişim formunda çok önemlidir ve web sitesi kullanıcılarına bir çeşit seçenek sunduğunuz adım olduğu için düzgün ve kolay erişilebilir görünmelidir.

Qi ile bu öğenin kolayca mükemmel görünmesini sağlayabilirsiniz. Onay kutusu giriş boyutunu siz belirlersiniz , iki onay kutusu arasında ve ayrıca onay kutuları ve diğer giriş alanları arasında az ya da çok boşluk bırakabilirsiniz . Bu durumda seçimlerimizin iletişim formunu nasıl etkilediğini aşağıdaki fotoğrafta açıkça görebilirsiniz:

Hakkında bilinmesi gereken sonraki ayarlar, Düğme Stili ayarlarıdır .

Düğme arka planının rengini değiştirebilir, düğmenin etrafındaki kenarlığı farklı renk ve stilde (düz, kesikli veya noktalı) olacak şekilde ayarlayabilirsiniz. Ayrıca Button color seçeneğinde istediğiniz rengi seçerek butondaki metnin rengini değiştirebilirsiniz . Tüm değişiklikler anında görünür, böylece hangi ayarların iletişim formunun hangi öğesiyle ilgili olduğunu kolayca anlayabilirsiniz.

Fareyle üzerine gelindiğinde düğmenin stilinin değişmesini istiyorsanız, Etkin sekmesine tıklayın ve ayarları yapın – düğmenin üzerine gelme rengini, düğmenin üzerine gelindiğinde arka plan rengini, düğmenin üzerine gelindiğinde kenarlık rengini vb. ayarlayabilirsiniz.

İletişim formunun görünümünden memnun kaldığınızda, artık Aralık Stili sekmesindeki ayarları açarak aralığı ayarlayabilirsiniz. İletişim formunun her öğesi için aralığı buradan ayarlayabilirsiniz.

Global Stil ayarları, iletişim formunun hizalama stiline atıfta bulunur. Sol, orta ve sağ hizalama arasında seçim yapabilirsiniz.

Hata Stili ayarları , birisi forma doğru verileri yazmadığında görüntülenen hata mesajının stilini kontrol etmenizi sağlar. Hata mesajı konumunu, tipografisini ve rengini kolayca ayarlayabilirsiniz.

Yanıt Stili ayarları , iletişim formuna eklenen yanıtların ayrıntılarında ince ayar yapmanıza olanak tanır. Yazı tipini, yazı tipinin rengini, yanıt dolgusunu ve yanıt kenar boşluğunu ve ayrıca kenarlık türünü kontrol edebilirsiniz.

Birisi mesajı gönderdikten sonra formumuz şöyle görünür:

Ve aynen böyle, sayfanızda sizin için çalışmaya hazır zarif bir iletişim formunuz var.

Her Şeyi Sarmak

Qi Addons for Elementor ile ilgili en iyi şey, yaptığınız tüm değişiklikleri canlı olarak görebilmeniz, böylece farklı seçenekler arasında hızla hareket edebilmeniz ve bunları sezgisel olarak nasıl kullanacağınızı öğrenebilmenizdir. İletişim formları eklemek özellikle yaratıcı bir görev olmasa da, bu eklenti bu durumda bile yaratıcı olmanızı sağlar. İletişim formlarınızın görünümü, kullanıcılarınızın sizi algılama biçimini büyük ölçüde etkileyebilir ve aynı standardı bu departmanda da sunmayı başarırsanız, web siteniz, markanız ve işiniz için büyük bir artı olacaktır.

Umarız bu makale yardımcı olmuştur. Beğendiyseniz, bu makalelerden bazılarına da göz atmaktan çekinmeyin!

• Sahip Olmaya Değer En İyi WordPress Benzeri Düğme Eklentileri
• WordPress Düğmeleri Oluşturmanın 4 Kolay Yolu
• Düğme Tasarım İpuçları: Ziyaretçilerinizden Nasıl Tıklama Kazanabilirsiniz?