Blogger İçin Özel İlgili Mesajlar Eklentisi

Blogger yazılarınız altında istediğiniz gibi özelleştirebileceğiniz, nRelate, Linkwithin benzer yazılar, ilgili mesajlar benzeri Related Posts gadget eklentisi. Eklentinin en güzel özelliği hiçbir yere kayıt olmadan, dış sunuculardan yazı çekmeden kendi blog alt yapınızı kullanarak yazılarınızın altında istediğiniz ebatlarda resimlerinizi düzenleyip, alt yazı uzunluğunu kendinizin tasarlaması.

İlgili mesajlar eklenti özellikleri :

1. Hiçbir yere kayıt olmanıza gerek yok.
2. Herhangi bir marka ismini göstermeniz gerekmiyor. Tamamen özgürsünüz.
3. Blog ana sayfanızda Devamı Oku eklentinizi etkilememesi için yazı ana sayfanızda görülmez. ilgili yazı açıldığında mevcut yazı altında ilgili mesajlar görülür.
4. Blog ana sayfanızda yazınızın genişliğine göre resimler sığmıyorsa küçültün büyültün temanıza uyumlu hale getirin.
5. Resim altında mesaj ismini uzun veya kısa tutabilirsiniz.

İlgili mesajlar ile ilgili teknik özellikler :

1. ilgili mesajlar dinamik blog da çalışmaz.
2. Kategorize ettiğiniz etiketlerin gizlenmemiş açık olması gerekir.
3. Yazılarınızda mutlaka etiket olması gerekir. Etiket yoksa ilgili içerik görülmez.
4. Blogger resim galeriniz Google Plus fotoğraflarda yüklü olduğundan en iyi şekilde çalışmasına demektir.
4. Resim olmayan yazılarınız için bir resim linki ekleyebilirsiniz. Bu boşluğu eklediğiniz resim linki tamamlayacaktır.
5. Tüm veriler blog date bilgilerinizden alındığından hızlı ve blog’unuzu kasmaz.

İlgili mesajlar eklentisinin kullanılması :

1. İlgili mesajlar eklentisini iki şekilde de blogunuza ekleyebilirsiniz.
  1. Gadget olarak
  2. Şablon kodlarına ekleyerek

İlgili mesajlar eklentisinin blog’a eklenmesi :

1. Blog’unuzu önce yedekleyin.Kendinize güveniyor iseniz yedek almanıza gerek yok.
2. Gadget olarak ekle :
⇒ Blogger kumanda paneli → Yerleşim → Gadget ekle ⇒ Html/Javascrip gadget’ine ekleyin.
3. Şablon kodlarına ekle :
⇒ Blogger kumanda paneli → Şablon ⇒ Bu etiketi bulun </body> , CTRL+F ile aratın.
İlgili mesajlar kodu : Aşağıda verilen kodu kopyalayın, seçiminize bağlı olarak gadget veya şablon kodlarınıza ekleyin.
Ayrıca okuyun ⇒  Özel Kategori Widgetini Bloguna Ekle
<!-- BEGIN CODE IT PRETTY RELATED POSTS GALLERY CODE AG -->
<style>
.related-posts {
  width: 100%;
  margin: 2em 0;
  float: left;
}
 
.related-posts ul li {
  list-style: none;
  margin: 0 5px;
  float: left;
  text-align: center;
}
.related-posts h5 {
font-size: 1.1em;
}
</style>
<script src='//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
<script>
 
