WordPress Oturum Açma Açılır Penceresi Modalı Nasıl Oluşturulur (Adım Adım)

Sitenize bir WordPress giriş popup modali eklemek, kullanıcılarınız için giriş yapmayı daha sorunsuz hale getirebilir. Ziyaretçilerin mevcut sayfalarından ayrılmadan giriş yapmalarına olanak tanır, bu da genel deneyimlerini artırır.

Kullanıcıları etkileşimde tutmak ve site etkileşimini iyileştirmek için bu özelliği kullanan birkaç başarılı web sitesi gördük. Oturum açma sürecini kolaylaştırmanın basit ama etkili bir yoludur.

Bu makalede, bir WordPress giriş açılır penceresi oluşturma adımlarını size adım adım anlatacağız.

WordPress Giriş Açılır Pencere Modalı Neden Oluşturulur?

Kullanıcıları ayrı bir sayfaya göndermeden giriş yapmayı daha hızlı ve sorunsuz hale getirdiği için bir giriş pop-up modali oluşturmalısınız.

Çoğu web sitesinde, biri giriş bağlantısını tıkladığında, varsayılan WordPress giriş sayfasına veya özel bir giriş sayfasına yönlendirilir. Giriş yaptıktan sonra tekrar yönlendirilirler.

Bu ileri geri gitme yavaş hissedilebilir ve kullanıcı deneyimini kesintiye uğratabilir. Bir modal giriş pop-up'ı bu sorunu çözer. Giriş formunu aynı sayfada küçük bir pencerede açar.

Kullanıcılar anında giriş yapabilir ve giriş yaptıktan sonra onları istediğiniz yere yönlendirebilirsiniz. İşlem daha hızlı ve daha profesyonel hissettirir, bu da kullanıcı deneyimini iyileştirebilir ve hatta dönüşümleri artırabilir.

Bunu göz önünde bulundurarak, hem ücretsiz bir eklenti hem de premium araçlar kullanarak WordPress'te kolayca bir modal giriş pop-up'ı oluşturmayı göstereceğiz. Sizin için en iyi çalışan yönteme atlayabilirsiniz:

Hazır mısınız? Hemen başlayalım!

Yöntem 1: Giriş/Kaydol Popup Kullanarak Modal Giriş Popup Oluşturma

İlk yöntem için, kullanıcılarınızın sitenizde kolayca giriş yapmalarını veya kaydolmalarını sağlayan ücretsiz bir eklenti olan Giriş/Kaydol Açılır Penceresi eklentisini kullanacağız.

Öncelikle Giriş/Kaydol Açılır Penceresi eklentisini kurmanız ve etkinleştirmeniz gerekecektir. Yardıma ihtiyacınız olursa, lütfen WordPress eklentisi nasıl kurulur hakkındaki kılavuzumuza bakın.

Etkinleştirdikten sonra, WordPress yönetici panelinden Login/Signup Popup » Ayarlar bölümüne gidebilirsiniz.

'Genel' ayarları altında, kaydı etkinleştirebilir, kullanıcılar kaydolduktan sonra otomatik olarak oturum açmalarını sağlayabilir ve şifre sıfırlamalarını yönetebilirsiniz.

Bunun yanı sıra, eklenti yeni kayıtlı kullanıcılara atanacak WordPress kullanıcı rolünü seçmenize de olanak tanır. Varsayılan olarak, 'Abone' rolünü atayacaktır.

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

Herhangi bir değişiklik yaptıysanız, ‘Kaydet’ düğmesine tıklamayı unutmayın.

Ardından, 'Stil' sekmesine geçebilir ve giriş/kaydol açılır pencere modülünüzü düzenleyebilirsiniz. Eklenti, açılır pencere 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 pencere modalındaki form alanlarını da özelleştirebilirsiniz.

WordPress kontrol panelinizden Login/Signup Popup » Alanlar'a gidin. Burada, farklı form alanlarını etkinleştirebilir, etiketlerini düzenleyebilir, zorunlu alanlar yapabilir ve daha fazlasını yapabilirsiniz.

Bunun yanı sıra, oturum açma/kaydolma açılır pencerenize daha fazla alan ekleme seçeneği de vardır.

Giriş modal açılır pencerenize eklemek için ek form alanları seçmek üzere üstteki ‘+ Alan Ekle’ düğmesine tıklamanız yeterlidir.

Form alanlarını özelleştirdikten sonra, modal oturum açma açılır penceresini web sitenize ekleyebilirsiniz. Eklenti, açılır pencereyi sitenize eklemenin farklı yollarını sunar.

