Tăng độ phân giải ảnh thumbnail của blogger

Như các bạn đã biết thì ảnh thumbnail mặc định của blogger là 72x72 px. Do vậy nếu bạn tăng kích thước của ảnh thì ảnh sẽ sảy ra hiện tượng vỡ hạt nhìn rất mất thẩm mỹ cho trang của bạn. Bài viết này mình sẽ hướng dẫn các bạn cách để có thể tăng chất lượng của ảnh thumbnail cho một số tiện ích của blogger như Silder bloglist, Readmore không dùng Javascripts, Popularposst,....

 ¤ Bước 1. Thêm Featured Posts metro slider cho blogspot/ blogger!

1.1- Đăng nhập vào blog

1.2- Chọn Mẫu (Template)

1.3- Chọn chỉnh sủa HTML (Edit HTML)

1.4- Dán 1 trong 2 đoạn code sau trước thẻ </body> :

1.4.1. Đoạn code 1:

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

- Trong đó

• BlogList1 là Id của tiện ích bạn muốn thay đổi kích thước ảnh thumbnail. bạn có thể thay đổi bằng Id tiện ích khác ví dụ bài viết readmore không dùng javascripts là Blog1. Bài đăng phổ biến là Popularpost1.
• 150 là kích thước của ảnh thumbnail. Ở đây chiều rộng và chiều cao bằng nhau và cùng bằng 150x150 px.

1.4.2. Đoạn code số 2:

Như các bạn biết đoạn code trên lấy ảnh thumbnail có kích thước là 72x72 px do vậy hình ảnh to thường sẽ bị mờ để khắc phục bạn có thể dán đoạn code bên dưới vào trước thẻ </body>

<script type='text/javascript'>
//<![CDATA[
function replaceText(){if(!document.getElementById){return;}
bodyText = document.getElementById("BlogList1");
theText = bodyText.innerHTML;
theText = theText.replace(/s72-c\//gi, "");
bodyText.innerHTML = theText;
}replaceText();
//]]>
</script>

 Trong đó Bloglist1 là ID của tiện ích vừa thêm ở trên.

Để resite thêm ảnh ở một tiện ích khác ví dụ tiện ích Popularpost bạn có thể sửa đoạn code như sau:

<script type='text/javascript'>
//<![CDATA[
function replaceText(){if(!document.getElementById){return;}
bodyText = document.getElementById("BlogList1");
theText = bodyText.innerHTML;
theText = theText.replace(/s72-c\//gi, "");
bodyText.innerHTML = theText;
bodyText2 = document.getElementById("PopularPosts1");
theText2 = bodyText2.innerHTML;
theText2 = theText2.replace(/s72-c\//gi, "");
bodyText2.innerHTML = theText2;
}replaceText();
//]]>
</script>

Chúc các bạn thành công.