Tự động thêm thẻ Alt và Title cho ảnh trong blogspot

Thuộc tính ALT là gì?
Alt là viết tắt của alternative information là thông tin thay thế khi ảnh không hiển thị được cho người dùng. Thuộc tính alt nằm trong cấu trúc html của hình ảnh. Người dùng bình thường sẽ không thể nhìn thấy được. Tuy nhiên thuộc tính này là yếu tố quan trọng để google xếp loại trang web của bạn.
Thuộc tính Title image là gì?
Thuộc tính Title image viết tắt của additional information là thông tin bổ sung cho hình ảnh trong cấu trúc html.
Tự động thêm thẻ Alt và Title cho ảnh trong blogspot
Tóm gọn lại là Thẻ alt trong bài viết blogger thì không thể thiếu nếu bạn muốn nâng thứ hạng bài viết của mình trong công cụ tìm kiếm google. Hoặc khi kiểm tra lỗi HTML5 bạn sẽ thấy mắc lỗi này nếu hình ảnh của bạn thiếu 2 thuộc tính này.
Title khi ảnh bạn có die thì bạn đọc vẫn sẽ hiểu được nội dung bức ảnh trong bài viết đó.
Để tự động thêm thẻ Alt và Title bạn tìm đến thẻ đóng </body> sau đó dán đoạn code sau phía trên nó
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
$('img').each(function(){
var $img = $(this);
var filename = $img.attr('src')
$img.attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));
});
});
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
$('img').each(function(){
var $img = $(this);
var filename = $img.attr('src')
$img.attr('title', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));
});
});
//]]>
</script>
Giải thích thêm đoạn mã trên: 
Khi sử dụng code trên thì mỗi lần post bài và trong bài có nội dung là hình ảnh thì tự động code sẽ lấy url của đường dẫn ảnh làm thẻ alt và title tự động.
Ngoài ra tất cả các ảnh trên blog cũng có alt và title nha!
Nếu bạn chăm hơn khi viết bài hình ảnh trong bài bạn nên thêm thuộc tính như ảnh phía dưới.
Chúc bạn thành công!

Muốn giỏi, muốn thành công - chúng ta hãy học hỏi không ngừng hàng ngày.

3 Bình Luận