Blogger Popüler Yayınlar Renkli Kutucuklar / Blogger Popular Posts - Blogger Arşivim - Blogger, Blogspot, Blogger Template, Blogger Widget

Blogger Popüler Yayınlar Renkli Kutucuklar / Blogger Popular Posts


Lütfen uygulamaya geçmeden önce mutlaka yedek alın.
1. Blogger kontrol panelinizdeyken sırasıyla " Yerleşim >> Popüler Yayınlar " Widget'ına tıklıyoruz ve blogumuza Popüler yayınlar Widget'ını eklemiş olduk.  Şimdi ise aşağıda ki görselde verilen ayarların aynını yaparak devam edelim;
2. Görselde ki herşeyi birebir aynı yaptıysak devam edip Aşağıda ki kodu <head> kodunu bulup üstüne ekleyin.
<link href='https://fonts.googleapis.com/css?family=Oswald:400,700' rel='stylesheet' type='text/css'/>
3. Şimdi  </body> kodunu bulun;
<script src='//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'/>
<script type='text/javascript'>
//<![CDATA[
$(".popular-posts img").attr("src",function(t,s){return s.replace("/w72-h72-p-k-no-nu/","/s350-c/")}),$(".popular-posts ul li .item-snippet").each(function(){var t=$(this).text().substr(0,60),s=t.lastIndexOf(" ");s>10&&$(this).text(t.substr(0,s).replace(/[?,!\.-:;]*$/,"..."))}),$(".popular-posts ul li .item-content a").each(function(){var t=$(this).text().substr(0,60),s=t.lastIndexOf(" ");s>=6&&$(this).text(t.substr(0,s).replace(/[?,!\.-:;]*$/,"..."))});
//]]>
</script>
4. Şimdi ise </head> kodunu bulun ve Aşağıda verilen kodu üstüne ekleyin.
<style type='text/css'>
.sidebar .PopularPosts ul{padding:0;margin:0;}.sidebar .PopularPosts .item-thumbnail a{clip:auto;display:block;height:auto;overflow:hidden;}.sidebar .PopularPosts .item-thumbnail{width:130px;height:130px;border-right:5px solid #fff;margin:0px 10px 0px 0px !important;position:relative;}.sidebar .PopularPosts .item-thumbnail img{position:relative;height:auto;width:100%;padding:0;}.sidebar .PopularPosts ul li{float:left;margin-bottom:5px;max-height:130px;min-width:250px;overflow:hidden;}.sidebar .PopularPosts ul li:first-child{background:#D9EDF7;}.sidebar .PopularPosts ul li:first-child + li{background:#F2DEDE;}.sidebar .PopularPosts ul li:first-child + li + li{background:#DFF0D8;}.sidebar .PopularPosts ul li:first-child + li + li + li{background:#FFEEBC;}.sidebar .PopularPosts ul li:first-child + li + li + li + li{background:#E0E0E0;}.sidebar .PopularPosts .item-title{font:13px &#39;Oswald&#39;, sans-serif;text-transform:uppercase;padding:10px 5px 10px;}.sidebar .PopularPosts .item-title a{color:#000;text-decoration:none;}.sidebar .PopularPosts .item-snippet{font:13px &quot;Times New Roman&quot;,Times,FreeSerif,serif;padding-right:5px;}.sidebar .PopularPosts .widget-content ul li{padding:0px 5px 0px 0px!important;}
</style>
5. Tüm adımları yaptıysanız kaydet butonuna basın ve işlemi bitirin.



Yazıyla alakalı etiketler;
blogger, blogspot, blog, eklenti, widget, gadget, eklenti, eklentiler, eklentileri, eklentisi
blogger eklenti, blogspot eklenti, blogger eklentisi,
blogger eklentileri, blogger eklentiler, blogger widget, blogger widgets, blogger gadget,


blogger 2015, blogger 2016, blogger eklenti indir, blogger kodu, blogger kodları,

Hiç yorum yok:

blogger (116) blogspot (19) ders (13) dersler (5) eklenti (30) free (1) gadget (2) hatasivecozumu (2) nedir (1) popular (20) popularposts (21) recent (1) recentposts (6) seo (2) sonsuz (1) SoraTech (1) tema (35) Teması (1) template (35) templates (1) theme (1) widget (50) yapimi (1)