Düz Kullanıcı Arayüzü ile Özel Bir WordPress Giriş Formu Oluşturma

Son güncelleme - 8 Temmuz 2021

WordPress oldukça uzun bir süredir var. Blogcular için bir portal olarak başlayan şey, şimdi dünyadaki toplam web sitelerinin neredeyse yarısını işletmekten sorumlu bir içerik yönetim sistemi haline geldi. Basit ama sezgisel arayüzü ve özelleştirilebilir tasarımları, onu dünya çapında web sitelerini sıfırdan oluşturmak isteyen web geliştiricileri ve tasarımcıları için bir numaralı tercih haline getirdi.

WordPress kullanan herkes, kullanıcı deneyimini geliştirmek ve tıklama oranlarını yükseltmek için ayrıntılara ve özgünlüğe önem verir. Çoğu geliştirici, esas olarak yalnızca temalara odaklanır, ancak üyelik siteleri ve diğer platformlar için başlangıç ​​noktası bir giriş sayfasıdır. Şunu hayal edin, bir web sitesine yeni kaydolmuş bir üyeyseniz ve kayıtlı olmayan üyelere benzer bir ekrana giriş yaparsanız, etki biraz azalır ve sizi tatminsiz hissettirir. Ancak, işletmenizin gereksinimlerine ve estetiğine uyacak şekilde özelleştirilmiş bir WordPress giriş sayfasına sahip olmak, ziyaretçiler üzerinde daha iyi bir izlenim bırakır ve ilgilerini çeker.

Buna yardımcı olmak için, web sitesi tasarım şemanızla görsel olarak bütünleşen özel bir WordPress giriş sayfası için stillerinizi dahil etmek için bazı basit yönergeleri özetledik.

Eklentisiz Özel WordPress Giriş Sayfası Oluşturma

Seçtikleri temanın function.php dosyasındaki kaynak kodunu güncelleyerek WordPress giriş sayfasında birkaç değişiklik yapılabilir. Bununla birlikte, WordPress'i bir kez güncellediğinizde bu değişiklikler kaybolacaktır. Bunun nedeni, giriş sayfası için tema stil sayfanızın, özel giriş sayfası için başka bir stil sayfası oluşturmanızı gerektiren WordPress tema kurulumunun bir parçası olmamasıdır.

Tema klasörünüzde “Giriş” adlı bir klasör oluşturarak başlayın ve custom-login-style.css adında bir .txt dosyası ekleyin . Bundan sonra, oturum açma sayfasını özelleştirmek ve benzersizlik eklemek için bazı temel değişiklikler yapmaya devam edebilirsiniz.

Arka Planı Değiştir

Sayfanın veya belirli bir düğmenin arka plan rengini güncellemek için arka plan rengini seçeceksiniz : #222222 ve hexa kodunu istediğiniz renge değiştireceksiniz. İşinizin estetiğini tamamlayan ve görsel olarak çekici bir renk seçmek için bir renk paletinden yardım alın.

