WordPress’teki Formlar için Popup Gezinme Onayı Nasıl Görüntülenir

Yorumlarınızı göndermeden veya yarım doldurulmuş bir formla çok sinir bozucu sayfayı yanlışlıkla kapatın. Son zamanlarda, kullanıcılarımızdan biri bize okuyucularına onay navigasyon açılır penceresini göstermenin mümkün olup olmadığını sordu? Bu küçük pop -up kullanıcıyı uyarır ve yarı dolu ve yanlışlıkla gönderilmemiş bir form bırakmalarını önler. Bu makalede, WordPress formları için onay navigasyon açılır penceresini nasıl görüntüleyeceğinizi göstereceğiz.

Navigasyon onay açılır penceresi nedir? Kullanıcıların blogunuza yorum yazdığını varsayalım. Birkaç satır yazdılar, ancak rahatsız ve yorum yapmayı unuttular. Şimdi tarayıcılarını kapatırlarsa, yorumlar kaybolacaktır.
Onay navigasyon açılır penceresi onlara yorumlarını tamamlama fırsatı verir. Bu özelliği WordPress Post Düzenleme ekranında çalışırken görebilirsiniz. Kaydetilmemiş değişiklikleriniz varsa ve sayfadan ayrılmaya veya tarayıcıyı kapatmaya çalışırsanız, bir uyarı açılır penceresi görürsünüz.

Bu uyarı özelliğini Sitenizdeki WordPress yorumlarına ve diğer formlara nasıl ekleyebileceğimizi görelim. WordPress’e gönderilmeyen formlar için navigasyon onay açılır penceresini görüntüleyin Bu öğretici için özel bir eklenti oluşturacağız, ancak endişelenmeyin, web sitenize yüklenecek bu öğreticinin sonundaki eklentiyi de indirebilirsiniz.
Ancak, kodun daha iyi anlaşılması için sizden kendi eklentinizi yapmaya çalışmanızı isteyeceğiz. Bunu önce yerel kurulumlarda veya evreleme sitelerinde yapabilirsiniz. Başlayalım. İlk olarak, bilgisayarınızda yeni bir klasör oluşturmanız ve ad onay-bırakmanız gerekir. Onay klasöründe ayrıldığında, başka bir klasör oluşturmanız ve js adını vermeniz gerekir. Şimdi Not Defteri gibi sıradan metin editörlerini açın ve yeni dosyalar oluşturun. İçeride, aşağıdaki kodu yapıştırın: <? PHP/**
* Ayrılmayı onaylayın
* Eklenti Adı: Ayrılmayı onaylayın
* Eklenti uri: https://www.wpbeginner.com
* Açıklama: Bu eklenti, bir yorum formunda Gönder düğmesine basmayı unuttuklarında kullanılacak bir uyarı gösterir.
* Sürüm: 1.0.0
* Yazar: WPBeginner
* Yazar Uri: https://www.wpbeginner.com
* Lisans: GPL-2.0+
* Lisans Uri: http://www.gnu.org/licenses/gpl-2.0.txt
*/
İşlev wpb_confirm_leing_js () {
wp_enqueue_script ('onay bırak', plugins_url ('js/tee-leaving.js', __file__), dizi ('jQuery'), '1.0.0', true);
}
Add_action ('wp_enqueue_scripts', 'wpb_confirm_leing_js');
Bu PHP işlevi yalnızca web sitenize ön ucuna JavaScript dosyaları ekler.
Lütfen ve bu dosyayı ana onay-bırakma klasöründe teatle-leaving.php olarak kaydedin. Şimdi bu eklenti tarafından yayınlanan bir JavaScript dosyası oluşturmamız gerekiyor. Yeni bir dosya oluşturun ve içinde bu kodu yapıştırın: jQuery (belge) .Ready (işlev ($) {
$ (belge) .Ready (function () {
NeedToconFirm = false;
Window.onBeforeunload = AskConfirm;
});
İşlev assconfirm () {
if (needtoconfirm) {
// Özel mesajınızı buraya koyun
"Bulunmamış verileriniz kaybolacaktır.";
}
}
$ ("#CommentForm"). Değiştir (function () {
NeedToconFirm = true;});
})
Bu JavaScript kodu, kullanıcının yorum formunda saklanmayan değişiklikler olup olmadığını algılar. Kullanıcı sayfadan çıkmaya veya pencereyi kapatmaya çalışırsa, bir uyarı açılır penceresi görüntüler.
Bu dosyayı JS klasöründe onur-leataving.js olarak kaydetmeniz gerekir. Her iki dosyayı da kaydettikten sonra, klasör yapınız budur:
Şimdi FTP istemcilerini kullanarak WordPress sitenize bağlanmanız gerekiyor. WordPress dosyalarını yüklemek için FTP'nin nasıl kullanılacağına dair kılavuzumuza bakın. Bağlandıktan sonra, Web sitenizdeki/WP-Concesses/Eklentileri/Klasörüne onay bırakma klasörlerini yüklemeniz gerekir.
Bundan sonra WordPress yönetici alanını girmeniz ve eklenti sayfasını ziyaret etmeniz gerekir. Yüklü eklenti listesinde 'onay bırakma' eklentisini bulun ve aşağıdaki 'Etkinleştir' bağlantısını tıklayın.

