WordPress Login Sayfasını Düzenleyerek Logonuzu Ekleyin

Sitelerimizin özgün bir tasarıma sahip olması için elimizden geleni yapıyoruz. Eğer yeterince bilginiz, zamanınız varsa komple kendinizin oluşturacağınız bir tasarımı kullanmanız en iyisi olacaktır. Şu var ki, kendi denemelerimden yola çıkarak, bunun özellikle WordPress için hayli zahmetli bir iş olabileceğini düşünüyorum. Benim gibi hazır temalardan birini seçip kullanmak da kötü bir alternatif sayılmaz. Kullandığınız temaya kendi logonuzu ekleyip, renklerini ve fontlarını kendinize göre düzenledikten sonra diğerlerinden farklı ve hoş bir tasarım oluşturmanız gayet mümkün.

Sitemizin ziyaretçilerin gördüğü bölümlerini düzenlerken ziyaretçilere kapalı kısımları örneğin WordPress Login Sayfasını (wp-login.php)da kendinize göre düzenlemenizin önünde bir engel yok. Sitenizde tek yazar siz değilseniz bu işlemi mutlaka yapmanızı tavsiye ederim. Eğer tek yazar sizseniz, sayfayı yalnızca siz görüyorsanız, tercih sizindir ama Yönetici paneline giriş yaparken kendi logonuzu görmeniz bence daha iyi olacaktır.

WordPress Login Sayfasına Logo Nasıl Eklenir?

Ben kendi WordPress Login Ekranımı aşağıdaki kodlarla düzenledim. Örnek olması açısından bunu sizinle paylaşmak istiyorum.

function qot_login() {
echo '<style type="text/css">
body.login {
  background-image: url('.get_bloginfo('template_directory').'/images/loginbackground.jpg) !important;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
}
.login h1 a {
background-image:url('.get_bloginfo('template_directory').'/images/logom.png) !important; 
height: 75px !important; width: 300px !important;
background-size: 300px auto !important;
}

.login form { 
background: #F3F5F8;
 
 }
</style>';
}
add_action('login_head', 'qot_login');

Bu kodları kendinize göre düzenleyerek temanızın içindedeki functions.php dosyasında <?php ?> arasında herhangi bir yere eklemeniz gerekiyor.

  • body.login bölümünde sayfa için bir arkaplan resmi seçip, ilgili özellikleri belirledik. Ben arkaplan resmimi temamın içindeki images klasörüne yüklediğim için url olarak bunu girdim. parantez içindeki
    '.get_bloginfo('template_directory').'/images/loginbackground.jpg

    yazan bölüme arkaplan resminin adresini girin.

  • .login h1 a kısmıyla logomu ekledim. Yine images klasöründe yer aldığından url olarak şu adresi yazdım.
    '.get_bloginfo('template_directory').'/images/logom.png

    Genişlik (width) ve yüksekliği (height) kendi logonuzun büyüklüğüne göre belirleyin.

  • .login form ile form bölümü için farklı bir arkaplan rengi belirledim.

İlk yorum yapan olun

Bir yanıt bırakın

E-posta hesabınız yayımlanmayacak.


*