Nếu bạn là một người sử dụng Blogger lâu ngày, bạn sẽ thấy hầu hết các js hỗ trợ Auto Readmore hiện nay đều sử dụng css để căn chỉnh kích thước của ảnh thumbnail được hiện ở trang chủ, và điều này làm cho hình ảnh bị biến dạng. Qua nhiều thủ thuật trước đây mình chia sẻ về các thủ thuật với ảnh tải lên ở Blogger cũng như Picasa:
Cuối cùng mình đã tổng hợp cả thủ thuật trên và viết ra được một đoạn js hoàn chỉnh giúp resize và cắt ảnh đúng kích thước không làm biến dạng hình ảnh. Lần này không chỉ ra hình vuông nữa mà mọi kích thước bạn mong muốn.
Resize và cắt ảnh thumbnail đúng kích thước cho Blogger
Sử dụng đoạn js này rất đơn giản, bạn tim đến trước thẻ
</body> và thêm đoạn mã sau vào
<!--KslZone Auto Picasa Image Resize Script Started-->
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>//<![CDATA[
var _0x9d21=["\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x42\x79\x49\x64","\x69\x6D\x67","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x73\x42\x79\x54\x61\x67\x4E\x61\x6D\x65","\x6C\x65\x6E\x67\x74\x68","\x73\x72\x63","\x73\x31\x36\x30\x30","\x77","\x2D\x68","\x2D\x63","\x72\x65\x70\x6C\x61\x63\x65"];function resizeThumb(_0xb158x2,_0xb158x3,_0xb158x4){var _0xb158x5=document[_0x9d21[0]](_0xb158x2),_0xb158x6=_0xb158x5[_0x9d21[2]](_0x9d21[1]);for(var _0xb158x7=0;_0xb158x7<_0xb158x6[_0x9d21[3]];_0xb158x7++){_0xb158x6[_0xb158x7][_0x9d21[4]]=_0xb158x6[_0xb158x7][_0x9d21[4]][_0x9d21[9]](_0x9d21[5],_0x9d21[6]+_0xb158x3+_0x9d21[7]+_0xb158x4+_0x9d21[8]);} ;} ;
resizeThumb("Blog1",200,140);
//]]></script>
</b:if></b:if>
<!--KslZone Auto Picasa Image Resize Script Started-->
Thay thế
200 bằng chiều rộng và
140 thành chiều cao của ảnh thumbnail mà bạn mong muốn. Lưu lại template và kiểm thử!
Lời kết
Đoạn js này bạn có thể sử dụng được với hầu hết các
Blogger Template và
AutoReadmore, nếu bạn nào không sử dụng được đoạn js trên hãy để lại nhận xét phía dưới để được hỗ trợ.
Bạn có thể xem qua phiên bản khác cùng chức năng tại "
Resize và cắt ảnh nhiều thành phần của Blogger".
Belum ada tanggapan untuk "Resize và cắt ảnh thumbnail đúng kích thước cho Blogger"
Post a Comment