Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Kupası
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Açılır Alanlı WordPress Formları Nasıl Oluşturulur (Kolay Yöntem)

Birçok web sitesi sahibi, kullanıcıları uzun formlarla bunaltmadan kullanıcı girdisi toplamakta zorlanıyor.

Açılır alanlar, kısa bir seçenek listesi sunarak formları daha basit hale getirir. Bu, form tamamlama oranınızı artırabilecekleri ve kullanıcı deneyimini iyileştirebilecekleri anlamına gelir.

Bu makalede, açılır alanlara sahip bir WordPress formunun nasıl oluşturulacağını göstereceğiz.

The Create WordPress Forms with Dropdown Fields in post image

Açılır Alanlar Nedir ve Neden Kullanılır?

Bir açılır alan, kullanıcıların farklı varyasyonlardan oluşan bir dizi listeden bir seçenek seçmesine olanak tanır. Kullanıcılar tüm açılır seçenekleri görmek için alana tıklayabilirler.

Bir web sitesi sahibi olarak, e-posta bülteni kayıtları, iletişim formları, etkinlik kayıt formları veya ürün sipariş formları gibi web formları oluşturmak için açılır alanları kullanabilirsiniz.

Açılır alanlar formunuzun etkinliğini artırabilir. İşte birkaç avantaj:

  • Tutarlılık. Ayarlanan seçenekler listesi toplanan verilerin tutarlı olmasını sağlar ve geçersiz girişleri önler. Bu, veri analizini daha doğru hale getirir.
  • Dinamik alanlar. Açılır alanlar koşullu mantık ayarlamayı kolaylaştırır. Ayarlanan seçenekler listesi, gereksiz engeller olmadan kullanıcı seçimine göre ek alanlar göstermenizi sağlar.
  • Azaltılmış form uzunluğu. Birden fazla seçeneği kompakt bir açılır menüde birleştirmek formunuzun daha az korkutucu görünmesini sağlar. Bu da daha iyi bir kullanıcı deneyimi sağlayabilir.

Bununla birlikte, WordPress’te açılır alanlara sahip formların nasıl oluşturulacağına bir göz atalım. İşte bu eğitimde ele alacağımız adımlara hızlı bir genel bakış:

Hadi başlayalım!

Adım 1: WPForms’u Yükleme

WPForms, form oluşturmak için en iyi acemi dostu, sürükle ve bırak WordPress eklentisidir. Bu form oluşturucu, sadece birkaç tıklamayla kullanıcı dostu bir form oluşturmanıza yardımcı olan 1.800’den fazla şablona sahiptir.

Ayrıca Constant Contact ve Stripe gibi üçüncü taraf pazarlama ve ödeme platformlarını entegre etmenize de olanak tanır.

WPForms

Notlar: WPForms Lite açılır alan özelliği ile birlikte gelir. Bununla birlikte, koşullu mantık ayarlayabilmeniz ve formunuzdaki kullanıcı deneyimini iyileştirebilmeniz için eklentinin premium sürümünü edinmenizi öneririz.

İyi haber şu ki WPBeginner okuyucuları WPForms kuponunu kullanarak özel %50 indirim kazanıyor: SAVE50.

WPForms’u yüklemek ve etkinleştirmek için bir WordPress eklentisinin nasıl kurulacağına ilişkin kılavuzumuzu okuyabilirsiniz.

Adım 2: Yeni Bir Form Oluşturma

Etkinleştirmenin ardından, WordPress yönetici alanınızda aşağıdaki gibi bir WPForms menüsü görmelisiniz:

The WPForms menu in the WordPress admin area

Artık WPForms oluşturucu arayüzüne erişebilecek ve açılır alanlara sahip formlar oluşturabileceksiniz.

Yeni bir form oluşturmaya başlamak için WPForms ‘un üzerine gelin ve ‘Yeni Ekle’ye tıklayın.

The Add New button under WPForms in the WordPress admin area

Alternatif olarak, WPForms‘a tıklayabilirsiniz. Bu sizi oluşturucunun ‘Formlara Genel Bakış’ bölümüne yönlendirecektir.

