WordPress'te Çoklu Sütun Formu Nasıl Yapılır?

WordPress'te çok sütunlu bir form oluşturmak karmaşık olmak zorunda değil! Akıllı ızgara düzeninde alanları yan yana yerleştirmenin en kolay yolunu göstereceğiz.

Bir WordPress çoklu sütun düzeni tasarımcısı kullanışlı bir araç olabilir. Bu biçimlendirme, büyük formları daha düzenli ve daha kompakt hale getirmeye yardımcı olabilir. Ancak, bazı form eklentileri alanları yan yana yerleştirmeyi biraz zorlaştırır.

Neyse ki, Formidable Forms farklı çalışıyor. Süper kolay düzen oluşturucumuzu kullanarak, hızlı bir şekilde çarpıcı sütun formları oluşturabilirsiniz.

Bu makalede, neden bir sütun formu oluşturmak isteyebileceğinizi tartışacağız. Ardından, üç basit adımda nasıl bir tane oluşturacağınızı göstereceğiz. Başlayalım!

Neden alanları yan yana yerleştirmek isteyebilirsiniz?

Alanları yan yana yerleştirme seçeneğine sahip olmak, formlarınızda size daha fazla esneklik sağlar. Aslında, bazı veriler en iyi sütun biçiminde görünebilir. Gezinmesi daha kolay, oldukça düzenli bir form oluşturmak için yan yana alanları kullanabilirsiniz. Bu, örneğin bir çevrimiçi başvuru formu veya bir şehir devleti formu için geçerli olabilir.

Ayrıca, formların, sütunların ve ızgaraların ötesinde, veri görselleştirme ve emlak listelerini görüntülemek için yararlıdır. Dikey bir düzen, mülk bilgilerini daha net bir şekilde iletebilir.

Formidable Forms'da sütunların kullanımının kolay olması gerektiğine inanıyoruz, bu nedenle kullanıcı dostu bir düzen oluşturucu tasarladık.

Ekibimiz, HTML form alanlarını yan yana eklemekten daha kolay, sezgisel bir düzenleme deneyimi oluşturdu. Birkaç basit adımı öğrenerek, bu esnek aracı kullanma konusunda profesyonel olabilirsiniz – özel CSS gerekmez!

WordPress'te duyarlı iki sütun formu nasıl oluşturulur

Sadece üç adımda güzel, duyarlı, dikey olarak organize edilmiş formları nasıl oluşturacağınızı gösterelim. Veya bir satır içi formu nasıl oluşturacağınızı öğrenin.

1. Adım: Yeni bir form oluşturun

İlk önce bir form oluşturmanız gerekecek. Müthiş → Formlar → Yeni Ekle'ye gidin:

Ardından, bir açılır pencere görmelisiniz. Bu size sıfırdan başlamak mı yoksa bir form şablonu mu kullanmak istediğinizi soracaktır.

Temel alanlarla önceden hazırlanmış şablonlarımızdan biriyle başlamanızı öneririz. Formidable Forms planınıza bağlı olarak farklı sayıda seçenek göreceksiniz. İşte birkaç örnek:

Bir seçenek belirledikten sonra, formunuzu adlandırın ve Oluştur'a tıklayın. Bu, editörü başlatacaktır.

Bu izlenecek yol için Referans formu şablonunu kullanmaya karar verdik:

Ancak, başlamanıza yardımcı olacak herhangi bir temel kullanmaktan çekinmeyin. Örneğin, fiyatlandırma alanlarını kullanmayı planlıyorsanız, bunun yerine Kredi Kartı Ödeme formu şablonunu seçebilirsiniz.

2. Adım: Alanları yan yana yerleştirin

Ardından, alanlarınızı eklemeniz gerekecek. Bir şablonla başladıysanız, çoğunu zaten hazırlamış olabilirsiniz. Ancak, formunuzu diğer seçeneklerle özelleştirmek isteyebilirsiniz.

Yeni alanlar eklemek için sol taraftaki menüden bir seçeneğe tıklayın ve onu sağ tarafa sürükleyin. Dilediğiniz yere yerleştirebilirsiniz.

Bir alanı doğrudan diğerinin yanına sürüklemek, onu aynı satıra yerleştirecektir. Bunu birkaç kez yaparsanız, sütunlar oluşturabilirsiniz.

