Code chỉnh sửa lỗi thumbnail và hình ảnh cho blogger - blogspot
Đầu tiên tìm hiểu về kích thước hình ảnh trong Blogspot :
Lấy ví dụ ta có link ảnh sau :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuNPBv1yKvABPJSui6LSiOxh6nczuJPBC9Z70cTZmWcdr9_qGLreEoNI-vnsooCJ4jfzmWmuxBZPqeJ2xSxCmzLktR_iWHXtPMOKfHFKusKMb0pkdK8WG4hkqWVJlVzgoYqnjhDMDV108/s72-c/go-ghep-thong-go-ghep-cao-su-go-ghep-tram.jpg
Chú ý đoạn bôi đỏ : "s72-c" là kích thước thumbnail mặc định vuông 72px.
- Chỉ cần thay "s72-c" thành "s500-c" thì sẽ có một thumbnail vuông khác kích thước 500px.
- Chỉ cần thay "s72-c" thành "s1600" thì sẽ có một thumbnail có kích thước mặc định.
- Lưu ý : Ký tự "-c" có nghĩa là thumbnail sẽ là ảnh hình vuông nếu bỏ "-c" như ví dụ thay "s72-c" thành "s1600" có nghĩa là ảnh thumbnail có chiều ngang 1600px
Sửa lỗi không hiện ảnh Thumbnail cho nhà mạng chặn :
<script type='text/javascript'>
//<![CDATA[
var images = document.getElementsByTagName("img");
for(var i=0;i<images.length;i++) {
images[i].src = images[i].src.replace(/[0-9]+.bp.blogspot.com/,"lh4.googleusercontent.com");
}
//]]>
</script>
Sửa lỗi Thumbnail trên trang chủ bị mờ :
Chỉnh sửa HTML và tìm đến đoạn code resize ảnh thumb đang bị lỗi trên template của bạn bằng cách tìm kiếm 1 trong các dòng code snippet_count hoặc thumbnail_resize. Sau khi tìm được đoạn code sẽ trông tương tự như bên dưới.
<script type='text/javascript'>
snippet_count = 150;
//<![CDATA[
function removeHtmlTag(n,e){if(-1!=n.indexOf("<")){for(var t=n.split("<"),i=0;i<t.length;i++)-1!=t[i].indexOf(">")&&(t[i]=t[i].substring(t[i].indexOf(">")+1,t[i].length));n=t.join("")}for(e=e<n.length-1?e:n.length-2;" "!=n.charAt(e-1)&&-1!=n.indexOf(" ",e);)e++;return n=n.substring(0,e-1),n+"..."}function createSnippet(n){var e=document.getElementById(n),t=snippet_count,i='<div class="snippets">'+removeHtmlTag(e.innerHTML,t)+"</div>";e.innerHTML=i}
function bp_thumbnail_resize(image_url,post_title)
{
var image_width=250;
var image_height=170;
image_tag='<img width="'+image_width+'" height="'+image_height+'" src="'+image_url.replace('/s72-c/','/w'+image_width+'-h'+image_height+'-c/')+'" alt="'+post_title.replace(/"/g,"")+'" title="'+post_title.replace(/"/g,"")+'"/>';
if(post_title!="") return image_tag; else return "";
}
//]]>
</script>
Chú ý đến /s72-c/ đây là chỗ Blogger đã update khiến đoạn code bị lỗi. Để khắc phục các bạn hãy thay thế nó thành /s72-c-k-no/
Code thay thay đổi kích thước hình giảm dung lượng trong blogger :
Dán đoạn code sau TRƯỚC thẻ <body>
<script type='text/javascript'>
$(document).ready(function() {$('.resizethumbnail').attr('src', function(i, src) {return src.replace( 's72-c', 's500-c' );});});
</script>
Thay thế kích thước hình 's72-c' thành 's500-c'
Tìm hiểu thêm thumbnail và hình ảnh blogspot bằng cách search các cụm từ khóa sau "Thay đổi kích thước ảnh thumbnail trong Blogspot không dùng Javascript ", "Tối ưu hình ảnh thumbnail trên trang chủ blogspot " , "Tăng độ phân giải ảnh thumbnail của blogger "
Nguồn : Tổng hợp
Ivietpr.com Blog Cá Nhân, Nền Tảng Blogger, Giao Diện Fletro : Xây dựng và phát triển nội dung, theo số liệu phân tích trên cấu trúc content của nhật ký trực tuyến digitalnomad.vn [ Blog Chạy Thử Nghiệm Đa Cấu Trúc ]