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?

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

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

Ne yazık ki, bu kullanıcılar için sakıncalı olabilir.

Modal bir giriş 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 herhangi bir sayfaya yönlendirebilirsiniz. Süreç daha hızlı ve daha cilalı olduğu için kullanıcı deneyimini iyileştirmeye ve dönüşümlerinizi artırmaya yardımcı olabilir.

Bunu akılda tutarak, ücretsiz bir eklenti ve premium eklentiler kullanarak WordPress'te kolayca bir modal oturum açma açılır penceresi oluşturmayı göstereceğiz. Tercih ettiğiniz yönteme atlamak için aşağıdaki bağlantılara tıklayabilirsiniz:

• Yöntem 1: Giriş/Kaydol Popup Kullanarak Modal Giriş Popup Oluşturma
• Yöntem 2: WPForms ve OptinMonster Kullanarak Modal Giriş Açılır Penceresi Oluşturma
• Bonus İpucu: WordPress Formlarında Kullanıcı Yolculuğunu Takip Edin

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 oturum açmalarını veya kaydolmalarını sağlayan ücretsiz bir eklenti olan Login/Signup Popup eklentisini kullanacağız.

Öncelikle, Login/Signup Popup eklentisini yükleyip etkinleştirmeniz gerekecektir. Yardıma ihtiyacınız olursa, lütfen bir WordPress eklentisinin nasıl kurulacağına dair kılavuzumuza bakın.

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

'Genel' ayarları altında kayıt etkinleştirebilir, kullanıcıyı otomatik oturum açtırabilir veya kaydolabilir 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ş/kayıt açılır pencere modalı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.

1. Menülere Oturum Açma Açılır Penceresi Ekleyin

Ö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ü ekleme kılavuzumuza bakın: WordPress'te gezinme menüsü ekleme.

2. Giriş Açılır Penceresini Bağlantı Olarak 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, URL'niz şuna benzer olabilir:

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

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

içerik düzenleyiciye girdikten sonra, 3 noktaya tıklamak ve '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 çapa bağlantıları ekleme rehberimizi takip ederek daha fazla bilgi edinebilirsiniz.

3. Giriş Açılır Penceresi Modalı Eklemek İçin Kısa Kodları Kullanın

Oturum açma/kaydolma 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, giriş açılır penceresini web sitenizin kenar çubuğunda göstermek için Görünüm » Widget'lar bölümüne gidip bir kısa kod widget 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ıya tıkladıktan sonra popup'ı 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 Pro plana ihtiyacınız olacağını unutmayın.

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

İlk olarak, WPForms eklentisini kuralım ve etkinleştirelim. Daha fazla ayrıntı için, WordPress eklentisinin nasıl kurulacağına dair 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, bir hesap için kaydolmak üzere OptinMonster web sitesini ziyaret etmeniz gerekecek.

Ardından, OptinMonster eklentisini yükleyip etkinleştirmeniz gerekecektir. Daha fazla ayrıntı için, bir WordPress eklentisinin nasıl kurulacağına dair 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.

içerik düzenleyicisindeyken, '+' düğmesine tıklayabilir ve 'Ö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' olacaktır, çünkü genellikle e-posta izinleri 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.

Formları doldurmaya kullanıcıları 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'un devreye girdiği yer burasıdır. 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 ‘Kullanıcı Yolculuğu’ eklentisini içeren popüler bir form oluşturucu eklentisidir.

Daha fazla bilgi edinmek isterseniz, WordPress formlarında kullanıcı yolculuğunu nasıl izleyeceğinize dair kılavuzumuza başvurmaktan çekinmeyin.

Sıkça Sorulan Sorular (SSS)

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ım bu makale, WordPress'te bir giriş açılır penceresi oluşturmayı öğrenmenize yardımcı olmuştur. Ayrıca, en iyi WordPress giriş sayfası eklentileri hakkındaki tam listemize ve WordPress'te başarılı giriş sonrası kullanıcıları yönlendirme rehberimize 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.