Code Tự Động Thêm Thuộc Tính Alt Và Title Cho blogspot ( SEO Hình Ảnh )

Tự động thêm ALT Và TITLE hình ảnh cho Blogspot

Hẳn là mọi người viết Blog thường up ảnh lên để tăng sinh động cho bài viết. Vậy việc SEO hình ảnh là một việc không thể xem thường bởi sự ảnh hưởng mạnh mẽ của nó đến việc tăng thứ hạng website của bạn. 

Alt là gì ? Có thêm Alt không?

Thuộc tính Alt là thay thế, có khả năng thay thế. Thuật ngữ này được sử dụng để đánh dấu và thể hiện các văn bản hoặc siêu văn bản mô tả thay thế cho một phần tử nào đó trên trang mà các con bot hoặc người dùng không thể đọc được nội dung cụ thể như các hình ảnh, các đoạn java script,…

Các bạn không nên bỏ thẻ ALT của ảnh khi viết  bài, việc đó sẽ làm hình ảnh sẽ được google đề xuất lên google tìm kiếm hình ảnh ( còn gọi là SEO hình ảnh) 

Việc thêm ALT và TITLE cho hình ảnh và việc này cũng có cách đơn giản hơn bằng việc sử dụng auto bằng đoạn Javascript đơn giản sau.

Bỏ đoạn Javascript vào trước thẻ </body>:

<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>
<script type='text/javascript'>
//<![CDATA[
var scrollTimer = null;
$(window).scroll(function() {
var viewportHeight = $(this).height(),
scrollbarHeight = viewportHeight / $(document).height() * viewportHeight,
progress = $(this).scrollTop() / ($(document).height() – viewportHeight),
distance = progress * (viewportHeight – scrollbarHeight) + scrollbarHeight / 2 – $('#scroll').height() / 2;
$('#scroll')
.css('top', distance)
.text(' (' + Math.round(progress * 100) + '%)')
.fadeIn(100);
if (scrollTimer !== null) {
clearTimeout(scrollTimer);
}
scrollTimer = setTimeout(function() {
$('#scroll').fadeOut();
}, 1500);
});
//]]>
</script>

Sau đó lưu mẫu lại và kiểm tra thành quả nhé.

Đoạn Javascript trên sẽ tự động thêm thẻ Alt và Title cho tất cả các hình ảnh trong Blog, kể cả những hình ảnh đã được post trước đó nhé.

 Chúc bạn thành công!