Menülere Giriş Pop-up Modalı Ekle

Öncelikle, WordPress kontrol panelinizden Görünüm » Menüler'e gidebilirsiniz.

Bundan sonra, ‘Giriş/Kaydol Açılır Penceresi’ 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ü nasıl eklenir hakkındaki kılavuzumuza bakın.

Çapa Bağlantıları Olarak Giriş Pop-up Modalı Ekle

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, bir giriş bağlantısı oluşturmak için şu şekilde HTML kullanırsınız:

<a href="https://www.myawesomesite.com/#login">Login</a>

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

İçerik düzenleyicisine girdikten sonra, 3 noktaya tıklayıp 'HTML olarak düzenle' seçeneğini seçmek isteyeceksiniz.

Bundan sonra, oturum açma bağlantı metnine dahili bağlantıyı ekleyebilirsiniz.

WordPress'te bağlantı bağlantıları nasıl eklenir hakkındaki kılavuzumuzu izleyerek daha fazlasını öğrenebilirsiniz.

Oturum Açma Açılır Penceresi Modalı Eklemek İçin Kısa Kodları Kullanın

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

Açılır pencereyi açmak için bir bağlantı/düğme oluşturmak üzere [xoo_el_action] kısa kodunu sitenizin herhangi bir yerine girebilirsiniz.

Örneğin, web sitenizin kenar çubuğunda oturum açma açılır penceresini göstermek için Görünüm » Widget'lar bölümüne gidip bir 'Kısa Kod' bloğu ekleyebilirsiniz.

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

Şimdi, giriş 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şturma

Bu yöntem, oturum açma açılır penceresinin tasarımı ve davranışı üzerinde daha fazla kontrol isteyenler için harikadır.

WPForms ve OptinMonster'ı birlikte kullanmak, güçlü tasarım seçenekleri, gelişmiş görüntüleme kuralları (bir kullanıcının belirli bir bağlantıyı tıklamasından sonra açılır pencereyi göstermek gibi) ve e-posta pazarlama hizmetleriyle daha iyi entegrasyon sağlar.

WPForms, en iyi WordPress iletişim formu eklentisidir ve 'Kullanıcı Kaydı' eklentisine erişmek için en az Pro planına ihtiyacınız olacaktır.

OptinMonster, piyasadaki en iyi WordPress açılır pencere eklentisidir. Web sitesi ziyaretçilerini abonelere ve müşterilere dönüştürmenize yardımcı olur. WPBeginner'da, etkileşimli açılır pencereler oluşturmak için birkaç kez kullandık ve mükemmel bir deneyim yaşadık. Daha fazla ayrıntı için tam OptinMonster incelememize bakın.

Bu makalede gösterdiğimiz aracın MonsterLinks özelliğine erişmek için en az Plus planına ihtiyacınız olacağını unutmayın.

Bir Kullanıcı Oturum Açma Formu Oluşturmak İçin WPForms Kullanma

Öncelikle WPForms eklentisini kuralım ve etkinleştirelim. Daha fazla ayrıntı için, WordPress eklentisi nasıl kurulur hakkındaki adım adım kılavuzumuza bakabilirsiniz.

Etkinleştirdikten sonra, lisansı girmek için WordPress kontrol panelinizden WPForms » Ayarlar bölümüne gitmeniz gerekecektir.

Anahtarı WPForms hesap alanınızda bulabilirsiniz.

Ardından, 'Kullanıcı Kaydı Eklentisi'ni kurmak ve etkinleştirmek için WPForms » Eklentiler bölümüne gidelim.

Eklentiyi etkinleştirdikten sonra, WPForms » Yeni Ekle'ye gitmek ve yeni bir form oluşturmak isteyeceksiniz.

Bir sonraki ekranda, önce formunuza bir ad vermeniz gerekecektir.

Ardından, şablon galerisinden önceden oluşturulmuş bir form şablonu seçeceksiniz. ‘Kullanıcı Giriş Formu’ şablonunu kolayca bulmak için arama çubuğunu kullanabilirsiniz.

Bulduğunuzda, ‘Şablonu Kullan’ düğmesine tıklayabilirsiniz.

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

İhtiyacınız olan ek alanları ekranın sol tarafından sürükleyip bırakabilirsiniz.

Sonra, 'Şifre' alanına tıklayabilirsiniz ve alan seçenekleri sol tarafta görünecektir.