//<![CDATA[
$(document).ready(function() {
    
    
    
    //CODE OPTIONS
    
    
    var maxSearched = 500; 
    var minimum = 3; 
    var maximum = 4; 
    var imageSize = 125; 
    var roundImages = false; 
    var relatedTitle = true; 
    var labelInTitle = true;
    var relatedTitleText = "Bunlarda ilginizi çekebilir:"; 
    var defaultImage = ""; 
    var campaignTracking = true; 
    var campaignSource = "gallery"; 
    var campaignMedium = "postFooter"; 
    var campaignName = "relatedposts"; 
    var insertBefore = $('.post-footer'); 
    
    
    //END CODE OPTIONS - DO NOT EDIT BELOW THIS LINE
 
var labels=[];var label;var alternateLabel;var minposts=minimum-1;var postlabels=$(".post-labels a");if(postlabels.length===1){label=postlabels.text().trim()}else if(postlabels.length>1){$(postlabels).each(function(){labels.push($(this).text().trim())});label=labels[Math.floor(labels.length*Math.random())];var labelLocation=labels.indexOf(label);if(labelLocation===labels.length-1){alternateLabel=labels[labelLocation-1]}else{alternateLabel=labels[labelLocation+1]}}if(label!==undefined){var title=$(".entry-title").text().trim();var labelCount=0;var alternateLabelCount=0;var matches=[];var url=$('link[rel="alternate"][title*="Atom"]').eq(0).attr("href");$.ajax({url:url,data:{"max-results":maxSearched,alt:"json-in-script"},dataType:"jsonp",success:function(e){$.each(e.feed.entry,function(t,n){if(e.feed.entry[t].category!==undefined){var r=[];for(var i=0;i<e.feed.entry[t].category.length;i++){r.push(e.feed.entry[t].category[i].term)}if($.inArray(label,r)!==-1){labelCount++}if($.inArray(alternateLabel,r)!==-1){alternateLabelCount++}}});if(labelCount<=minposts&&alternateLabelCount>=minposts){label=alternateLabel}$.each(e.feed.entry,function(t,n){if(e.feed.entry[t].category!==undefined){var r=[];for(var i=0;i<e.feed.entry[t].category.length;i++){r.push(e.feed.entry[t].category[i].term)}if($.inArray(label,r)!==-1){var s=e.feed.entry[t].title.$t.trim();if(s!==title){var o;for(var u=0;u<e.feed.entry[t].link.length;u++){if(e.feed.entry[t].link[u].rel==="alternate"){o=e.feed.entry[t].link[u].href}}var a;if(e.feed.entry[t].media$thumbnail!==undefined){a=e.feed.entry[t].media$thumbnail.url.split(/s72-c/).join("s"+imageSize+"-c")}else{a=defaultImage}if(matches.length<maxSearched&&campaignTracking===false){matches.push('<li><a href="'+o+'"><img src="'+a+'" alt="'+s+'" nopin="nopin">'+s+"</a></li>")}else if(matches.length<maxSearched&&campaignTracking===true){matches.push('<li><a href="'+o+"?utm_source="+campaignSource+"&utm_medium="+campaignMedium+"&utm_campaign="+campaignName+'"><img src="'+a+'" alt="'+s+'" nopin="nopin">'+s+"</a></li>")}}}}});if(matches.length>=minimum){if(relatedTitle===true&&labelInTitle===true){insertBefore.before('<div class="related-posts"><h5>'+relatedTitleText+' <span class="related-term">'+label+"</span></h5><ul></ul></div>")}else if(relatedTitle===true&&labelInTitle===false){insertBefore.before('<div class="related-posts"><h5>'+relatedTitleText+"</h5><ul></ul></div>")}else{insertBefore.before('<div class="related-posts"><ul></ul></div>')}matches.sort(function(){return.5-Math.random()});for(var t=0;t<maximum;t++){$(".related-posts ul").append(matches[t])}}insertBefore.css("clear","both");$(".related-posts ul li").css("max-width",imageSize);$(".related-posts ul li img").css({"max-width":imageSize,height:imageSize});if(roundImages===true){$(".related-posts ul li img").css("border-radius","50%")}}})}
});
//]]>
</script>
<!-- END CODE IT PRETTY RELATED POSTS GALLERY CODE AG-->
4. Kod için açıklamalar :
→ var maxSearched = 500 : Mevcut her etiketiniz için 500 yazı görüntüler. Yazınız az ise değeri düşürebilirsiniz.
var minimum = 3 :  Yazınızdaki etiket içinde bulunan yazı sayısını gösterir. Aynı etikete sahip 3 ad yazınız varsa görülmeye başlar. Yazınız ve etiket sayınız az ise değeri düşürün.
var maximum = 4 : İlgili yazı altında görülecek resim ve açıklama sayısını gösterir. Tema genişliğine göre 5, 6 veya 3 olarak belirleyebilirsiniz.
 var imageSize = 125 : Resim ebatlarınızı, 125 px. değeri ile oynayarak ayarlayın.
5. Tüm ayarları ; //CODE OPTIONS kısmında özelleştirebilirsiniz.

↳↳NOT: Kodlama alt satırda  bir virgül dahi oynatırsanız kod çalışmayacaktır. !!