Web Günlüğü

Blogger yazı okunma süresi nasıl gösterilir

Blogger yazı okunma süresi
Fırsat buldukça blogger ile ilgili ipucu, eklenti ve geliştirmeler hakkında paylaşımlar yapmaya devam ediyorum. Fakat bunu yaparken önceliğim daha çok henüz keşfedilmemiş, paylaşılmamış olan konular. Bugün de bu düşünceyle devam ederek başka blog plaftormlarında gördüğüm yazı okunma süresi özelliği oldu. Uygulaması oldukça kolay, bloggerda yazıların okunma süresini göstermeye yarayan bir kod parçasını paylaşmak istedim. Yazı bilgi alanlarına eklenerek kullanılabilecek bu kod parçası temelinde yazı uzunluğuna göre ortalama olarak yazının ne kadar sürede okunabileceğini gösteriyor.

Blogger yazı okunma süresi özelliği için gerekli javascript kodları

(<body></body> etiketleri arasında bir yere eklenebilir)
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
var txt = $('.entry-content')[0].textContent,
wordCount = txt.replace( /[^\w ]/g, "" ).split( /\s+/ ).length;
var readingTimeInMinutes = Math.floor(wordCount / 250) + 1;
var readingTimeAsString = readingTimeInMinutes + " dakika";
$('.reading-time').html(readingTimeAsString);
});
//]]>
</script>
Sonucun, sürenin gösterileceği alan (yazı bilgilerinin yer aldığı alana eklenebilir)
<span class="reading-time"></span>
Yukarıda görüldüğü gibi turuncu renkte belirtilmiş 2 alan var. Birincisi yani .entry-content yazı içeriğinin yer aldığı div'e ait class'ı belirtiyor. Bu class ya da id değişkenlik gösterebilir .post-body, .post-content, .entry-content gibi.(Tarayıcıların Öğeyi denetle özelliği kullanılarak kolayca bulunabilir.) İkinci belirgin alan .reading-time ise sürenin nerede, yani hangi elementte gösterilmesi gerektiğini belirtiyor.
comments powered by Disqus