Làm nét ảnh thumbnail cho blogspot

[tintuc]

"Ảnh thumbnail" là một thuật ngữ được sử dụng để nói về những hình ảnh thu nhỏ hay ảnh đại diện cho mỗi bài đọc . Khi nhìn vào hình ảnh thumbnail, về cơ bản thì người đọc sẽ nắm được phần nào nội dung mà tác giả hướng tới.

Có rất nhiều nguyên nhân dẫn tới chất lượng ảnh thumbnail blogspot bị mờ. Tuy nhiên nguyên nhân chủ yếu là do chế độ cắt ảnh tự động của template blog ger, nó cắt ảnh với kích thước mặc định 72 x 72. Khi đó nếu kích thước hiển thị ảnh thumbnail thực tế trên blog của các bạn lớn hơn nó sẽ khiến ảnh kéo to ra, gây mờ ảnh.
Hôm nay mình sẽ Hướng dẫn mọi người cách khắc phục lỗi này, và làm nét ảnh thumbnail cho blogspot . Bằng phương pháp resize và cắt ảnh cho đúng với kích hước ảnh thực tế.

1. Vào Mẫu --> chỉnh sủa HTML và tìm thẻ
2. Copy code bên dưới dán vào vào trên thẻ tìm được.

<script type='text/javascript'>//<![CDATA[

$(document).ready(function() {

  var rong = 200;

  var cao = 150;

  $('#PopularPosts1, #Blog1, #related-posts').find('img').each(function(n, image){

    var image = $(image);

    image.attr({src : image.attr('src').replace(/s\B\d{2,4}/,'s' + rong + '-h' + cao +'-c')});

    image.attr('width',rong);

    image.attr('height',cao);

  });

});

//]]></script>

Trong đó:
rong = 200;
cao = 150;
Là kích thước ảnh được cắt cho hợp với kích thước thực tế. cái này bạn xem kích thước ảnh thức tế để điều trình kích thước cắt ảnh thumbnail cho hợp lý. Nếu không các bạn cứ để kích thước đều là 1600 nếu ảnh thumbnail là ảnh vuông.
#PopularPosts1, # theme blog 1, #related-posts là những Id đối tượng khu vực trên template blogspot mà bạn cần làm nét ảnh thumbnail. Nghĩa là những Id bao khu vực chứa mọi các ảnh cần làm nét ảnh thumbnail.
3. Xong khi chỉnh xong các bạn lưu mẫu và ra check xem ok chưa. nếu không được thì do 1 là Id bạn chọn nó chưa chứa ảnh, hoặc kích thước cắt ảnh vẫn bé hơn kích thước thực tế.

CHÚC CÁC BẠN THÀNH CÔNG!

[/tintuc]