‘Şifre’ alanının açıklama kutusuna, ‘şifremi unuttum’ ve ‘kullanıcı kaydı’ gibi seçenekleri görüntülemek için aşağıdaki 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 ve formu yayınlamaya hazırsınız.

Başlamak için 'Göm' düğmesine tıklayabilirsiniz.

Oturum açma formunuzu ekleme seçenekleriyle bir açılır pencere açılacaktır.

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

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

Burada, kısa kodu kopyalamak ve daha sonra kullanmak üzere kaydetmek isteyeceksiniz.

Bir Modal Açılır Penceresi Oluşturmak İçin OptinMonster Kullanma

Bu noktada giriş formunuz hazır. Bir sonraki adım, OptinMonster kullanarak modal açılır penceresini oluşturmaktır.

Öncelikle OptinMonster web sitesini ziyaret etmeniz ve bir hesap için kaydolmanız gerekecektir.

Ardından, OptinMonster eklentisini kurmanız ve etkinleştirmeniz gerekecektir. Daha fazla ayrıntı için, WordPress eklentisi nasıl kurulur hakkındaki 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ştirdikten sonra hoş geldiniz ekranını görmelisiniz. Mevcut Hesabınızı Bağlayın düğmesine tıklayın.

Şimdi yeni bir pencere açılacak.

'WordPress'e Bağlan' düğmesine tıklamanız yeterlidir.

Bağlandıktan sonra, modal açılır pencerenizi oluşturmaya hazırsınız.

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

Bir sonraki ekranda bir kampanya ve bir şablon seçeceksiniz.

Bir açılır pencere modalı oluşturduğumuz için, kampanya türü olarak ‘Popup’ seçelim.

Şablon olarak OptinMonster, gerektiğinde hızlı bir şekilde ayarlayabilmeniz için birçok önceden oluşturulmuş şablon sunar.

Bir şablon seçtikten sonra bir açılır pencere açılacaktır. Kampanyanıza bir ad eklemenizi isteyecektir.

Bir ad girdikten sonra 'Oluşturmaya Başla' düğmesine tıklayabilirsiniz.

Bu işlem tamamlandığında, OptinMonster kampanya oluşturucuya yönlendirileceksiniz.

Soldaki menüden şablonunuza farklı bloklar ekleyebilirsiniz. Öyleyse devam edin ve WPForms bloğunu ekleyin.

Bundan sonra, sol menünüzde WPForms blok seçeneklerini görmelisiniz.

‘Form Seçimi’ açılır menüsünden az önce oluşturduğunuz giriş formunu seçebilirsiniz.

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

Kampanya oluşturucuda formunuzu önizleyemezseniz endişelenmeyin; kampanya yayınlandığında form görünecektir.

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

Buradan, ‘MonsterLink™’ (Tıklandığında)’ görüntüleme kuralını seçmek isteyeceksiniz.

Seçeneği seçtikten sonra, görüntüleme kuralı olarak MonsterLink'i görmelisiniz.

Devam edin ve 'MonsterLink Kodunu Kopyala' düğmesine tıklayın, ardından bağlantıyı güvenli bir yerde saklayın. Daha sonra ihtiyacınız olacak.

Şimdi kampanyayı yayına almaya hazırsınız.

Kampanya oluşturucunun üst kısmındaki ‘Yayınla’ sekmesine gidin. Buradan ‘Yayın Durumu’nu ‘Yayınla’ olarak ayarlayabilirsiniz.

Bunu yaptıktan sonra, değişikliklerinizi kaydetmek için sağ üst köşedeki 'Kaydet' düğmesine tıklamayı unutmayın.

WordPress'te Modal Giriş Ekleme

Şimdi yeni bir WordPress sayfası oluşturabilir veya mevcut bir sayfayı düzenleyebilirsiniz.

İçerik düzenleyicisine girdikten sonra, ‘+’ düğmesine tıklayıp ‘Özel HTML’ bloğu ekleyebilirsiniz.

Bundan sonra, MonsterLink'i özel HTML bloğuna yapıştırmanız gerekecek. Şuna benzemelidir:

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

Varsayılan olarak, MonsterLink kodunuzdaki bağlantı metni ‘Şimdi Abone Ol’ diyecektir, çünkü genellikle e-posta opt-inleri için kullanılır.

Varsayılan kod örneği aşağıdadır:

<a href="https://app.monstercampaigns.com/c/pimhy1fgvnqqqtormzmw/" target="_blank" rel="noopener noreferrer">Subscribe Now</a>

