WordPress Login Popup Modal Nasıl Oluşturulur (Adım Adım)

Sitenize bir WordPress giriş açılır modalı eklemek ister misiniz?

Modal oturum açma açılır penceresi, kullanıcıların o anda görüntüledikleri sayfadan ayrılmadan web sitenize hızlı bir şekilde giriş yapmalarını sağlar. Bu, kullanıcı deneyimini ve web sitenizdeki etkileşimi geliştirir.

Bu makalede, bir WordPress oturum açma açılır modalini nasıl kolayca oluşturacağınızı göstereceğiz.

Neden WordPress Login Popup Modal Oluşturmalısınız?

Çevrimiçi bir mağaza, üyelik web sitesi işletiyorsanız veya çevrimiçi kurslar satıyorsanız, muhtemelen kullanıcıların web sitenize kaydolmasına ve giriş yapmasına izin veriyorsunuzdur.

Genellikle, kullanıcılar oturum açma bağlantısını tıkladıklarında, varsayılan WordPress oturum açma sayfasına veya web sitenizdeki başka bir özel oturum açma sayfasına yönlendirilirler. Kullanıcılar giriş yaptıktan sonra tekrar başka bir sayfaya yönlendirilirler.

Modal oturum açma açılır penceresi, kullanıcıları farklı bir sayfaya göndermeden formu görüntülemenizi sağlar. Giriş yaptıktan sonra, kullanıcıları istediğiniz sayfaya yönlendirebilirsiniz.

Modal giriş açılır penceresi daha hızlıdır ve web sitenizdeki kullanıcı deneyimini iyileştirir. Daha hızlı ve daha gösterişli bir kullanıcı deneyimi satışlarınızı ve dönüşümlerinizi artırabilir.

Bununla birlikte, WordPress’te modal giriş açılır penceresinin nasıl kolayca oluşturulacağına bir göz atalım. Bunu yapmak için size ücretsiz bir eklenti ve premium eklentiler kullanarak iki yöntem göstereceğiz.

Tercih ettiğiniz yönteme geçmek için aşağıdaki bağlantılara tıklamanız yeterlidir:

Yöntem 1: Giriş/Kayıt Açılır Penceresini Kullanarak Modal Giriş Açılır Penceresi Oluşturun

İlk yöntem için Login/Signup Popup eklentisini kullanacağız. Kullanıcılarınızın sitenizde kolayca oturum açmasını veya kaydolmasını sağlayan ücretsiz bir eklentidir.

Öncelikle Login/Signup Popup eklentisini yüklemeniz ve etkinleştirmeniz gerekir. Yardıma ihtiyacınız varsa, lütfen bir WordPress eklentisinin nasıl kurulacağına ilişkin kılavuzumuza bakın.

Etkinleştirmenin ardından WordPress yönetici panelinden Giriş/Kayıt Açılır Penceresi ” Ayarlar bölümüne gidebilirsiniz.

Genel ayarlar altında kayıt, otomatik oturum açma veya kaydolma işlemlerini etkinleştirebilir ve parola sıfırlama işlemlerini gerçekleştirebilirsiniz.

Bunun yanı sıra, eklenti yeni kayıt olan kullanıcılara atanacak WordPress kullanıcı rolünü seçmenize de izin verir. Varsayılan olarak, ‘Abone’ rolünü atayacaktır.

Aşağı kaydırırsanız daha fazla ayar görürsünüz. Örneğin, bir kullanıcı oturum açtığında veya kaydolduğunda bir yönlendirme URL’si ekleyebilirsiniz.

Değişiklikleri yaptıktan sonra ‘Kaydet’ düğmesine tıklamayı unutmayın.

Ardından, ‘Stil’ sekmesine geçebilir ve oturum açma/kayıt açılır modalinizi düzenleyebilirsiniz. Eklenti, açılır pencerenin konumunu, genişliğini, yüksekliğini, arka plan rengini, metin rengini ve daha fazlasını değiştirmenize olanak tanır.

Bundan sonra, açılır modaldeki form alanlarını da özelleştirebilirsiniz.