Başlamak için ‘+ Yeni Ekle’ düğmesine tıklayın.

The + Add New button on WPForms' Forms Overview

Şimdi, WPForms form oluşturucu içinde ‘Kurulum’ panelini göreceksiniz. Bu panelde yapmanız gereken ilk şey formunuzu adlandırmaktır.

Örneğin, ‘Formunuzu Adlandırın’ alanına ‘Basit İletişim Formu’ veya sadece ‘İletişim Formu’ yazabilirsiniz.

The Contact Form copy in the Name Your Form field in WPForms' Setup panel

Bu işlem tamamlandıktan sonra, sıra bir şablon seçmeye gelir.

Bir form şablonunu kullanmak için tek yapmanız gereken istediğiniz formun üzerine gelmek ve ‘Şablonu Kullan’a tıklamaktır. Bu örnekte, ‘Basit İletişim Formu’nu kullanacağız.

The Use Template button for Simple Contact Form in WPForm's Setup panel

İletişim formu oluşturma hakkında daha fazla bilgi edinmek için WordPress’te iletişim formu oluşturma hakkındaki ayrıntılı kılavuzumuza bakın.

Adım 3: Açılır Alan Ekleme

Kurulum işlemini tamamladıktan sonra, sol tarafta alanların bir listesinin ve sağ tarafta canlı bir ön izlemenin bulunduğu form oluşturucuya yönlendirileceksiniz.

Edit contact form

Şimdi, iletişim formumuza bir açılır alan eklemek istiyoruz.

Sadece ‘Açılır Menü’ye tıklayın ve formun sağ tarafına sürükleyin.

The Dropdown option in WPForm's Fields panel

Notlar: ‘Standart Alanlar’ kategorisindeki tüm alanlar WPForms Lite’da mevcuttur. Böylece, çoktan seçmeli alanlara sahip formlar oluşturabilir veya giriş ve kayıt formlarına ücretsiz olarak CAPTCHA ekleyebilirsiniz.

Panelin sağında, iletişim formunuzda bir açılır alan görebileceksiniz. Aşağıdakileri içeren ayarlarına erişmek için alanın üzerine gelebilirsiniz:

  • Bir kopyalama düğmesi
  • Bir silme düğmesi
  • Bir ‘Düzenlemek için Tıklayın’ talimatı
  • Bir ‘Yeniden Sıralamak için Sürükle’ talimatı
The dropdown field on the live preview

Sürükle ve bırak özelliğini kullanarak, açılır alanı ‘Yorum veya Mesaj’ın üzerine taşıyalım.

‘Yorum veya Mesaj’ paragraf alanının gönder düğmesinden hemen önce yer almasını sağlayarak form tamamlama süreci için daha iyi bir akış sunarsınız. Ayrıca, kullanıcıların gözden kaçırmaması için açılır alanınızı daha görünür hale getirir.

The dropdown field moved above Comment or Message

Adım 4: Açılır Alanın Yapılandırılması

Bu adımda, açılır alanınızın etiketini, seçeneklerini ve açıklamasını ayarlayacaksınız. Seçenekler listeniz form türünüzle uyumlu olmalıdır. Bir iletişim formu oluşturduğumuz için, bir bülten aboneliği seçeneği sunalım.

Açılır alanınıza tıklayın ve ardından ‘Alan Seçenekleri’ne gidin.

The Dropdown field's Field Options tab

‘Genel’ sekmesinde gerekli ayrıntıları doldurun:

  • Etiket. Açılır alanlarda etiketler genellikle sorulardır. Örnek olarak “Bültenimize abone olmak ister misiniz?” sorusunu kullanacağız.
  • Seçenekler. “Evet, lütfen.” ve “Hayır, teşekkür ederim.” seçeneklerini ekleyelim.
  • Açıklama. Bu alanda “İstediğiniz zaman abonelikten çıkabilirsiniz.” ifadesini bırakabilirsiniz.
  • Zorunlu. Ziyaretçilerin bu alanı doldurmasını zorunlu kılmak için bu seçeneği değiştirin.