Ek olarak, oturum açma sayfanızın arka plan resmini değiştirmek istiyorsanız, arka plan resmi kod satırını seçin : url(logo_login.png') ve dosyanın adı olan logo_login.png 'yi güncellenmiş resim dosyası URL'nizle değiştirin .

Müşterilerinin markalarını hatırlamasını isteyen işletmeler, WordPress logosunu kendi özel logolarıyla değiştirebilir. Özel logo resim dosyasını Giriş klasörünüze kaydettikten sonra, dosya adını arka plan resmi: url('logo_login') kodunda özel logonuzla değiştirin.

Doldurma ve kenar boşluğunu ayarlayarak Giriş formunu özelleştirme

Geliştiriciler, sayfalarını çekici ve sitelerinin görünümüne uygun hale getirmek için Giriş formunu ayarlayabilir. Düğmelerin doldurulmasından etiketlerin rengine ve yazı tipi boyutuna vb. Düğmenin içine daha fazla boşluk ekleyebilirsiniz, böylece dolguyu artırarak metnin sıkışık görünmemesini sağlayabilirsiniz; sadece kod dolgusundaki sayıları artırın: 12px 12px 12px 12px. Düğmenin dışında, çevreleyen öğelerin sıkıca paketlenmemesi için daha fazla alan oluşturmak istiyorsanız, bunu kod kenar boşluğundaki kenar boşluğu alanını artırarak yapabilirsiniz: 12px 12px 12px 12px. Birkaç beyaz boşluk eklemek kadar basit bir şey bile, toplu olarak giriş sayfanızın son görünümü üzerinde bir etkiye sahip olabilir ve daha fazla bir araya getirilmiş görünmesini sağlayabilir.

Yazı tipi boyutunu ve rengini değiştirme

Sayıyı istediğiniz boyuta ayarlayarak, font-size: 15px kodunu kullanarak paragraf metninin, bağlantıların veya form alanlarının yazı tipi boyutunu değiştirebilirsiniz. Aynı şey, kod rengindeki rengi güncelleyerek ve rengi değiştirerek yazı tipi rengi için de yapılabilir : #222222 .

Oturum Açma Hata Mesajını Değiştirme

İnternetteki siber suçlar ve dolandırıcılıkların artmasıyla birlikte, web geliştiricileri ve işletme sahipleri web sitelerini riske atamaz ve gizli verilerini kaybedemez. Bir kullanıcı aceleyle yanlış oturum açma kimlik bilgilerini girdiğinde, otomatik olarak varsayılan bir hata mesajı oluşturulur. Bu, kullanıcılara bu hatanın sinyalini vermek için olsa da, bilgisayar korsanlarının oturum açma verilerini kırmaya çalışması bir boşluk olabilir. Bu nedenle, bilgisayar korsanlarını uzak tutmanın en iyi yolu function.php dosyasındaki hata mesajını değiştirmektir.

Özetlemek gerekirse, kapsamlı CSS bilgisine sahip olanlar, WordPress Giriş formunun stili ve özelleştirilmesi üzerinde nihai kontrole sahip olabilir. Ancak, kodlama becerilerinizin eksikliği ve özel bir giriş sayfası oluşturma yeteneğinizi kısıtlıyorsa, endişelenmeyin! WordPress web geliştirme sürecini kolaylaştırmak için WordPress deposunda hizmetinizde olan çeşitli eklenti seçenekleri vardır ve sizin için en popüler olanları listeledik.

Giriş Özelleştirici Eklentisi

Login Customizer, en kullanıcı dostu eklentilerden biridir ve doğrudan WordPress Customizer'ınızdan değişiklik yapmanıza olanak tanır. Basit bir kurulum işleminden sonra WordPress Panonuzdan Görünüm sekmesinden kolayca erişebilirsiniz . Özelleştirmeye Başla'ya tıklayın, sizi tüm alanları beğeninize göre yeniden tasarladığınız özelleştirici ekranına yönlendirecektir.

Colorlib Giriş Özelleştiricisi

Colorlib Login Customizer, premium bir eklentide bulunan tüm işlevleri taşıyan ancak bunları ücretsiz olarak sunan becerikli ve esnek bir araçtır. Geniş benzersiz özellikleri, kullanıcıları için özel bir çözüm oluşturmak isteyen web geliştiricileri için mükemmel bir seçimdir. Bu da WordPress Özelleştirici aracılığıyla özelleştirmeye izin verir, böylece giriş sayfanızda kolayca gezinebilir ve yeniden şekillendirebilirsiniz.

Özetle

Sonuç olarak, bir giriş sayfasını özelleştirmek için birden fazla yaklaşım vardır ve tüm deneyim seviyelerindeki geliştiriciler bunları deneyebilir. Önemli olan, özel WordPress giriş sayfasının, kullanıcı deneyimini geliştirmek için gerçek sitenin estetiğiyle eşleşmesi ve tamamlamasıdır. Sitenizin giriş sayfasını özelleştirmek, müşterileri memnun etmenin ve bir marka kimliği oluşturmanın basit ama etkili bir yoludur. Basitten başlamak ve temeller üzerine inşa etmek, basit bir ekranı muhteşem bir şeye dönüştürebilir ve müşterilere daha önce hiç görmedikleri kişiselleştirilmiş bir çevrimiçi deneyim sunabilir.