WordPress panonuzdan Giriş/Kayıt Açılır Penceresi ” Alanlar bölümüne gitmeniz yeterlidir. Burada, farklı form alanlarını etkinleştirebilir, etiketlerini düzenleyebilir, zorunlu alanlar haline getirebilir ve daha fazlasını yapabilirsiniz.

Bunun yanı sıra, giriş / kayıt açılır pencerenize daha fazla alan ekleme seçeneği de vardır.

En üstteki ‘+ Alan Ekle’ düğmesine tıklayın ve oturum açma modal açılır pencerenize eklemek için ek form alanları seçin.

Form alanlarını özelleştirdikten sonra, artık web sitenize modal giriş açılır penceresini ekleyebilirsiniz. Eklenti, açılır pencereyi sitenize eklemek için farklı yollar sunar.

1. Menülere Giriş Açılır Modalı Ekleme

İlk olarak, WordPress panonuzdan Görünüm ” Menüler bölümüne gidebilirsiniz.

Bundan sonra, Giriş/Kayıt Açılır menü öğelerini görebilirsiniz. Göstermek istediğiniz öğeleri seçin ve ‘Menüye ekle’ düğmesine tıklayın.

Daha fazla ayrıntı için lütfen WordPress’te gezinme menüsü ekleme kılavuzumuza bakın.

2. Giriş Açılır Modalini Çapa Bağlantıları Olarak Ekleme

Ardından, web sitenizin URL’sinin sonuna #login veya #register ekleyebilir ve giriş açılır penceresini dahili bir bağlantı olarak yerleştirebilirsiniz.

Örneğin, URL’niz şu şekilde görünecektir:

<a href="www.mywebsite.com#login">Login</a>

Bunu yapmak için bir gönderiyi veya sayfayı düzenleyebilirsiniz.

İçerik düzenleyicisine girdikten sonra 3 noktaya tıklayın ve ‘HTML olarak düzenle’ seçeneğini seçin.

Bundan sonra, iç bağlantıyı giriş bağlantı metnine ekleyebilirsiniz.

WordPress’te çapa bağlantıların nasıl ekleneceğine ilişkin kılavuzumuzu takip ederek daha fazla bilgi edinebilirsiniz.

3. Login Popup Modal Eklemek için Kısa Kodları Kullanın

Giriş/kayıt açılır penceresini eklemenin bir başka yolu da kısa kodlar kullanmaktır.

Açılır pencereyi açacak bir bağlantı/buton oluşturmak için [xoo_el_action] kısa kodunu sitenizin herhangi bir yerine girmeniz yeterlidir.

Örneğin, Görünüm ” Widget ‘lar bölümüne gidin ve web sitenizin kenar çubuğunda oturum açma açılır penceresini göstermek için bir kısa kod widget bloğu ekleyin.

İşiniz bittiğinde, ‘Güncelle’ düğmesine tıklamanız yeterlidir.

Bundan sonra, oturum açma açılır penceresini çalışırken görmek için web sitenizi ziyaret edebilirsiniz.

Yöntem 2: WPForms ve OptinMonster Kullanarak Modal Giriş Açılır Penceresi Oluşturun

Bu yöntem için WPForms ve OptinMonster eklentilerine ihtiyacınız olacak.

WPForms en iyi WordPress iletişim formu eklentisidir. Kullanıcı kayıt eklentisine erişmek için en azından Pro planlarına ihtiyacınız olacak.

OptinMonster, piyasadaki en iyi WordPress popup eklentisi ve potansiyel müşteri oluşturma yazılımıdır. Web sitesi ziyaretçilerini abonelere ve müşterilere dönüştürmenize yardımcı olur. Bu makalede kullanılan MonsterLinks özelliğine erişmek için en azından Pro plana ihtiyacınız olacak.

Daha fazla ayrıntı için OptinMonster incelememizin tamamına bakın.

Kullanıcı Giriş Formu Oluşturmak için WPForms Kullanma

Öncelikle WPForms eklentisini yüklemeniz ve etkinleştirmeniz gerekir. Daha fazla ayrıntı için, bir WordPress eklentisinin nasıl kurulacağına ilişkin adım adım kılavuzumuza bakın.