The configured Dropdown field in the Field Options tab

Ardından, koşullu mantığı ayarlayalım.

Koşullu mantık, ‘if’ ve ‘then’ ifadeleri ile karar vermek anlamına gelir. Formlarda kullanıldığında, kullanıcının verdiği yanıta göre bir sonraki adımda ne olacağına karar verir.

Koşullu mantık kurmak formların doldurulmasını kolaylaştırır. Önceki seçimlere göre yalnızca ilgili seçenekleri göstererek, formunuz kullanıcıları gereksiz seçeneklerle boğmaz.

Bu örnekte, kullanıcılar ‘Evet, lütfen’ seçeneğini seçerse ek bir alan görüntüleyelim. Abonelerin promosyon e-postalarını ne sıklıkta almak istediklerini seçmelerine izin vereceğiz.

Bundan önce, yeni bir alan hazırlamanız gerekir. ‘Alan Ekle’ sekmesine geri dönün ve ‘Açılır Menü’ ya da başka bir alan türüne tıklayın. Ardından, yeni alanın ayrıntılarını tamamlayın.

İşte bir örnek:

The configured second dropdown field in the Field Options tab for setting up conditional logic

Yeni alan hazır olduğuna göre, üzerine tıklayın ve ‘Smart Logic’ sekmesine gidin.

Buradan, ‘Koşullu Mantığı Etkinleştir’ seçeneğini değiştirerek koşullu mantığı etkinleştirebilirsiniz.

The Enable Conditional Logic toggle in the Smart Logic tab

Etkinleştirildikten sonra, yeni alanınız için koşullu mantığı yapılandırabilirsiniz.

Yeni alanı ‘Göster’ veya ‘Gizle’ seçeneğini belirleyerek başlayın. Ardından, mevcut bir alan ve bir kullanıcı girişi seçin.

İşte referans için yapılandırmamız: ‘Bültenimize abone olmak ister misiniz’ ‘Evet, lütfen’ ise bu alanı ‘Göster’.

The conditional logic for the second Dropdown field in the Smart Logic tab

Uzman İpucu: Kullanıcıları doğrudan e-posta listenize eklemek mi istiyorsunuz? WordPress’te e-posta listesi oluşturma hakkındaki eğitimimize göz atın.

Adım 5: Formunuzu Kişiselleştirme

Yeni formunuzu kişiselleştirmenin zamanı geldi.

Yeni bir kullanıcı her form gönderdiğinde e-posta bildirimleri ayarlayarak başlayabilirsiniz. Ayarlar ” Bildirimler bölümüne gidin ve ‘Bildirimleri Etkinleştir’ seçeneğini açın.

The Enable Notifications toggle in WPForms' Notifications section in the Settings panel

Ardından, geçişin altındaki formunuzun varsayılan bildirim ayrıntılarını gözden geçirin.

‘Varsayılan Bildirim’ alanındaki bazı girişler ‘Akıllı Etiket’e sahiptir. Bu etiket, diğerlerinin yanı sıra form gönderme bildirimlerinin nereye gönderileceğini varsayar. Bununla birlikte, ayarları ihtiyaçlarınıza göre düzenleyebilirsiniz.

Örneğin, ‘Gönderilen E-posta Adresi’ alanı {admin_email} ‘Akıllı Etiketi’ne sahiptir. Varsayılan olarak bu, WordPress sitenizin yönetici e-postası olacaktır. Dolayısıyla, tüm form gönderme bildirimleri yönetici e-postasının gelen kutusuna gidecektir.

E-posta pazarlama uzmanınız gibi daha fazla alıcı ekleyebilirsiniz. Her e-postayı virgülle ayırdığınızdan emin olun.

Form e-postanızı birden fazla kişiye veya farklı departmanlara nasıl göndereceğinizi öğrenmek istiyorsanız, birden fazla alıcısı olan bir iletişim formunun nasıl oluşturulacağına ilişkin kılavuzumuzu okuyun.