Diyelim ki WordPress'te nasıl 3 sütun yapılacağını bilmek istiyorsunuz. Tek yapmanız gereken, aşağıda gösterildiği gibi yan yana olan alanları tek bir satırda sürüklemektir:

Ayrıca mevcut form alanlarını yan yana da taşıyabilirsiniz. Bunu yapmak için bir alanın üzerine gelin. Ardından, sağ üst köşedeki ok simgesini seçin:

Artık farenizi basılı tutabilmeli ve o alanı diğerinin yanına sürükleyebilmelisiniz. Örneğin, referans formumuzu üç sütun halinde yeniden düzenledik:

Çok sütunlu formlar için gelişmiş seçenekler

Ancak, sütunlarla yapabileceğiniz tek şey bu değil! Gelişmiş seçeneklerimizi de kullanmayı düşünün.

Örneğin, Bölüm alanlarının kullanılması, daha büyük alanlardan boşluklar olmadan sütun formları oluşturmak için kullanılabilir:

Veya birden çok alana veya satıra shift tuşuyla tıklayın, komutla tıklayın veya kontrol tuşuyla tıklayın. Birden fazla alan veya satır seçtikten sonra, sayfanın alt kısmında toplu seçenekler göreceksiniz. Burada, her bir alanı manuel olarak taşımadan satırları daha da hızlı oluşturabilirsiniz. (İpucu: Alanları bu şekilde toplu olarak da silebilirsiniz!)

3. Adım: Sütun formunuzun oranlarını değiştirin

Sütun oluşturmaya ek olarak, oranlarını da değiştirebilirsiniz. Böylece, benzersiz biçimlendirmeye sahip bir form tasarlamak kolaydır. Ayrıca, her ekran boyutu için her zaman otomatik olarak yanıt verir.

Başlamak için bir alan seçin ve Satır Düzeni ayarlarına erişmek için sütunlar simgesine tıklayın:

Buradan, bir sıra sütunu o sırada düzenlemek için ön ayarlardan birine tıklayabilirsiniz. Oranları tam ihtiyaçlarınıza göre özelleştirmenizi sağlayacak Özel yerleşimi de seçebilirsiniz:

Düzenlerimiz 12 sütunlu bir sistem üzerinde çalışır. Bu nedenle, sütunların tüm satırı kaplamasını istiyorsanız, tüm sayılarınızın toplamı 12 olmalıdır.

İstediğiniz oranları girin, ardından Kaydet'e tıklayın . Sütunlarınızın eşit boyutta olmasını istiyorsanız, bu adımı tüm satırlar için aynı numarayla tekrarlayın.

Referans olması için, burada referans formu düzeni örneklerimizden biri var, ancak son sütun biraz daha büyük hale getirildi. 3 , 3 , 6 modeline girdik:

Gördüğünüz gibi, sütun formunuza orantı eklemek dinamik stiller oluşturmanıza yardımcı olabilir. Temanıza en uygun olanı bulmak için birkaç farklı kombinasyon denemeyi düşünün!

toparlamak

Bazen, formunuzun daha profesyonel görünmesi için birkaç sütun eklemek yeterlidir. Ancak bazı eklentiler süreci zorlaştırıyor. Neyse ki, en iyi WordPress form oluşturucuyu kullanarak alanları kolaylıkla yan yana yerleştirebilirsiniz.

Bu makalede, formlarınızda sütun oluşturmak için üç adımı ele aldık:

1. Yeni bir form oluşturun.
2. Alanlarınızı yan yana yerleştirin.
3. Belirli oranlar kullanmayı düşünün.

Sütunlar, Formidable Forms'un sunduğu tek özellik değildir. Formlarınızı şekillendirmenize yardımcı olabilecek diğer birkaç yola göz atın!

Yan yana form oluşturucumuz hakkında daha fazlasını okuyun

• WordPress'te Güzel İletişim Formu Tasarımı (Örneklerle)
  Daha fazla oku

  WordPress Formlarına RGB Renk Seçici Nasıl Eklenir
  Daha fazla oku

  Etkileşimi Artırmak için WordPress Formlarına Resim Nasıl Eklenir?
  Daha fazla oku