Wordpress Konuları

WordPress’te Custom Logo Nasıl Eklenir?

25/10/2022

WordPress’te yeni bir tema oluştururken sayfaya eklenecek logo için de functions.php üzerinden custom WordPress logo konfigürasyonu gerekiyor.

WordPress Logo Değiştirme

Panel üzerinde Görünüm > Özelleştir > Site Kimliği sekmesinde logo ekleyebileceğiniz alan olur, yeni oluşturulan bir WordPress temasında functions.php üzerinden bu alanı aktifleştirmezseniz “Site Kimliği” sekmesinde logo ekleme alanı görünmez.

Wordpress Panel Özelleştir

functions.php üzerinden konfigürasyon yapılmamış WordPress özelleştirme ekranı

WordPress Custom Logo Ekleme

functions.php dosyasına aşağıdaki kodu olduğu gibi kopyalayıp yapıştırdığınızda “Site Kimliği” sekmesindeki logo ekleme alanı aktifleşiyor.

add_theme_support( 'custom-logo' );

Yukarıdaki kod custom logo’yu tetikler fakat aşağıdaki kod yapısı ile de custom logo eklerken add_theme_support('custom-logo') fonksiyonunun bazı parametreleri üzerinde değişiklik yapabilirsiniz. Kod functions.php içine eklenecek.

function themename_custom_logo_setup() { 
   $defaults = array( 
     'height' => 100, 
     'width' => 400, 
     'flex-height' => true, 
     'flex-width' => true, 
     'header-text' => array( 'site-title', 'site-description' ), 
     'unlink-homepage-logo' => false, 
   ); 

   add_theme_support( 'custom-logo', $defaults ); 
} 
add_action( 'after_setup_theme', 'themename_custom_logo_setup' );

height ve width değerleri kullanıcı tarafından logo yüklenirken logo için beklenilen boyut değerlerini sınırlar.
flex-height ve flex-weight belirtilen width ve height değerlerinin değiştirilip değiştirilemeyeceğini belirtir. “true” ve “false” değerleri kullanılır. Örnek olarak 1oopx height, 400px width değerleri belirtilmiş dizide flex-height ve flex-width değerleri false olarak belirtilmişse, WordPress paneli kullanıcının ekleyeceği logoyu 100px yükseklik ve ve 400px genişlikte kırpar.
unlink-homepage-logo logo üzerinden ana sayfaya link verilmesini engeller, true kullanıldığında logo üzerinden link verilmez, false kullanıldığında logo üzerine link eklenir.

Logoyu Sayfada Gösterme

Logoyu göstermek için aşağıdaki kodu kullanın. Genelde header.php dosyası içerisinde kullanılır fakat bu developer’ın tercihine göre değişir.

the_custom_logo()

Sadece the_custom_logo() kodu ile logo sayfayada gösterilebiliyor fakat WordPress’in önceki sürümleriyle uyumluluğu korumak amacıyla aşağıdaki formatta olduğu gibi function_exists() kodu ile kullanılmasını WordPress öneriyor. Çünkü eski WordPress sürümlerinde fonksiyon isim olarak farklı kullanılıyor olabilir.

if ( function_exists( 'the_custom_logo' ) ) {
  the_custom_logo();
}

Eğer farklı bir logo URL’i kullanmak istiyorsanız veya <img> etiketi içinde kendininiz düzenleme yapmak istiyorsanız aşağıdaki örnek yapı gibi bir yapı kullanabilirsiniz.

$custom_logo_id = get_theme_mod( 'custom_logo' );
$logo = wp_get_attachment_image_src( $custom_logo_id , 'full' );
if ( has_custom_logo() ) {
    echo '<img src="' . esc_url( $logo[0] ) . '" alt="' . get_bloginfo( 'name' ) . '">';
} else { 
    echo '<h1>' . get_bloginfo('name') . '</h1>'; 
}