Elementor'da WordPress Formları Nasıl Özelleştirilir?

Elementor'da kendi WordPress formunuzu oluşturup özelleştirmek ister misiniz?

Web siteniz için bir form özelleştirmek, özel markanızı, kişiselleştirmenizi ve amacınızı sergilemenin harika bir yoludur. WPForms ve Elementor tarafından sunulan sezgisel oluşturucular sayesinde özelleştirme çok kolaydır.

Bu makalede, favori WordPress formlarınızı Elementor'da nasıl özelleştireceğinizi göstereceğiz. Ayrıca, kendiniz için almak isteyebileceğiniz en popüler form şablonlarımızdan bazılarını da sunuyoruz.

WordPress Formunuzu Şimdi Oluşturun

WordPress için Elementor'a ihtiyacım var mı?

WordPress siteniz için Elementor eklentisini mutlaka edinmeniz gerekmez, ancak inanılmaz derecede faydalıdır.

Elementor, sürükle ve bırak arayüzü sunan bir sayfa oluşturucu eklentisidir ve güçlü kodlama becerileri veya tasarım uzmanlığı olmayanlar için idealdir. İstediğiniz web sitesi düzenlerini ve tasarımlarını oluşturmanıza olanak tanıyan kapsamlı özelleştirme sunar.

Dolayısıyla, WordPress web siteniz için buna ihtiyaç duymak, özel gereksinimlerinize ve tercihlerinize bağlıdır. HTML, CSS konusunda rahatsanız ve güçlü tasarım becerileriniz varsa Elementor'a ihtiyacınız olmayabilir.

Elementor'un hem ücretsiz hem de premium sürümleri mevcuttur; böylece her zaman ücretsiz sürümle başlayabilir ve gerekirse yükselterek ihtiyaçlarınıza göre uyarlayabilirsiniz.

Elementor'da WordPress Formlarını Özelleştirme

Eklentileri Kurun ve Etkinleştirin

Buradaki adımları takip etmek için hem WPForms'a hem de Elementor'a ihtiyacınız olacağını söylemeye gerek yok.

Ancak biz yine de söyleyelim: WordPress kontrol panelinizde WPForms ve Elementor eklentilerini kurup etkinleştirdiğinizden emin olun.

Web sitenize eklenti yüklemeye ilişkin tüm talimatlar için bu kullanışlı kılavuza göz atın.

Artık özelleştirmeye başlamaya hazırsınız. Temel iletişim için gereken temel bilgilerden başlayarak size bunu Elementor'da nasıl yapacağınızı göstereceğiz. Daha sonra, biraz daha karmaşık hale geldikçe her form örneği için bu öğeleri (kelime oyunu amaçlı) geliştireceğiz.

Daha fazla ilham mı istiyorsunuz? Elementor'da WordPress formlarını eklemeye ve özelleştirmeye yönelik bu farklı yaklaşıma göz atın.

İletişim Formu

İletişim Formu, web sitenizdeki en gerekli formlardan biridir ve en popüler form şablonumuz olmaya devam etmektedir.

Elementor ile İletişim Formu oluşturmak için öncelikle WordPress kontrol panelinize gidin. Kenar çubuğundan Sayfalar'ı ve ardından Yeni Ekle'yi tıklayın.

Ardından, iletişim formunuzu yerleştirmenize ve çeşitli sayfa öğelerini uyarlamanıza olanak tanıyan Elementor sayfa oluşturucuyu yüklemek için mavi Elementor ile Düzenle düğmesini tıklayın.

Artık, bir sayfaya eklenecek her türlü bloğu ve öğeyi sürükleyip bırakabileceğiniz Elementor sayfa oluşturucu açılacaktır.

Devam edin ve WPForms bloğunun üzerine sürükleyip sayfaya bırakın. Artık buradaki açılır menüden bir form seçebilir veya yeni bir form ekleyebilirsiniz.

Formumuzu bloğa almak için +Yeni Form seçeneğine tıklayalım.

Daha sonra WPForms oluşturucu yüklenecek ve böylece Elementor'da kullanmak istediğiniz formu özelleştirebilirsiniz.

Öncelikle ekranın üst kısmındaki kutuya yazarak Formunuza İsim Verin . Daha sonra nerede ve nasıl kullanacağımızı bilmek için formumuza “İletişim Formu” adını vereceğiz.

Ardından formunuzu oluşturmak için galeriden bir Şablon seçin .

Formunuzu sıfırdan oluşturmak için boş bir form şablonu kullanabilir veya ilerlemenizi sağlayacak tüm gerekli alanlarla önceden hazırlanmış belirli bir şablonu kullanarak bir adım önde başlayabilirsiniz.

İletişim Formumuz için bir şablon kullanacağız.

Şablonlara göz atmak için sayfayı aşağı kaydırabilir veya belirli bir şeyi arayabilirsiniz. Örneğin bir "İletişim Formu" aradığınızda, aralarından seçim yapabileceğiniz her türlü iletişim formu şablonu ortaya çıkar.