Ardından, ‘E-posta Konu Satırınız’ için varsayılan kopya ‘Yeni Giriş: Form Adınız’ şeklindedir. Ancak, tanımlanması kolay olduğu sürece konu satırını istediğiniz gibi değiştirebilirsiniz.

Form gönderen kullanıcılar e-postalarında bir bildirim almalıdır. ‘Gönderen Adı’ alanı, kullanıcıların bildirim e-postasını kimin gönderdiğini bilmesini sağlar.

WPForm's Default Notifications settings for the first three fields

Bir sonraki alan ‘E-postadan’ ve bu alan için ‘Akıllı Etiket’ {admin_email}’dir.

Bu varsayılan ayarla, kullanıcılar sitenizin yönetici e-postasından bildirim e-postaları alacaktır.

Vurgulanan kısım, sitenizin yönetici e-posta adresinin farklı bir etki alanında (örneğin @gmail.com) olduğunu bildirir. Bu, e-postaların ‘Spam’ kutusuna düşmesi gibi teslim edilebilirlik sorunlarına yol açabilir.

E-postalarınızın okuyucuların gelen kutularına ulaştığından emin olmak için WP Mail SMTP’yi ayarlama kılavuzumuzu okuyabilirsiniz.

WPForm's Default Notifications settings for the From Email field

Gönderilen her bildirim e-postası için alıcının yanıt verme seçeneği de vardır.

‘Yanıtla-Kime’ alanında, kullanıcı yanıtlarının hangi e-posta adresine gönderileceğini ayarlayabilirsiniz. Bu alanın ‘Akıllı Etiketi’ {field_id= “1”} şeklindedir. Bu, kullanıcıların yanıtlarının ‘E-postadan’ alanındaki e-posta adresiyle aynı e-posta adresine gideceği anlamına gelir.

Son olarak, ‘E-posta Mesajı’ alanı {all_fields} ‘Akıllı Etiketi’ne sahiptir. Böylece, e-posta mesajınız kullanıcı yanıtlarıyla birlikte form alanlarınızı da içerecektir.

WPForm's Default Notifications settings for the last two fields

Bildirimlerinizi özelleştirmeyi tamamladıktan sonra, ‘Onaylar’ bölümüne gidin. Bu bölümde, form gönderiminden sonra onayı nasıl görüntüleyeceğinizi ayarlayacaksınız.

İlk olarak, onay türünüz olarak ‘Mesajlar’, ‘Sayfayı Göster’ veya ‘URL’ye Git (Yönlendirme)’yi seçebilirsiniz.

The Confirmation Type field in WPForms' Confirmations section in the Settings panel

Onay türünüz olarak ‘Mesaj’ı seçerseniz, kullanıcılara form gönderimlerini aldığınızı bildirmek için bir onay mesajı görüntülersiniz.

Bu onay türü ile varsayılan mesajı markanıza uyacak şekilde düzenleyebilirsiniz. ‘Onay Mesajı’ alanına gidin ve metin kutusuna özel mesajınızı yazın.

The Confirmation Message field in WPForms' Confirmation section in the Settings panel

‘Sayfayı Göster’i seçerseniz, WordPress web sitenizde mevcut bir sayfayı seçmeniz gerekir. ‘URL’ye Git (Yönlendirme)’ seçeneğini tercih ederseniz, bir sayfa URL’si eklersiniz.

Bir sonraki adıma geçmeden önce, ilerlemenizi kaybetmemek için ‘Kaydet’e tıklayın.

The Save button on WPForms' builder interface

Bu işlem tamamlandığında, yeni formunuzu WordPress sitenizde görüntülemeye hazırsınız demektir.

Adım 6: Formunuzu WordPress’e Yerleştirme

Yeni formunuzu WordPress sitenizde görüntülemek için WPForms form oluşturucu içindeki ‘Yerleştirme’ sihirbazını kullanabilirsiniz.

The Embed wizard on the WPForms form builder

Bu, ‘Bir Sayfaya Yerleştir’ açılır penceresini tetikleyecektir. Bu pencerede ‘Mevcut Sayfayı Seç’ veya ‘Yeni Sayfa Oluştur’ seçeneklerinden hangisi sizin için uygunsa onu seçebilirsiniz.

