Blogger Slayt Son Yazilar Eklentisi blogunuza eklemek için Yapmanız Gerekenler ;
- Blogger Hesabımızla Giriş Yapıyoruz
- Her ihtimale karşı şablonumuzun yedeğinialalım.
- Kumanda Paneli>Şablon>Htmlyi Düzenle>Devam Et yolunu takip ederekHTML kodlarımızın bulunduğu alana gelipwidget şablonlarını genişlet kutucuğunu işaretliyoruz.
- Html kodları içerisinde ]]></b:skin> kodunu aratıp bulun.
- Aşağıdaki kodu kopyalayıp bulduğunuz ]]></b:skin> kodundan önceki kısma yapıştırın.
#mas-terbaru{border:1px solid #585858;width:100%;margin:0 auto}
#terbaru{margin:0px}
.mas-elemen{border:1px solid #ccc;margin:5px 0;padding:5px;height:79px}
.mas-elemen img{background:#999;padding:4px;float:left;height:70px;margin-right:8px;width:70px}
.mas-elemen h6,.mas-elemen h6 a{font-size:12px!important;font-weight:700!important;margin:0;color:#111}
.mas-elemen:hover{background-color:#c3c3c3}
.mas-elemen p{font:14px PT Sans Narrow;text-align:justify;color:#555;line-height:14px;margin:5px 0}
#mas-loading{color:#888;font-family:Tahoma;font-size:100px;letter-spacing:-10px;text-align:center;text-shadow:-5px 0 1px #444;background:#141414 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzU1UO6JCuPLm7JicU1RIBT_DJvYCEZ6aCnP-0HLJSNsABbp3ka7l1MsY3JPyb0jDUD-EDE5_d854foHp3NsI_3_dWB1JIzm7enxNULfAy1WtgOg_cPWprINfvVkIbXupwKPJCjcZrVv8/s1600/loading.gif) no-repeat 50% 50%;height:470px;border:1px solid #c3c3c3}
#mas-navigasifeed{border:1px solid #c3c3c3;color:#bbb;font-family:Verdana;font-size:12px;text-align:center;margin:0px}
#mas-navigasifeed:hover{background-color:#c3c3c3}
#mas-navigasifeed a{color:#141414!important;font-family:Tahoma!important;font-size:12px!important;font-weight:400!important;display:block;padding:5px 10px}
#mas-navigasifeed span{padding:5px 10px}
#mas-navigasifeed .next{float:right}
#mas-navigasifeed .previous{float:left}
#mas-navigasifeed .home{text-align:center}
#mas-navigasifeed a:hover,#mas-navigasifeed span.noactived{color:transparant!important}
burada koyu mavi renkle verdiğimiz değerler
blogger son yazılar eklentisi içerisinde görünecek yazılarınıza ait küçük resmin boyutlarını belirtir, isterseniz değiştirebilirsiniz.
6. Yine
HTML kodları içerisnde kodunu aratıp buluyoruz.Aşağıdaki kodu kopyalayıp bulduğumuz kodundan önceki kısma yapıştırıyoruz.
<script type='text/javascript'>
//<![CDATA[
var numfeed = 5;
var startfeed = 0;
var urlblog = "http://blogokulu.org";
var charac = 100;
var urlprevious, urlnext;
function maskolisfeed(johny,banget){
var showfeed = johny.split("<");
for(var i=0;i<showfeed.length;i++){
if(showfeed[i].indexOf(">")!=-1){
showfeed[i] = showfeed[i].substring(showfeed[i].indexOf(">")+1,showfeed[i].length);
}
}
showfeed = showfeed.join("");
showfeed = showfeed.substring(0,banget-1);
return showfeed;
}
function showterbaru(json) {
var entry, posttitle, posturl, postimg, postcontent;
var showblogfeed = "";
urlprevious = "";
urlnext = "";
for (var k = 0; k < json.feed.link.length; k++) {
if (json.feed.link[k].rel == 'previous') {
urlprevious = json.feed.link[k].href;
}
if (json.feed.link[k].rel == 'next') {
urlnext = json.feed.link[k].href;
}
}
for (var i = 0; i < numfeed; i++) {
if (i == json.feed.entry.length) { break; }
entry = json.feed.entry[i];
posttitle = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
if ("content" in entry) {
postcontent = entry.content.$t;
} else if ("summary" in entry) {
postcontent = entry.summary.$t;
} else {
postcontent = "";
}
if ("media$thumbnail" in entry) {
postimg = entry.media$thumbnail.url;
} else {
postimg = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhveT29BiVSjz9XAjyBlHVW9d6WdxxqQ4zUboxiqppd_7qrHt9psuubNFIKenI6plxrpK8sSWOetvdZih0o-or5LHQJV5ycSdx5d_9jK3FseTN7TqtxOH242sxAFgRNvsQzmMyUyql52E73/d/noimagethumb.gif";
}
showblogfeed += "<div class='mas-elemen'>";
showblogfeed += "<a href='" + posturl + "' target='_blank'><img src='" + postimg + "' /></a>";
showblogfeed += "<h6><a href='" + posturl + "'>" + posttitle + "</a></h6>";
showblogfeed += "<p>" + maskolisfeed(postcontent,charac) + "...</p>";
showblogfeed += "</div>";
}
document.getElementById("terbaru").innerHTML = showblogfeed;
showblogfeed = "";
if(urlprevious) {
showblogfeed += "<a href='javascript:navigasifeed(-1);' class='previous'>◄ Önceki</a>";
} else {
showblogfeed += "<span class='noactived previous'>◄ Önceki</span>";
}
if(urlnext) {
showblogfeed += "<a href='javascript:navigasifeed(1);' class='next'>Sonraki ►</a>";
} else {
showblogfeed += "<span class='noactived next'>Sonraki ►</span>";
}
showblogfeed += "<a href='javascript:navigasifeed(0);' class='home'>Ana Sayfa</a>";
document.getElementById("mas-navigasifeed").innerHTML = showblogfeed;
}
function navigasifeed(url){
var p, parameter;
if(url==-1) {
p = urlprevious.indexOf("?");
parameter = urlprevious.substring(p);
} else if (url==1) {
p = urlnext.indexOf("?");
parameter = urlnext.substring(p);
} else {
parameter = "?start-index=1&max-results=" + numfeed + "&orderby=published&alt=json-in-script"
}
parameter += "&callback=showterbaru";
incluirscript(parameter);
}
function incluirscript(parameter) {
if(startfeed==1) {removerscript();}
document.getElementById("terbaru").innerHTML = "<div id='mas-loading'></div>";
document.getElementById("mas-navigasifeed").innerHTML = "";
var archievefeed = urlblog + "/feeds/posts/default"+ parameter;
var terbaru = document.createElement('script');
terbaru.setAttribute('type', 'text/javascript');
terbaru.setAttribute('src', archievefeed);
terbaru.setAttribute('id', 'MASLABEL');
document.getElementsByTagName('head')[0].appendChild(terbaru);
startfeed = 1;
}
function removerscript() {
var elemen = document.getElementById("MASLABEL");
var parent = elemen.parentNode;
parent.removeChild(elemen);
}
onload=function() { navigasifeed(0); }
//]]>
</script>
Kod içerisinde;
var numfeed = 5; Kutu içersinde görüntülenecek son yazı sayısı.
var urlblog = "http://blogokulu.org/"; Blogunuzun URL si.
var charac = 100; Küçük resimlerin yanında bulunan açıklamaların uzunluğu/karakter sayısı.
7.Kodları ekledikten sonra şablonumuzu kaydedip çıkıyoruz.
8.Son olarak Yerleşim>Gadget Ekle>Html/Javascript yolunu takip edip aşağıdaki kodu kopyalayıp açılan gadget içerisine ekliyoruz.
<div id="terbaru"></div>
<div id="mas-navigasifeed"></div>