Formumuzu oluşturmak için Basit İletişim Formu şablonunu kullanacağız.

Bu, en popüler form şablonlarımızdan biridir, bu nedenle avantajlarından yararlanmak için onu kullanmanızı da öneririz!

Ve her zaman olduğu gibi bu form şablonunu ek alanlar ve ayarlarla özelleştirmek kolaydır. İstediğiniz alana tıklayıp basılı tutarak formunuza sürüklemeniz yeterlidir. Daha sonra düzenlemek için alana tıklamanız yeterlidir.

Basit İletişim Formu şablonuyla formunuz kullanıcı adınızı toplar, böylece onlarla yapacağınız yazışmaları kişiselleştirebilirsiniz ve aynı zamanda onlardan gelen bir mesajı veya yorumu da size iletir.

Formunuzda göz önünde bulundurmanız gereken ek bir özelleştirme öğesi, kullanıcılarınızın formlarını gönderdiklerinde aldıkları onay mesajıdır. Form oluşturucunun Ayarlar bölümüne gidin ve Onaylar sekmesine tıklayın.

Burada form kullanıcınız “Gönder”e tıkladıktan sonra ekranda görünen mesajı düzenleyebilirsiniz.

Basit İletişim Formu şablonumuzda onay mesajı şöyle diyor: "Bizimle iletişime geçtiğiniz için teşekkür ederiz! Kısa süre içinde sizinle iletişime geçeceğiz."

Bir not olarak, galerimizde sunduğumuz tüm form şablonları, kullanıcılarınız için ilgili bir Onay Mesajıyla birlikte hazır olarak gelir, ancak bu mesajı uygun gördüğünüz şekilde düzenlemenizi öneririz!

Formdaki özelleştirmeleri tamamladığınızda üstteki Kaydet düğmesini tıklayın. Form oluşturucu penceresinin sağ köşesindeki X işaretine tıklayarak form oluşturucuyu kapatabilirsiniz.

Şimdi Elementor sayfa oluşturucuya geri döneceğiz.

Sayfaya yerleştirilmiş İletişim Formu Şablonumuzla artık form stillerini özelleştirebiliriz. Alanların, etiketlerin, düğmelerin ve daha fazlasının stilini düzenleyebiliriz.

Formumuzda, kenarlık yarıçapını ve rengini yalnızca birkaç tıklamayla artırmak için Alan Stili ayarlarını kullandık.

Birkaç hızlı özelleştirmenin bu form sayfasının stili üzerinde ne kadar etkili olduğunu görebilirsiniz.

Ne tür bir stil yaratacaksınız?

Form stillerini özelleştirmeyi bitirdiğinizde form sayfanızı yayımlamayı unutmayın.

Alt araç çubuğundaki Yayınla düğmesine tıklamanız yeterlidir.

Şimdi Elementor ile daha fazla form sayfasını özelleştirmek için bu adımları temel alacağız.

Bülten Kayıt Formu

Web sitenizde isteyebileceğiniz bir diğer yaygın form türü de Bülten Kayıt Formu'dur.

Bu formu Elementor'da özelleştirmek için yukarıdan ilk adımlarla başlayacaksınız: Elementor ile yeni bir sayfa eklemek ve düzenlemek, yeni bir form eklemek için WPForms bloğunu kullanmak ve formda kullanılacak şablonu seçmek.

Bu form, site ziyaretçilerinizin sizden haber bülteni almak üzere kaydolmak için kullanacağı form olduğundan, adlarını ve e-posta adreslerini toplayacak alanlar içeren bir şablon isteyeceksiniz.

Bu nedenle Bülten Kayıt Formu Şablonunu kullanacağız.

Ardından, şartlar ve koşullar onay kutusu, spam kayıtlarını önlemek için özel CAPTCHA ve hatta coğrafi konum özellikleri gibi ek alanlar eklemek için form oluşturucuyu kullanabilirsiniz.

Onay mesajına gelince, şablon sayesinde o da sizin için hallediliyor.

Her zaman olduğu gibi, yeni abonelerinizin almasını istediğiniz mesajı yazmanızı öneririz. Bu arada şöyle diyor: “Bültene kaydolduğunuz için teşekkür ederiz! Yakında sizinle iletişime geçeceğiz."

İşiniz bittiğinde çıkmadan önce Bülten Kayıt Formunuzu kaydetmeyi unutmayın.

Daha sonra Elementor'a döndüğümüzde formun stilini bir kez daha özelleştirebiliriz. Bu sefer Alan Stillerini , Etiket Stillerini ve Düğme Stillerini değiştirelim.

Yukarıdaki iletişim formunda yaptığımız gibi burada da Alan Stillerini özelleştireceğiz: kenarlık yarıçapını 10 piksele çıkaracağız ve rengini siyah olarak değiştireceğiz.

