Blogger Son Yazılar Eklentisi

 

Blogger son yazılar eklentisi.  animasyonlu kayan üstüne gelinde dönme efekli olan, bu eklentiyle bloggunuza görsellik'de güzel görünüm kazandıra bilirsiniz. cok basit bir şekilde bloggunuza ekleyebilirsiniz. aşagıda göstercegim uygulamayı yapdıkdan sonra, kulanmaya başlayabilirsini.

 1 Adım :  Blogger  konturol paneli gidin.  Şablon kısmını seçerek Html düzenle diyoruz.   Ctrl F yardımı ile  açılan kod kutusuna </head> kodunu buluyoruz. buldugumuz </head> kodu öncesi aşagıda verdigim kodu  ekliyoruz. şablon kaydet diyip cıkıyoruz... 

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'></script>

2 Adım : Kumanda Paneli>Tasarım>GAdget Ekle>Html/Javascript yolunu izleyip aşşağıdaki kodu Kopyalayıp  açılan gadgetimizin içine yapıştırın.

  

<style type="text/css" media="screen">
<!--

/* ==Son Yayınlar Eklentisi  ==== */

#helperblogger-widget {
    overflow: hidden;
    margin-top: 5px;
    padding: 0px 0px;
    height: 385px;
}

#helperblogger-widget ul {
    width: 295px;
    overflow: hidden;
    list-style-type: none;
    padding: 0px 0px;
    margin: 0px 0px;
}

#helperblogger-widget li {
    width: 282px;
    padding: 5px 5px;
    margin: 0px 0px 5px 0px;
    list-style-type: none;
    float: none;
    height: 80px;
    overflow: hidden;
    background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj8j3SC2hObCir42GCmafMM5CILPY6acqpUIThSBCbP5hp3EgNmADG8OT-By4mxvSMk6ZGIe0FjDMlgBvbtIhLN4cggeA9EtklTvTHK75HqmH_q8E80lYcnDdtz8D3emGibg53_m-fzSo/s1600/helperblogger.com-post.jpg) repeat-x;
    border: 1px solid #ddd;
}

#helperblogger-widget li a {
    text-decoration: none;
    color: #4B545B;
    font-size: 15px;
    height: 18px;
    overflow: hidden;
    margin: 0px 0px;
    padding: 0px 0px 2px 0px;
}

#helperblogger-widget img {
    float: left;
    margin-top: 10px;
    margin-right: 15px;
    background: #EFEFEF;
    border: 0;
}

#helperblogger-widget img {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
    padding: 4px;
    background: #eee;
    background: -webkit-gradient(linear, left top, left bottom, from(#eee), color-stop(0.5, #ddd), color-stop(0.5, #c0c0c0), to(#aaa));
    background: -moz-linear-gradient(top, #eee, #ddd 50%, #c0c0c0 50%, #aaa);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 3px rgba(0,0,0,.7);
    -moz-box-shadow: 0 0 3px rgba(0,0,0,.7);
    box-shadow: 0 0 3px rgba(0,0,0,.7);
}

#helperblogger-widget img:hover {
    -moz-transform: scale(1.2) rotate(-350deg);
    -webkit-transform: scale(1.2) rotate(-350deg);
    -o-transform: scale(1.2) rotate(-350deg);
    -ms-transform: scale(1.2) rotate(-350deg);
    transform: scale(1.2) rotate(-350deg);
    -webkit-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);
    -moz-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);
    box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);
}

.spydate {
    overflow: hidden;
    font-size: 10px;
    color: #0284C2;
    padding: 2px 0px;
    margin: 1px 0px 0px 0px;
    height: 15px;
    font-family: Tahoma,Arial,verdana, sans-serif;
}

.spycomment {
    overflow: hidden;
    font-family: Tahoma,Arial,verdana, sans-serif;
    font-size: 10px;
    color: #262B2F;
    padding: 0px 0px;
    margin: 0px 0px;
}

/* === Son Yayınlar Eklentisi http://blogger-mimari.blogspot.com/ ==== */

-->
</style>

<script language='JavaScript'> 
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUaOIK0N4787HGe6NnSFDSe4SbCAGiyZir1W1cDlgyVT_LyJBfIldvNfeD4qdIXa-eVuH1HOGpoziV0E27pUChkcV8hBjcSN9RAwyWYcjbUNY_Yp1mCAQjgQaeyR0oTeGWNFabP4i_FgM/s1600/no-thumbnail.png";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUaOIK0N4787HGe6NnSFDSe4SbCAGiyZir1W1cDlgyVT_LyJBfIldvNfeD4qdIXa-eVuH1HOGpoziV0E27pUChkcV8hBjcSN9RAwyWYcjbUNY_Yp1mCAQjgQaeyR0oTeGWNFabP4i_FgM/s1600/no-thumbnail.png";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUaOIK0N4787HGe6NnSFDSe4SbCAGiyZir1W1cDlgyVT_LyJBfIldvNfeD4qdIXa-eVuH1HOGpoziV0E27pUChkcV8hBjcSN9RAwyWYcjbUNY_Yp1mCAQjgQaeyR0oTeGWNFabP4i_FgM/s1600/no-thumbnail.png";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUaOIK0N4787HGe6NnSFDSe4SbCAGiyZir1W1cDlgyVT_LyJBfIldvNfeD4qdIXa-eVuH1HOGpoziV0E27pUChkcV8hBjcSN9RAwyWYcjbUNY_Yp1mCAQjgQaeyR0oTeGWNFabP4i_FgM/s1600/no-thumbnail.png";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUaOIK0N4787HGe6NnSFDSe4SbCAGiyZir1W1cDlgyVT_LyJBfIldvNfeD4qdIXa-eVuH1HOGpoziV0E27pUChkcV8hBjcSN9RAwyWYcjbUNY_Yp1mCAQjgQaeyR0oTeGWNFabP4i_FgM/s1600/no-thumbnail.png";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 50;
thumbheight = 50;
fntsize = 15;
acolor = "#666";
aBold = true;
icon = " ";
text = "yorum";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://blogger-mimari.blogspot.com/";
limitspy=4;
intervalspy=4000;
</script>

<div id="helperblogger-widget">
<script src='http://code.helperblogger.com/recent-posts-spy.js' type='text/javascript'></script>
</div>

Kodlar İcersinde Degişebilceginiz Yerler Kırmızı İle Belirtdigim Yerleri Degişdirebilirsiniz.

• numposts = 10   Kactane mesaj sayısı göstermek istiyorsanız bunla ayarlayın. 
• limitspy = 4;       Mesaj Sayısı widget görünmesini bundan ayarlayabilirsiniz.
• intervalspy = 4000,  Widget Kaydırma hızı, bundan ayarlayabilirsiniz. 
• http://blogger-mimari.blogspot.com  Adresi yerine kendi adresinizi yazınız.

Demo görüntüsüne bakmak isterseniz burdan bakabilirsiniz.  DEMO