Cara Besarkan Imej Pada Popular Post Widget

Cara Besarkan Imej Pada Popular Post Widget - Artikel ini adalah berkaitan cara nak enlarge atau besarkan imej atau gambar pada popular post widget. Saya telah banyak kali cuba dan gagal dan cuba lagi, iaitu proses yang dipanggil trial and error. Akhirnya menjadi pulak. Jika anda nak lihat, boleh klik pada demo blog saya di bawah.

DEMO BLOG

Baiklah. Tak nak banyak cerita, saya kongsikan set popular post widget dengan code yang boleh besarkan imej pada popular post anda.

Kod Popular Post Widget

1. Pergi Dashboard

2. Edit Template.

3. Letakkan kod seperti di bawah sebelum kod; ]]></b:skin>

.PopularPosts ul li a {font: 14px verdana; color: black;}
.PopularPosts .item-thumbnail {margin: 0 15px 0 0;}
.PopularPosts .item-title {padding-top:0px;padding-bottom:20px;}
.PopularPosts .item-thumbnail img
{background:#ccadc7;
height:155px; width:290px;
border:1px solid #fff;
padding:3px;
-moz-border-radius: 20px 0px 20px 0px;
-webkit-border-radius: 20px 0px 20px 0px;
border-radius: 20px 0px 20px 0px;
-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);}

4. Save Template.

Kod untuk besarkan atau enlarge imej pada popular post widget

Selepas selesai dengan kod di atas, letakkan pula kod berikut sebelum; </body>

<script type='text/javascript'>                
function changeThumbSize(id,size){
var blogGadget = document.getElementById(id);
var replacement = blogGadget.innerHTML;
blogGadget.innerHTML = replacement.replace(/s72-c/g,&quot;s&quot;+size+&quot;-c&quot;);
var thumbnails = blogGadget.getElementsByTagName(&quot;img&quot;);
for(var i=0;i&lt;thumbnails.length;i++){
thumbnails[i].width = size;
thumbnails[i].height = size;
}
}
changeThumbSize(&quot;PopularPosts1&quot;,310);                
</script>

Bermakna ada 2 kod yang perlu dimasukkan. Ikut arahan dengan betul, dan salin kod sepenuhnya. Insyaa Allah popular post widget anda akan menampilkan imej yang terang dan jelas. Tidak lagi blur atau samar seperti sebelum ini.

Selamat mencuba. Tiada masalah yang tidak boleh diselesaikan. Yang penting tidak mudah berputus asa. Orait!!

#sebarkan info jika berguna.

Read More ....