Şimdi Etiket Stillerine de odaklanalım. Formdaki etiketleri daha belirgin hale getirmek için boyutlarını artırın. Hata mesajında ​​kullanmak için eğlenceli bir renk de seçelim. Bu rengin alan etiketlerinde yıldız işaretlerinde kullanıldığını görebilirsiniz.

Ardından dikkatinizi Gönder düğmesine çevirin.

Formumuzda görebileceğiniz gibi, stilimizin geri kalanına uyacak şekilde arka plan ve kenarlık renklerinin yanı sıra düğmenin boyutunu artırmak için Düğme Stillerini kullandık.

Mükemmel bir renk uyumu elde etmek için Etiket Stilleri'ndeki renk seçiciyle seçtiğimiz pembe rengi kopyaladık ve Düğme Stilleri'nin Arka Plan renk seçicisine yapıştırdık.

Daha sonra Elementor'daki tüm form şekillendirme seçenekleriyle daha da yaratıcı olacağız.

Kamp Kayıt Formu

Kayıt formları en çok aranan şablonlarımızdan bazılarıdır ve kamp kayıtları için form şablonları son zamanlarda en çok talep gören şablonlardır.

Burada zaten ele aldığımız adımların çoğuna göz atacağız ve doğrudan WPForms'tan bir form şablonu seçmeye başlayacağız.

Bu form için galerimizdeki seçeneklerden Kız İzci Kampı Kayıt Formu şablonunu alın.

Form alanlarını veya onay mesajını düzenleme konusunda çok fazla endişelenmeyeceğiz, ancak şablonu kuruluşunuzun ihtiyaçlarına uyacak şekilde özelleştirebilirsiniz.

Ardından, Elementor sayfa oluşturucunun içinde Gelişmiş ayarlarda çalışacağız.

Bu ayarlar sekmesi, özel bir arka plan için resim yüklemek de dahil olmak üzere, WPForms bloğuyla stil oluşturma konusunda çok fazla şey yapmamıza olanak tanır.

Arka planınızı oluşturmak için Gelişmiş ayarların altındaki Arka Plan sekmesine tıklayın. ve Arka Plan Türü'nün Klasik'te olduğundan emin olun.

Daha sonra WPForms bloğunda görüntülenecek arka plan olacak bir resim yükleyebilirsiniz.

Arka planın görüntü boyutunun, konumunun ve diğer öğelerinin yapılandırılması biraz zaman alsa da, bu özelleştirme özelliği çabaya değer.

Örneğin yukarıdaki örneğimizde, muhtemelen yayınlamadan önce formun metin renklerini, kenar boşluklarını, hizalamasını ve diğer öğelerini düzenlemek isteriz.

Müşteri Sipariş Formu

Form şablonlarını içeren bir makale yazıp sipariş formu şablonlarımızdan bahsetmeden geçemeyiz.

Daha önce ele aldığımız adımları bir kez daha atlayıp doğrudan özelleştirmelere geçeceğiz. Buradaki formumuz için en popüler sipariş formu şablonumuzu kullanacağız: Müşteri Sipariş Formu Şablonu.

Şimdi WPForms bloğunun Gelişmiş ayarlarına geri dönüyoruz. Ayrıca Arka Plan sekmesini de yeniden ziyaret ediyoruz, ancak bu kez Arka Plan Türü Degradedir .

Degrade ayarlarıyla, sipariş formunuzun arka planına degrade olarak uygulanacak, aklınıza gelebilecek her türlü renk eşleşmesini karıştırıp eşleştirebilirsiniz.

Nihai sonuç çarpıcı ve özelleştirme seçenekleri sonsuzdur.

Şimdi, bu, WPForms ve Elementor ile sahip olduğunuz tüm özelleştirme ve stil seçeneklerinin yalnızca yüzeyini çiziyor. Bu nedenle ek Elementor eğitimlerimize ve makalelerimize göz atmayı unutmayın.

WordPress Formunuzu Şimdi Oluşturun

Sonra, Elementor Formlarını Google E-Tablolar'a bağlayın

Tebrikler! Elementor'da harika formlar oluşturma yolunda ilerliyorsunuz.

Şimdi bu formları Google E-Tablolar'a bağlamayı deneyin. Elementor, form girişlerinizi WordPress kontrol panelinizde saklayabilirken, form girişlerinizin ve potansiyel müşterilerinizin bir kopyasını bir Google E-Tablosunda saklamak isteyebileceğiniz zamanlar da olabilir.

Öyleyse nasıl yapılacağını öğrenmek için eğitimimize göz atın!

Formunuzu oluşturmaya hazır mısınız? En kolay WordPress form oluşturucu eklentisiyle bugün başlayın. WPForms Pro çok sayıda ücretsiz şablon içerir ve 14 günlük para iade garantisi sunar.

Bu makale size yardımcı olduysa, daha fazla ücretsiz WordPress öğreticisi ve kılavuzu için lütfen bizi Facebook ve Twitter'da takip edin.