Etkinleştirmenin ardından, WordPress panonuzdan WPForms ” Ayarlar bölümüne gitmeniz ve lisansı girmeniz gerekir.

Anahtarı WPForms hesap alanınızda bulabilirsiniz.

Ardından, Kullanıcı Kaydı Eklentisini yüklemek ve etkinleştirmek için WPForms ” Ek lentiler sayfasına gitmeniz gerekir.

Eklentiyi etkinleştirdikten sonra, yeni bir form oluşturmak için WPForms ” Add New sayfasına gitmeniz gerekir.

WPForms, aralarından seçim yapabileceğiniz birden fazla önceden oluşturulmuş form şablonu sunar. İlk olarak, formunuz için bir ad girin ve ardından ‘Kullanıcı Giriş Formu’ şablonunu seçin. Ardından, ‘Şablonu Kullan’ düğmesine tıklayabilirsiniz.

Bu giriş formu şablonu, varsayılan WordPress giriş formuna benzer şekilde çalışacak e-posta ve şifre alanlarına sahiptir.

Gerektiğinde ekranın sol tarafındaki ek alanları sürükleyip bırakabilirsiniz.

Ardından, Parola alanına tıklayın; sol tarafta alan seçenekleri gösterilecektir.

Şifremi unuttum ve kullanıcı kaydı gibi seçenekleri görüntülemek için Şifre alanının açıklama kutusuna aşağıda verilen kodu ekleyebilirsiniz.

Can't remember your password? <a href="{url_lost_password}">Click here</a>. Don't have an account? <a href="{url_register}">Register here</a>.

Bundan sonra, değişikliklerinizi kaydetmek için ‘Kaydet’ düğmesine tıklamanız gerekir.

Ardından, ‘Yerleştir’ düğmesine tıklamanız yeterlidir.

Giriş formunuzu eklemek için seçenekler içeren bir açılır pencere açılacaktır.

Devam edin ve ‘kısa kod kullan’ seçeneğini seçin. Pencerede bir düğme değil, bir bağlantı olarak görünecektir.

Şimdi formunuz için bir yerleştirme kodu görmelisiniz.

Şimdi, bu kısa kodu kopyalayın ve daha sonra kullanmak üzere kaydedin.

Giriş formunuz hazır. Şimdi, devam edebilir ve OptinMonster’ı kullanarak modal açılır pencere oluşturabilirsiniz.

Modal Açılır Pencere Oluşturmak için OptinMonster’ı Kullanma

Öncelikle, OptinMonster web sitesini ziyaret etmeniz ve bir hesap açmanız gerekir.

Ardından, OptinMonster eklentisini yüklemeniz ve etkinleştirmeniz gerekecektir. Daha fazla ayrıntı için, bir WordPress eklentisinin nasıl kurulacağına ilişkin adım adım kılavuzumuza bakın.

Eklenti, WordPress siteniz ile OptinMonster arasında bir bağlayıcı görevi görür.

Etkinleştirmenin ardından karşılama ekranını görmelisiniz. Devam edin ve ‘Mevcut Hesabınızı Bağlayın’ düğmesine tıklayın.

Şimdi yeni bir pencere açılacaktır.

Devam edin ve ‘WordPress’e Bağlan’ düğmesine tıklayın.

Artık bir oturum açma açılır modalı oluşturmaya hazırsınız.

WordPress yönetici alanından OptinMonster ‘a gidin ve ‘İlk Kampanyanızı Oluşturun’ düğmesine tıklayın.

OptinMonster kontrol paneliniz yeni bir web sayfasında açılacaktır.

İçeri girdikten sonra, giriş formunuzu açılır pencereye eklemek için kampanya türü olarak ‘Popup’ı seçmeniz gerekir.

Ardından, bir kampanya şablonu seçmeniz gerekir.

OptinMonster önceden oluşturulmuş şablonlar sunar, böylece birini hızlıca seçebilir ve düzenleyebilirsiniz.

