Memodifikasi Widget Popular Post Tampil Lebih Menarik

Memodifikasi Widget Popular Post Tampil Lebih Menarik - Seperti Biasa
Saya Akan membagikan Tutorial-Tutorial yang mungkin bermanfaat bagi anda
Setelah Kemarin Saya Share Artikel Berjudul MEMODIFIKASI BLOG AGAR SEO FRIENDLY
Sekarang saya akan share artikel berjudul Memodifikasi Widget Popular Post Tampil Lebih
Menarik  Mungkin dari sebagian anda sudah mulai bosan dengan Tampilan default dari popular
post yang ada di blog anda , Mungkin anda ingin membuatnya lebih menarik tapi tidak tau caranya
Berikut Tutorialnya

Langkah Penerapan : 

1. Cari Kode ]]></b:skin> Di dalam Template Blog Anda

2. Sekarang Masukan Kode Dibawah ini Tepat Diatas Kode Tersebut

 .PopularPosts .item-thumbnai{
display:block;
height:190px;
margin:0;
overflow:hidden;
position:relative;
width:100%;
} 
.PopularPosts .item-title {position:relative;} 
.PopularPosts img {display:block;
height:auto;
position:absolute;
width:100%;
}
.item-title a {
background:none;
color:transparent;
font-family:Oswald;
font-size:17px;
font-weight:400;
padding:10px 0;
padding-right:300px;
position:absolute;
right:0;
text-align:center;
top:0;
width:100%;
transition:all 0.2s ease-out;
}
.item-title a:hover {
background:#f97e76;
color:#fff;
padding-right:0;
}
.item-snippet {
background:none;
color:rgba(0,0,0,0.3);
font-weight:normal;
left:12%;
padding:10px;
position:absolute;
text-align:center;
top:95px;
width:70%;
transition:all 0.2s ease-out;
}
.item-snippet:hover {
background:#4f5a66;
color:#FFFFFF;
}
.item-content {
position:relative;
}

3. Sekarang Cari Kode </body> Di Template Anda

4. Sekarang Letakan Kode Dibawah Ini Diatas Kode Tersebut

 <script type='text/javascript'>
 $(document).ready(function() {$(&#39;.PopularPosts img&#39;).attr(&#39;src&#39;, function(i, src) {return src.replace( &#39;s72-c&#39;, &#39;s400&#39; );});});
</script>
    <script type='text/javascript'>
    //<![CDATA[
    // Popular Posts customization
    // Trim Code
    $('.popular-posts ul li .item-snippet').each(function(){
     var txt=$(this).text().substr(0,120);
      var j=txt.lastIndexOf(' ');
      if(j>10)
         $(this).text(txt.substr(0,j).replace(/[?,!\.-:;]*$/,'...'));
    });
    //]]>
    </script>