Tạo đánh giá năm sao tự động và hiển thị thumbail cho kết quả tìm kiếm trên Google

Khi tìm kiếm trên Google, chúng ta luôn ưu tiên cho những bài viết được hiện thị thumbail. Hôm nay, mình sẽ hướng dẫn các bạn cách hiện thị đánh giá 5 sao và hiển thị thumbail trên kết quả tìm kiếm của Google một cách tự động - Nghĩa là không có phần đánh giá(rating) nào xuất hiện trên bài blog của bạn hết, toàn bộ bài viết của bạn sẽ tự động có 5 sao.

DEMO

#Thêm CSS

1. Đăng nhập Blogger
2. > Mẫu > Chỉnh sửa HTML
3. > Tìm thẻ ]]></b:skin>
4. > Dán code dưới vào trên thẻ vừa tìm

/*hrecipe*/
.hrecipe{line-height: 1.7em;
font-size: 13px;
margin: 6px 0 0;
padding: 12px;
background: #f8f8f8;border: 1px solid #e2e2e2;
color: #333;
overflow: hidden;}
.deskripsi-artikel a, .hrecipe a{color:#f00;}

#Thêm HTML

1. > Tìm thẻ <div class='post-footer'> hoặc <div class='post-header'>

2. > Dán code dưới vào dưới thẻ vừa tìm

<div class='hrecipe'>
<img class='photo' expr:alt='data:post.title' expr:src='data:post.thumbnailUrl' style='float:left;margin-right:10px;'/>
<span class='item'>
    <span class='fn'><data:blog.title/></span><br/>
</span>
  <b>Thời gian:</b> <span class='published'><data:post.timestampISO8601/></span><br/>
  <b>Bài viết:</b><span class='summary'><data:post.title/></span><br/>
  <b>Rating:</b><span class='review hreview-aggregate'>
<span class='rating'>
  <span class='average'>5</span> trên
<span class='count'>22</span> lượt xem
</span>
</span>
</div>

#Kiểm tra kết quả

Truy cập Vào đây và kiểm tra kết quả tìm kiếm của blog của bạn trên Google. Lưu ý, để hiển thị thumbnail trên kết quả tìm kiếm của Google thì ảnh phải được đặt kích thước nhỏ như hình dưới