Kategoriler
Blog

Blogger a otomatik devamını okuyun eklentisi

Hoşbulduk. Temayı Blogger versiyonuna çevirmek çok uğraştırıcı oldu ve tamamen bitti de diyemem, istiyorum ki WordPress’i aratmasın hatta daha iyi olsun.

Temayı düzenlerken şu devamını okuyun olayına takıldım biraz, klasik devamını okuyun yöntemi style şablonu ile if else yöntemi ile yapılan ve yazı girişinde devamı olan kısım yani yazının tamamı olan yeri bir claass ile belirlemek gererkiyordu, yani dıdısının dıdısı.


Biz Wordperss de kolaya alışmışız ya, şimdi ben şu arkadaşın yönetmini çok beğendim, otomatik devamını okuyun olayı üstelik küçük resimleri de eklemesi tam süper bizim için çünkü WordPress'de de bizim öyleydi.

Çok basit;
İlk önce şu kodu temanın <head> </head> içine şu scripti koyuyorsunuz

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 550;
summary_img = 300;
img_thumb_height = 90;
img_thumb_width = 90;
</script>
<script src='https://wolkanca.com.tr/b/excerpt.js' type='text/javascript'/>

Daha sonra temada (tabii ‘Widget Şablonlarını Genişlet’ demek lazım) <data:post.body/> diye aratıyoruz ve onu silip yerine şunu ekliyoruz

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb("summary<data:post.id/>");
</script>
<div style='clear: both;'/>
<p class='devamini-oku'><a expr:href='data:post.url' rel='bookmark'>Devamını
okuyun!</a></p>
</b:if>
    Ve 5 ayrı ayarı var bunları kafanıza göre değiştirebilirsiniz

  • thumbnail_mode var = “float”; float değeri resmin sağ veya sola kaydırmak için, bunu css den sağını solunu ayarlayabilirsiniz.
  • summary_noimg = 230; Resim yoksa yazıda şu kadar özet karakter göstersin.
  • summary_img = 140; Resim varsa şu kadar özet karakter göstersin.
  • img_thumb_height = 100; Bu resmin yüksekliği (px cinsinden).
  • img_thumb_width = 100; Ve bu resmin genişliği.

Bu kadar.

excerpt.js i indirip herhangi bir yeere yükleyerek de çalıştırabilirsiniz veya öyle bir yeriniz yoksa temanızaşunu ekleyin;

<script type='text/javascript'>
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1)? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'"
width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
</script>

Görünüşe göre artık Php yok Javascript var bizim için, birbirlerine neredeyse tamamen benziyorlar gerçi sorun yok.

Bir sonraki yazımda şu lanet feedback nasıl yapılır yazacağım 🙂 lanet çünkü ben yabancılardan gördüm de yaptım bizimkiler de benden görüp yapıyor, yapamayan sürekli soruyor.

Blogger muhteşem bir şey.

F2 tuşu basılı kaldı 10 dakika onunla uğraştım, Müslüm Gürses – Hasret Rüzgarları diyorum ve gidiyorum.

WOLKANCA

Volkan Yılmaz

Digital Marketing & WordPress & SEO volkan@volkanyilmaz.com.tr