Divi Email Optin Modülünün Ad Alanları Nasıl Kaldırılır

Bugünkü eğitimde size Divi Email Optin Module'ün ad alanlarını nasıl kaldıracağınızı göstereceğiz. Ad alanlarının silinmesi yalnızca e-posta kayıt modülünde standart olan ad ve soyad alanlarının görsel olarak görünmemesini sağlamakla ilgili değildir. Aynı zamanda işlevsellik ile de ilgilidir. Varsayılan olarak, bir abonelik için ad ve e-posta adresi gereklidir. Bu yüzden sadece isim alanlarını görünmez yapmak sürece yardımcı olmaz.

Bununla birlikte, bunu yapmanıza yardımcı olmak için, ad alanlarından görsel olarak nasıl kurtulacağınızı ve işlevsel olarak da çalışmasını sağlayacağız.

Sonuç

Bu gönderiyi adım adım takip ederseniz, aşağıdaki sonucu elde edeceksiniz:

E-posta Optin Modülünün Ad Alanlarını Neden Kaldırmak İstiyorsunuz?

Ad alanlarını kaldırmak istemenizin birkaç nedeni olabilir. Nedenini bilmiyorsanız; Aşağıda listelenen iki nedene bir göz atın.

Ziyaretçinizin Zamanından Tasarruf Etmek İçin

İlk sebep, kullanıcı deneyimini akılda tutar. Yalnızca bir e-posta alanı isteyerek, ziyaretçileriniz sizinle hızlı bir şekilde etkileşim kurma olanağına sahip olacaktır. Yapmaları gereken tek şey e-posta adreslerini yazmak ve onlara ilgilendikleri içeriği sağlayacaksınız.

Bariyeri Küçültmek/Hızlı Davranışa Dayanmak

İnsanlar internette karşılaştıkları tüm optin modüllerini doldursalar, muhtemelen zamanları tükenirdi. Optin formları günümüzde her türlü web sitesinin bir parçasıdır. İnsanların onlara hayran olduğu günler geride kaldı. Abone olmak için çok fazla çaba sarf etmeleri gerektiğini (okuyun: çok fazla gerekli alanı doldurmaları gerektiğini) görürlerse, muhtemelen bunu görmezden geleceklerdir. Bununla birlikte, yalnızca e-posta adresini sorarsanız, muhtemelen bunu kabul etmeyeceklerdir. Bir e-posta adresini yazmak en fazla 5 saniye sürer (bu, insanların sahip olduğu ortalama 7 saniyelik dikkat süresinden daha azdır).

Divi Email Optin Modülünün Ad Alanları Nasıl Kaldırılır

Youtube Kanalımıza Abone Olun

Daha fazla gecikmeden, bu işi yapalım.

Yeni Sayfa Ekle

Yapmanız gereken ilk şey, yeni bir sayfa eklemek veya yalnızca e-posta alanıyla Email Optin Module'ü yerleştirmek istediğiniz sayfayı açmaktır.

E-posta Opsiyon Modülü Ekle

Bu sayfada olduğunuzda, E-posta Opsiyon Modülünü sığdırmak istediğiniz yere ekleyin. Sayfayı Email Optin Module ile önizlediğinizde, şöyle görüneceğini göreceksiniz:

Herhangi bir alanı doldurmadan devam edip abone ol butonuna tıklarsanız çalışmayacağını göreceksiniz. Varsayılan olarak, E-posta Tercih Modülünün çalışması için bir ad ve e-posta değeri gerekir. Bu yüzden sadece alanları ortadan kaldırmak (ama hala var) işe yaramaz. Bunları kaldırmak da işe yaramaz.

Ancak yapabileceğiniz şey, ad alanına varsayılan bir değer eklemektir. Alanın bir değeri olduğundan emin olmak için '*' gibi bir şey kullanabilirsiniz. Yapmamız gereken başka bir şey de giriş alanlarına bağlı etiketleri silmek. Tüm bunları başarmak için bazı jQuery kodu ve CSS kodu kullanacağız.

CSS Kodu Ekle

CSS kodunu ekleyerek başlayacağız. CSS kodu, yalnızca iki alanın sayfada görüntülenmemesini sağlayacaktır. İşlevsel kısım için bazı jQuery kod satırlarını kullanmamız gerekecek.

