Sitenizde yazının sonuna yazar kutusu eklemek ister misiniz.

Genelde yazıların sonunda yazar kendini tanıtır görmüşsünüzdür.

Bizim sitemizde de mevcut, yeni ekledim.

Yazar kutusu konusunda bir çok eklenti bulunuyor. Fakat eklentiler siteyi yavaşlatıyor!

Bazı temalarda yazar kutusu özellik olarak geliyor.

WordPress temanızda bu destek yok ise eklenti kurmak yerine kodları elle girmenizi tavsiye ederim.

Eklentisiz Yazar Kutusu Ekleme

Aşağıdaki kodu functions.php içine ekleyeceksiniz.

Functions.php yi bilmeyenler için kısaca özet geçeyim:

WordPresste kullandığınız temaya göre functions.php dosyası vardır.

Bu php dosyası içine içine ek php fonksiyonları girilmesi için vardır.

Üstelik temanız zamanla güncellense bile bu functions.php dosyasının başına bir şey gelmez kodunuz her zaman çalışır.

Bilmeyenler php içine kod yazmak ile uğraşmasınlar…

Bu konuda az bilgiye sahip olan arkadaşlara önerim şudur:

Code Snippets eklentisini indirin ve aşağıdaki kodu bu eklenti yardımı ile ekleyin:

Bu eklentiyi verdiğim koddan başka tüm functions kodları ile de kullanabilirsiniz.

O yüzden eklenti olarak bunu zaten herkese tavsiye ediyorum.

function wpb_author_info_box( $content ) {
  
global $post;
  
// Bir gönderi yazarına sahip tek bir gönderi olup olmadığını algılama
if ( is_single() && isset( $post->post_author ) ) {
  
// Yazarın görünen adını al
$display_name = get_the_author_meta( 'display_name', $post->post_author );
  
// Görünen ad yoksa, görünen ad olarak takma ad kullanın
if ( empty( $display_name ) )
$display_name = get_the_author_meta( 'nickname', $post->post_author );
  
// Yazarın biyografik bilgilerini veya açıklamasını alın
$user_description = get_the_author_meta( 'user_description', $post->post_author );
  
// Yazarın web sitesi URL'sini al 
$user_website = get_the_author_meta('url', $post->post_author);
  
// Yazar arşiv sayfasına bağlantı alın
$user_posts = get_author_posts_url( get_the_author_meta( 'ID' , $post->post_author));
   
if ( ! empty( $display_name ) )
  
$author_details = '<p class="author_name">Yazar: ' . $display_name . '</p>';
  
if ( ! empty( $user_description ) )
// Yazar avatarı ve biyografisi
  
$author_details .= '<p class="author_details">' . get_avatar( get_the_author_meta('user_email') , 90 ) . nl2br( $user_description ). '</p>';
  
$author_details .= '<p class="author_links"><a href="'. $user_posts .'">View all posts by ' . $display_name . '</a>';  
  
// Yazarın profilinde bir web sitesi olup olmadığını kontrol edin
if ( ! empty( $user_website ) ) {
  
// Yazar web sitesi bağlantısını görüntüle
$author_details .= ' | <a href="' . $user_website .'" target="_blank" rel="nofollow">Website</a></p>';
  
} else { 
// yazar web sitesi yoksa paragrafı kapatın
$author_details .= '</p>';
}
  
// Tüm bu bilgileri içerik yayınlamak için iletin
$content = $content . '<footer class="author_bio_section" >' . $author_details . '</footer>';
}
return $content;
}
  
//İşlevimizi yayın içeriği filtresine ekle
add_action( 'the_content', 'wpb_author_info_box' );
  
// Yazar biyografisinde HTML'ye izin ver
remove_filter('pre_user_description', 'wp_filter_kses');

Php kodunu ekledik.

Son olarak kodun görselliği kaldı, bunu da css kodları ile yapacağız.

Css kodlarını kolay yolla buradan ekleyebilirsiniz:

admin panelinizden sol taraftaki seçeneklerden sırasıyla,

Görünüm/özelleştir/gelişmiş seçenekler/ek css

Kısmına ekleyebilirsiniz.

Size 2 tane css vereceğim ya bunu kullanın:

/*
Yazar Kutusu Snipet
*/
.author_bio_section{
background-color: #F5F5F5;
padding: 15px;
border: 1px solid #ccc;
}  
.author_name{
font-size:16px;
font-weight: bold;
}  
.author_details img {
border: 1px solid #D8D8D8;
border-radius: 2%;
float: left;
margin: 8px 10px 0px 0px;
width: 98px;
}
.author_details {
text-align:justify
}

Ya da bunu kullanın:

/*
Yazar Kutusu Snipet
*/
.author_bio_section{
background-color: #F5F5F5;
padding: 15px 15px 0px 15px;
border: 1px solid #ccc;
  
}  
.author_name{
font-size:16px;
font-weight: bold;
margin-bottom: 0 !important;
}  
.author_details img {
border: 1px solid #D8D8D8;
border-radius: 2%;
float: left;
margin: 8px 10px 0px 0px;
width: 98px;
}
.author_details {
  text-align:justify;
  text-justify: inter-word;
}

Eklentisiz yazar kutusu konumuz bitmiştir. Sorularınız olursa yorum yazmaktan çekinmeyiniz efemm.