Bu bir giriş formu olduğu için, bu metni değiştirmek isteyeceksiniz. Bu eğitim için, aşağıdaki kod parçacığında görebileceğiniz gibi 'giriş yap veya kaydol' olarak değiştirdik.

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

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

WordPress sayfasındaki değişiklikleri kaydettiğinizden ve modal girişin çalışmasını görmek için sitenizi ziyaret ettiğinizden emin olun.

Bonus İpucu: WordPress Formlarında Kullanıcı Yolculuğunu Takip Edin

Artık WordPress'te bir giriş açılır penceresi oluşturmayı öğrendiğinize göre, WordPress formlarınız için kullanıcı yolculuklarını nasıl izleyeceğimize bakalım.

Bu, oturum açma formunuz için özellikle yararlı olabilir, çünkü kullanıcıların oturum açmaya veya kaydolmaya karar vermeden hemen önce hangi içeriğe baktıklarını ortaya çıkarabilir. Bu bilgi, sitenizin gezinmesini ve kullanıcı deneyimini iyileştirmenize yardımcı olabilir.

Kullanıcıları formları tamamlamaya neyin teşvik ettiğini bilmek, daha fazla potansiyel müşteri elde etmek ve işletmenizi büyütmek için bu süreci yeniden oluşturmanıza olanak tanır. Google Analytics bazı kullanıcı etkinliklerini gösterebilse de, davranışı doğrudan formu gönderen belirli kullanıcıya bağlamaz.

İşte WPForms burada devreye giriyor. Kullanıcıların nereden geldiğini, hangi yolu izlediklerini ve bir formu göndermeden önce her sayfada ne kadar zaman harcadıklarını görmenizi sağlayan bir ‘Kullanıcı Yolculuğu’ eklentisi (Elite planıyla kullanılabilir) içeren popüler bir form oluşturucu eklentisidir.

Daha fazla bilgi edinmek isterseniz, WordPress potansiyel müşteri formlarında kullanıcı yolculuğunu nasıl izleyeceğiniz konusundaki kılavuzumuza başvurmaktan çekinmeyin.

WordPress Oturum Açma Açılır Penceresi Modalı Oluşturma Hakkında Sıkça Sorulan Sorular

WordPress'te bir giriş açılır penceresi ekleme hakkında okuyucularımızın sıkça sorduğu sorular şunlardır:

WordPress giriş açılır penceresinin tasarımını özelleştirebilir miyim?

Evet, kesinlikle. Bahsettiğimiz her iki yöntem de web sitenizin markasına uyacak şekilde özelleştirme seçenekleri sunar. Sorunsuz bir görünüm oluşturmak için genellikle renkleri, yazı tiplerini, boyutları değiştirebilir ve kendi logonuzu ekleyebilirsiniz.

Bir giriş açılır penceresi mobil cihazlarda çalışır mı?

Evet. OptinMonster gibi modern açılır pencere eklentileri tamamen duyarlı olacak şekilde tasarlanmıştır. Bu, giriş modalınızın masaüstü bilgisayarlar, tabletler ve akıllı telefonlarda harika görünecek şekilde otomatik olarak ayarlanacağı anlamına gelir.

Oturum açma açılır pencereleri bir web sitesini yavaşlatır mı?

WPForms ve OptinMonster gibi iyi kodlanmış ve optimize edilmiş eklentiler kullandığınızda, sitenizin performansında fark edilir bir etki olmamalıdır. Bu araçlar hafif olacak ve verimli bir şekilde yüklenecek şekilde tasarlanmıştır.

Açılır pencereye sosyal giriş düğmeleri ekleyebilir miyim?

Bazı eklentiler, yerleşik veya premium bir özellik olarak sosyal giriş işlevi sunar. Örneğin, Login/Signup Popup eklentisinin pro sürümü sosyal girişleri destekler. Bu, kullanıcıların oturum açmasını daha da kolaylaştırabilir.

Umarız bu makale, WordPress'te bir giriş açılır penceresi modülü oluşturmayı öğrenmenize yardımcı olmuştur. Ayrıca en iyi WordPress giriş sayfası eklentilerinin tam listemize ve WordPress'te başarılı giriş sonrası kullanıcıları nasıl yönlendireceğiniz konusundaki kılavuzumuza da göz atabilirsiniz.

Bu makaleyi beğendiyseniz, lütfen WordPress video eğitimleri için YouTube Kanalımıza abone olun. Bizi ayrıca Twitter ve Facebook'ta da bulabilirsiniz.