Sadece bu. Artık web sitenizdeki herhangi bir yayını ziyaret edebilir, yorum formundaki herhangi bir alanda birkaç metin yazabilir, ardından göndermeden sayfayı terk etmeye çalışabilirsiniz. Bir açılır pencere görünecektir, bu da sayfadan ayrılmamış değişikliklerle ayrılacağınızı söylüyor.

WordPress’teki diğer formlara bir uyarı ekleyin WordPress sitenizdeki herhangi bir formu hedeflemek için aynı kod tabanını kullanabilirsiniz. Burada size temas formlarını hedeflemek için kullanımının bir örneğini göstereceğiz. Bu örnekte, bir iletişim formu oluşturmak için WPForms eklentisini kullanıyoruz. Web sitenizde farklı bir iletişim formu eklentisi kullanırsanız talimatlar aynı olacaktır.

İletişim formunuzu eklediğiniz sayfayı açın. Fareyi iletişim formunuzdaki ilk alana gidin, sağlayın, ardından Tarayıcı menüsünden inceleyin. etiketi ile başlayan satırı bulun. Form etiketinde kimlik öznitelikleri bulacaksınız. Bu örnekte, form kimliğimiz WPForms-Form-70’dir. Kimlik özniteliğini kopyalamanız gerekir. Şimdi onay-Seing.js dosyasını düzenleyin ve #CommentForm’dan sonra kimlik özniteliğini ekleyin. #CommentForms ve form kimliğinizi bir komadan ayırdığınızdan emin olun. Form kimliğinizin özniteliğine bir önek olarak # işaret eklemeniz gerekir.

Kodunuz şimdi şöyle görünecek: jQuery (belge) .Ready (işlev ($) {
$ (belge) .Ready (function () {

NeedToconFirm = false;
Window.onBeforeunload = AskConfirm;
});
İşlev assconfirm () {
if (needtoconfirm) {
// Özel mesajınızı buraya koyun
“Bulunmamış verileriniz kaybolacaktır.”;
}
}
$ (“#Yorum formu,#wpforms-form-70”). Değiştir (function () {
NeedToconFirm = true;
});
})
Değişikliklerinizi kaydedin ve dosyaları web sitenize geri yükleyin. Şimdi herhangi bir metni iletişim formunuzdaki herhangi bir alana girebilir ve ardından bir form göndermeden sayfayı terk etmeye çalışabilirsiniz. Bir açılır pencere, kaydedilmeyen değişiklikleriniz olduğu konusunda bir uyarı ile görünecektir.