CSS kodunun belirli bir sayfaya veya tüm web sitesine uygulanmasını sağlayabilirsiniz. Kullanacağınız yöntem büyük olasılıkla kod modülünü yalnızca e-posta alanıyla ne sıklıkta kullanmak istediğinize bağlı olacaktır. E-posta Opsiyon Modülünü birkaç kez ve farklı sayfalarda kullanmak istiyorsanız, ikinci yöntemi kullanın. Yalnızca bir sayfa için sayılmasını istiyorsanız, ilk yöntemi kullanın.

Özellikle Bir Sayfaya CSS Kodu Ekleyin

CSS kodunu özellikle bir sayfaya eklemek için, üzerinde çalıştığınız sayfada aşağıdaki simgeye tıklayın:

Açılan ekranda aşağıdaki CSS kod satırlarını kopyalayıp yapıştırın:

.et_pb_newsletter_form p:nth-child(2){
display: none !important;
}
.et_pb_newsletter_form p:nth-child(3) {
display: none !important;
}

Tema Seçeneklerine CSS Kodu Ekle

CSS kodunu web sitesinin tamamına eklemek için WordPress Panonuz > Divi > Tema Seçenekleri > Genel sekmesine gidin ve Özel CSS alanına aşağıdaki CSS kodu satırlarını ekleyin:

.et_pb_newsletter_form p:nth-child(2){
display: none !important;
}
.et_pb_newsletter_form p:nth-child(3) {
display: none !important;
}

jQuery Kodu Ekle

Devam ederek, gerekli olan jQuery kodunu ekleyeceğiz. jQuery kodunu eklemek için iki seçeneğiniz de vardır: kodu belirli bir sayfaya uygulamak için ekleyin veya kodu tüm web sitesine ekleyin.

Özellikle Bir Sayfaya jQuery Kodu Ekleme (Kod Modülü)

jQuery kodunu özellikle bir sayfaya eklemek için Email Optin Modülünün hemen altına bir Kod Modülü ekleyin. Kod Modülünü açın ve aşağıdaki jQuery kod satırlarını içine yerleştirin:

<script type="text/javascript">
jQuery(function($){
$(".et_pb_contact_form_label").remove();
$("#et_pb_signup_firstname").val("*");
$("#et_pb_signup_email").val("");
$("#et_pb_signup_email").attr("placeholder", "Email address");
});
</script>

Etiketi kaldırdığımızdan, e-posta adresi alanının değerinin içinde hiçbir şey bulunmadığından emin oluyoruz. Etiketi telafi etmek ve insanların ne yazacaklarını bilmelerini sağlamak için bunun yerine bir yer tutucu kullanıyoruz. Bu durumda, yer tutucu 'e-posta adresi'dir, ancak bunu başka bir şeye dönüştürmekten çekinmeyin.

Tema Seçeneklerine jQuery Kodu Ekle

jQuery kodunu tüm web sitesine uygulamak için, onu Tema Seçeneklerine yerleştirebilirsiniz. Bunu yapmak için WordPress Kontrol Paneli > Divi > Tema Seçenekleri > Entegrasyon bölümüne gidin ve aşağıdaki jQuery kod satırlarını web sitenizin başına yerleştirin:

<script type="text/javascript">
jQuery(function($){
$(".et_pb_contact_form_label").remove();
$("#et_pb_signup_firstname").val("*");
$("#et_pb_signup_email").val("");
$("#et_pb_signup_email").attr("placeholder", "Email address");
});
</script>

Sonuç

Bu gönderideki her adımı takip edip, CSS ve jQuery kodunu belirli bir sayfaya veya web sitenizin tüm sayfalarına uygularsanız, aşağıdaki sonucu elde etmelisiniz:

Son düşünceler

Bu gönderide, yalnızca bir e-posta adresi alanına sahip bir E-posta Opsiyon Modülünü nasıl elde edeceğinizi gösterdik. Böyle bir sonuca ulaşmak isteyebilmenizin nedeni, etkililiktir. Yalnızca e-posta adresini sorarak, hedef kitlenizin abone olmak için daha az çaba göstermesi gerekecek ve e-posta listenizi daha hızlı oluşturabileceksiniz. Herhangi bir sorunuz veya öneriniz varsa, aşağıdaki yorum bölümüne bir yorum bıraktığınızdan emin olun!

Büyük bir duyuruyu, faydalı ipucunu veya Divi freebie'sini asla kaçırmamak için e-posta bültenimize ve YouTube kanalımıza abone olmayı unutmayın!

Öne Çıkan Görsel adichrisworo / Shutterstock.com