Bir şablon seçtikten sonra, şimdi bir açılır pencere açılacaktır. Sizden kampanyanıza bir isim eklemenizi isteyecektir.

Bir isim girdikten sonra ‘İnşa Etmeye Başla’ düğmesine tıklayın.

Düğmeye tıkladığınızda, OptinMonster kampanya oluşturucusuna yönlendirileceksiniz.

Sol taraftaki menüden şablonunuza farklı bloklar ekleyebilirsiniz. Devam edin ve WPForms bloğunu ekleyin.

Bundan sonra, sol tarafınızdaki menüde WPForms blok seçeneklerini görmelisiniz.

‘Form Seçimi’ açılır menüsünden yeni oluşturduğunuz oturum açma formunu seçebilirsiniz.

Formunuzu göremiyorsanız, ‘Manuel Olarak Kısa Kod Ekle’ seçeneğini seçin ve WPForms’ta formu oluştururken daha önce kopyaladığınız kısa kodu girin.

Formunuzu kampanya oluşturucuda önizleyemiyorsanız endişelenmeyin. Kampanyayı yayınladığınızda form görünecektir.

Ardından, ‘Görüntüleme Kuralları’ sekmesine gidebilirsiniz. OptinMonster güçlü hedefleme seçenekleri sunar.

Buradan, ‘MonsterLink™’ (Tıklama Üzerine)’ görüntüleme kuralını seçin.

Bundan sonra, görüntüleme kuralı olarak MonsterLink’i göreceksiniz.

Devam edin ve ‘MonsterLink Kodunu Kopyala’ düğmesine tıklayın. Bu bağlantıya daha sonra ihtiyacınız olacak.

Şimdi en üstteki ‘Yayınla’ sekmesine gidebilirsiniz.

Yayınlama Durumunu ‘Taslak’ yerine ‘Yayınla’ olarak değiştirmeniz yeterlidir.

En üstteki ‘Kaydet’ düğmesine tıklamayı ve kampanya oluşturucudan çıkmayı unutmayın.

Ardından, kampanyanız için WordPress Çıktı Ayarlarını göreceksiniz. ‘Görünürlük ve Durum’ bölümünün altında Durum’un ‘Yayınlandı’ olarak ayarlandığından emin olun.

Durumu aktif hale getirmek için sağ üst köşedeki ‘Kaydet’ düğmesine tıkladığınızdan ve ‘Yayınla’ bölümüne gittiğinizden emin olun.

WordPress’te Modal Giriş Ekleme

Ardından, yeni bir WordPress sayfası oluşturabilir veya mevcut bir sayfayı düzenleyebilirsiniz.

İçerik düzenleyicisine girdikten sonra, ‘+’ düğmesine tıklayın ve bir Özel HTML bloğu ekleyin.

Bundan sonra, MonsterLink’i özel HTML bloğuna yapıştırmalısınız. Şuna benzer bir şey görünmelidir:

<a href="https://app.monstercampaigns.com/c/pimhy1fgvnqqqtormzmw/" target="_blank" rel="noopener noreferrer">log in or register</a>

Bu bir giriş formu olduğundan ve bir e-posta optiği olmadığından, koddaki ‘Şimdi Abone Ol’ yazan bağlantı metnini istediğiniz herhangi bir şeyle değiştirmek isteyeceksiniz. Bu eğitim için, yukarıdaki kod parçasında görebileceğiniz gibi ‘oturum açın veya kaydolun’ olarak değiştirdik.

Yukarıdaki kodu WordPress menülerinize, kenar çubuğunuza veya sitenizdeki herhangi bir alana da ekleyebilirsiniz.

Değişiklikleri WordPress sayfasına kaydettiğinizden emin olun ve modal oturum açma özelliğini çalışırken görmek için sitenizi ziyaret edin.

Umarız bu makale WordPress’te bir giriş açılır modalinin nasıl oluşturulacağını öğrenmenize yardımcı olmuştur. Ayrıca en iyi WordPress giriş sayfası eklentileri listemize ve WordPress ile açılış sayfası oluşturma kılavuzumuza da göz atabilirsiniz.

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.