Bu örnekte, ‘Mevcut Sayfayı Seçme’ ile devam edelim.

The Select Existing Page button when embedding a form from WPForms

Bir sonraki adım, yeni formunuzu görüntülemek istediğiniz sayfayı seçmektir.

Basitçe açılır menüye tıklayın ve mevcut bir web sayfasını seçin. Bunu yaptıktan sonra, “Hadi Gidelim!”e tıklayın.

The About option when embedding a form in an existing page

Ardından, WPForms talimatları ile WordPress blok düzenleyicisine yönlendirileceksiniz.

Bu talimatları gizlemek için ‘Bitti’ düğmesine tıklayabilirsiniz.

The + button for adding a new block on the WordPress block editor

Buradan, bir WPForms bloğu eklemek için ‘+’ düğmesine tıklamanız gerekir.

Arama çubuğuna ‘WPForms’ yazın. Ardından, arama sonuçlarında WPForms bloğunu görmelisiniz. Eklemek için tıklayın.

The WPForms block to add to the WordPress block editor

WPForms bloğunu ekledikten sonra, sayfanızda bir açılır menü göreceksiniz.

Basitçe açılır menüye tıklayın ve listeden bir form seçin. Yeni oluşturduğumuz form bu olduğu için ‘İletişim Formu’nu seçelim.

The Contact Form option in the WPForms' block's dropdown

Adım 7: Formu Yayınlama

Bu son aşamada, her şeyin mükemmel göründüğünden emin olmak için yayınlamadan önce formu önizleyelim. WordPress blok düzenleyicisinde GörünümYeni sekmede önizle seçeneğine tıklayın.

The Preview in new tab button on the WordPress block editor

İsterseniz, formun tablet ve mobil cihazlarda nasıl göründüğünü de önizleyebilirsiniz. Tek yapmanız gereken Görünüm ” Tablet veya Mobil ” Yeni sekmede önizleme seçeneğine tıklamak.

Son olarak, başka bir ayarlama gerekmiyorsa ‘Güncelle’ düğmesine basın.

The Update button on WordPress' block editor

Tebrikler! Açılır alanlara sahip yeni iletişim formunuzu WordPress web sitenize başarıyla eklediniz.

İşte demo web sitemizde nasıl göründüğü:

A contact form with dropdown fields embedded on a WordPress website

Umarız bu kılavuz açılır alanlarla WordPress formları oluşturmayı öğrenmenize yardımcı olmuştur. Daha sonra, e-posta listenizi büyütmek için bir iletişim formunu nasıl kullanacağınızı ve WordPress formlarını kullanmaya yönelik nihai kılavuzumuzu öğrenmek isteyebilirsiniz.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Açıklama: İçeriğimiz okuyucu desteklidir. Bu, bazı bağlantılarımıza tıklarsanız komisyon kazanabileceğimiz anlamına gelir. WPBeginner'ın nasıl finanse edildiğini, neden önemli olduğunu ve nasıl destek olabileceğinizi görün. İşte editoryal sürecimiz.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Ultimate WordPress Araç Kiti

Araç setimize ÜCRETSİZ erişim sağlayın - her profesyonelin sahip olması gereken WordPress ile ilgili ürün ve kaynaklardan oluşan bir koleksiyon!

Reader Interactions

Yorumlar

  1. Tebrikler, bu makaleye ilk yorum yapan kişi olma fırsatını yakaladınız.
    Bir sorunuz veya öneriniz mi var? Lütfen tartışmayı başlatmak için bir yorum bırakın.

Bir Cevap Bırakın

Yorum bırakmayı seçtiğiniz için teşekkür ederiz. Lütfen tüm yorumların yorum poli̇ti̇kasi uyarınca denetlendiğini ve e-posta adresinizin yayımlanmayacağını unutmayın. Ad alanında anahtar kelime KULLANMAYIN. Kişisel ve anlamlı bir sohbet edelim.