WordPress Read More Butonu Yapımı

Hem ziyaretçiler açısından hem de SEO açısından uzun yazıların tamamını ana sayfa, kategori sayfalarında göstermenizi tavsiye etmiyorum. Bunun yerine yazının başlığını ve konuyla ilgili fikir verecek başlangıç kısmını gösterip kalanı için bir bağlantı vermeniz daha doğru olacaktır. Bu şekilde ziyaretçileriniz daha basit ve hızlı yüklenen sayfalarda rahat bir şekilde gezinip ilgisini çeken konuların tamamını okuma imkanına sahip olacaklardır.

Görünüm açısından daha düzenli bir şekilde içeriğinizi sunmanın yanında sayfalarınızın boyutunda gereksiz fazlalık oluşmadığından  yüklenme hızını artırmış olursunuz ve ziyaretçileriniz ilgisini çekmeyen yazıların arasında kaybolmak yerine diğerlerine odaklanabilirler.

Bu şekilde Wordpress altyapısı kullanan bir blogda “Read More” Devamını Oku şeklinde bir bağlantı oluşturmanın iki farklı yolu vardır.

1.Kendi istediğiniz bölümde kesmek

İlk yöntemimizde yazınızın kesmek istediğiniz bölümünde yazma panelinin üstündeki butona tıklayarak “Daha fazla oku” etiketi ekleyebilirsiniz. Bu yöntemin en önemli avantajı kesmek istediğiniz bölümü siz belirliyorsunuz. Yazı içeriğiyle ilgili yeterince fikir veren bir noktada isterseniz bir iki cümle ya da paragraf sonra yazınızı kesebilirsiniz. Bende tercihimi genellikle bu yöntemden yana kullanmaktayım.

2.the_excerpt ile otomatik olarak

Bu yöntemde the_excerpt fonksiyonuyla belirlediğiniz kelime sayısında yazı kesilerek otomatik olarak “Read More” linki eklenecektir. Avantajı her yazı için ayrı ayrı nerede böleceğinizi düşünmeden otomatik olarak yapılır. Dezavantajlarına değinmek gerekirse öncelikle yazı olmadık bir noktada bölünebilir, cümleler yarım kalabilir. Resimler ve yazı biçimlendirmeleri gösterilmez.

İkinci yöntemi kullanmak isterseniz temanızın yazıların listelendiği ilgili dosyalarında ufak bir değişiklik yapmanız gerekir.

<?php the_content(); ?>

yazan satırı aşağıdaki şekilde düzenlemeniz gerekiyor.

<?php the_excerpt(); ?>

Bu şekilde düzenlemenin ardından WordPress’te default olarak gelen şekilde yazılarınız 55 kelime olarak özetlenecektir. Bu sayıyı functions.php dosyasına yapacağınız bir ekleme ile değiştirebilirsiniz. Örneğin 35 kelimeye düşürmek için functions.php dosyasına eklemeniz gereken kod:

/* Yeni özetleme kelime sayısı*/
function my_excerpt_length($length) {
return 35;
}
add_filter('excerpt_length', 'my_excerpt_length');

Read More Linkini Biçimlendirme

İki yöntemden hangisini seçtiğiniz fatketmez. Şu anda elimizde Continue reading şeklinde bir link var. Bu linkimizi öncelikle Türkçe’ye çevirelim sonra bir buton haline getirelim ve son olarak biçimlendirme yaparak biraz renklendirelim. Öncelikle functions.php dosyasına aşağıdaki kodu ekleyin

function my_excerpt_more($more) {
global $post;
return '<div class="okumaya-devam"><a href="'. get_permalink($post->ID) . '" class="okumaya-devam-btn">Devamını Oku</a></div>';
}
add_filter('excerpt_more', 'my_excerpt_more');

Bu kodla okumaya-devam isminde bir <div> oluşturmuş olduk ve Devamını Oku linkimiz için okumaya-devam-btn şeklinde bir stil belirlemiş olduk. Artık temanızın style.css dosyasına yapacağınız eklemelerle linki istediğiniz gibi biçimlendirebilirsiniz.

.okumaya-devam {
float:right;
}
.okumaya-devam-btn{
display:inline-block;
background:#258fcd;
padding:7px 16px;
margin-top:10px;
color:#fff;
border:1px solid #d8dcdc;
font-family:Georgia,serif;
font-style:italic;
font-size:16px;
}
.okumaya-devam-btn:hover{
background:#454545;
border:1px solid #000000;
color:#FFFFFF;
}