Tổng hợp top 10 Cách Tạo hiển thị xếp hạng 5 sao - Rich Snippets chuẩn HTML5 cho blogger website wordpress

A. MỤC ĐÍCH: Tạo hiển thị  xếp hạng 5 sao - Rich Snippets cho bài viết blogger website có ý nghĩa quan trọng để đánh giá của người đọc và hướng tới công cụ tìm kiếm google, yahoo hay bing... Ngoài ý nghĩa thăm dò ý kiến khán giả nó còn là giữ liệu để các bộ máy tìm kiếm đánh giá chất lượng của bài viết trong webstie hay blog mang lại trải nghiệm thú vị cho SEO website hay SEO blog dưới đây là hướng dẫn cách tạo hiển thị xếp hạng 5 sao - Rich Snippets cho blogger website .
Tạo hiển thị xếp hạng 5 sao - Rich Snippets cho blogger website
Tạo hiển thị xếp hạng 5 sao - Rich Snippets cho blogger website 

B. HƯỚNG DẪN CÁCH TẠO HIỂN THỊ XẾP HẠNG 5 SAO - RICH SNIPPETS 
HƯỚNG DẪN CÁCH TẠO HIỂN THỊ XẾP HẠNG 5 SAO - RICH SNIPPETS
HƯỚNG DẪN CÁCH TẠO HIỂN THỊ XẾP HẠNG 5 SAO - RICH SNIPPETS 
1. Cách 1: CÁCH THÔNG THƯỜNG CŨ Tạo hiển thị xếp hạng 5 sao - Rich Snippets
Đăng nhập blogger ~> Vào Mẫu ~> Chỉnh sửa HTML

Bước 1. Tạo Rich Snippets cho các trang ngoài trang bài viết
Chèn đoạn code này vào ngay sau thẻ <body>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div style='display:none;'>
<div itemscope='' itemtype='http://schema.org/Recipe'>
<span itemprop='name'>Blog thủ thuật</span>
<img alt='Blog thủ thuật' itemprop='image' src='https://lh4.googleusercontent.com/-pFkSZhwVbIc/AAAAAAAAAAI/AAAAAAAAAZs/U0sJ9pIjNKk/s150/photo.jpg' title='Blog thủ thuật'/>
<div itemprop='aggregateRating' itemscope='' itemtype='http://schema.org/AggregateRating'>
<span itemprop='ratingValue'>10</span>/<span itemprop='bestRating'>10</span>
<span itemprop='ratingCount'>1500</span> bình chọn
</div>
</div></div>
</b:if>

Thay link: xanh dương thành link ảnh đại diện cho blog của bạn,
Thay sửa chữ xanh lá lại cho phù hợp.

Bước 2. Tạo Rich Snippets cho các trang bài viết
Tìm đến thẻ bên dưới :
<div class='post-footer-line post-footer-line-1'>

Hoặc

<div class='post-footer-line post-footer-line-2'>

Sau đó chèn đoạn code này vào ngay sau nó:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='display:none;'>
<div itemscope='' itemtype='http://schema.org/Recipe'>
<span itemprop='name'><data:blog.pageName/></span>
<img expr:alt='data:blog.pageName' expr:src='data:blog.postImageThumbnailUrl' itemprop='image'/>
<div itemprop='aggregateRating' itemscope='' itemtype='http://schema.org/AggregateRating'>
<span itemprop='ratingValue'>10</span>/<span itemprop='bestRating'>10</span>
<span itemprop='ratingCount'>365</span> bình chọn
</div></div></div>
</b:if>

Lưu Mẫu lại là xong, để kiểm tra xem bạn đã thực hiện chèn Rich Snippets thành công chưa thì hãy truy cập vào kiểm tra:  tại đây hoặc tại đây     or đây  và nhập tên miền của bạn để xem thử.
Lưu ý: để hình ảnh của Snippet xuất hiện được trên tìm kiếm google các bạn phải chọn ảnh thumbnail (ảnh đầu bài viết) có kích thước hình vuông hoặc hình chữ nhật nằm ngang.

2. CÁCH 2: CÀI ĐẶT RICH SNIPPETS CHUẨN HTML5 CHO BLOGSPOT
Bước 1: - Vào Mẫu > Chỉnh sửa HTML
- Thêm đoạn code sau trên ]]></b:skin>
.hide{position:absolute;top:-9999px;left:-9999px}


Bước 2: - Chèn code sau dưới <body>
<b:if cond='data:blog.pageType != "item"'><br />
<br />
<div style='display:none;'>
<div itemscope='' itemtype='http://schema.org/Recipe'>
<span itemprop='name'>Blog giới trẻ-thủ thuật hay</span><br />
<br />
<img alt='blog giới trẻ' itemprop='image' src='https://lh3.googleusercontent.com/-DpJ-G25k-xk/VgenNLzFLII/AAAAAAAAEPM/N9kxME0HVjY/w426-h295/avatar.jpg' title='blog chia sẻ thủ thuật hay'/><br />
<br />
<div itemprop='aggregateRating' itemscope='' itemtype='http://schema.org/AggregateRating'>
<span itemprop='ratingValue'>9</span>/<span itemprop='bestRating'>10</span><br />
<br />
<span itemprop='ratingCount'>24</span> bình chọn<br />
<br />
</div>
</div>
</div>
</b:if>


 - Thay tiêu đề trang, hình ảnh của bạn.

Bước 3: Tiếp tục tìm đến thẻ
<div class='post-footer-line post-footer-line-1'>
Hoặc
<div class='post-footer-line post-footer-line-2'>
Hoặc
<div class='post-footer-line post-footer-line-3'>

- Chèn đoạn code sau dưới thẻ vừa tìm :
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='hide'>
<div itemscope='' itemtype='http://schema.org/Recipe'>
<span itemprop='name'><data:blog.pageName/></span>
<img expr:alt='data:blog.pageName' expr:src='data:blog.postImageThumbnailUrl' itemprop='image'/>
<div itemprop='aggregateRating' itemscope='' itemtype='http://schema.org/AggregateRating'>
<span itemprop='ratingValue'>8</span>/<span itemprop='bestRating'>10</span>
<span itemprop='ratingCount'>102</span> bình chọn
</div>
</div>
</div>
</b:if>

- Như vậy là bạn đã thêm thành công Rich Snippets cho blogspot rồi.
- Kiểm tra click và đợi 5s bỏ qua quảng cáo và kiểm tra:  tại đây hoặc tại đây     or đây 



3. CÁCH 3: Cài đặt google rich snippets trên blogger
Bước 1: Chèn mã sau thẻ < body >

<b:if cond='data:blog.pageType != "item"'><br />
<br />
<div style='display:none;'>
<div itemscope='' itemtype='http://schema.org/Recipe'>
<span itemprop='name'>Blog giới trẻ-thủ thuật hay</span><br />
<br />
<img alt='blog giới trẻ' itemprop='image' src='https://lh3.googleusercontent.com/-DpJ-G25k-xk/VgenNLzFLII/AAAAAAAAEPM/N9kxME0HVjY/w426-h295/avatar.jpg' title='blog chia sẻ thủ thuật hay'/><br />
<br />
<div itemprop='aggregateRating' itemscope='' itemtype='http://schema.org/AggregateRating'>
<span itemprop='ratingValue'>9</span>/<span itemprop='bestRating'>10</span><br />
<br />
<span itemprop='ratingCount'>24</span> bình chọn<br />
<br />
</div>
</div>
</div>
</b:if>


Các bạn sửa lại thông tin trên cho phù hợp với site nhé. Tuy nhiên việc chèn mã như vậy sẽ hiển thị cho trang chủ và toàn bộ các bài viết cùng tiêu đề và ảnh hiển thị.Khi bạn share lên mạng xã hội google+ tiêu đề và ảnh các trang sẽ trùng nhau .Do vậy các bạn cần thêm một đoạn mã  sau mỗi bài đăng bằng cách .

Bước 2: Tìm đến thẻ sau:
<div class='post-footer-line post-footer-line-1'>
<br />
Hoặc<br />
<br />
<div class='post-footer-line post-footer-line-2'>

Rồi paste đoạn mã vào dưới thẻ tìm được
<b:if cond='data:blog.pageType == "item"'><br />
<div style='display:none;'>
<div itemscope='' itemtype='http://schema.org/Recipe'>
<span itemprop='name'><data:blog.pageName/></span><br />
<img expr:alt='data:blog.pageName' expr:src='data:blog.postImageThumbnailUrl' itemprop='image'/><br />
<div itemprop='aggregateRating' itemscope='' itemtype='http://schema.org/AggregateRating'>
<span itemprop='ratingValue'>9</span>/<span itemprop='bestRating'>10</span><br />
<span itemprop='ratingCount'>356</span> bình chọn<br />
</div>
</div>
</div>
</b:if>

Cuối cùng các bạn cần kiểm tra tính năng google rich snippets đã cài đặt đúng cách trên blog của bạn chưa bằng cách truy cập link sau :
Tạo hiển thị xếp hạng 5 sao
Tạo hiển thị xếp hạng 5 sao

- Kiểm tra click và đợi 5s bỏ qua quảng cáo và kiểm tra:  tại đây hoặc tại đây     or đây 
Hoàn tất quá trình cài đặt có thông báo như trên là ok.

Tương tự check với từng bài đăng của bạn để kiểm tra nhé.Sau khi đã tích hợp được google snippets vào blog có thể mất một thời gian mới được hiển thị sao vàng trên kết quả tìm kiếm nhé !

C. VIDEO HƯỚNG DẪN CÁCH TẠO HIỂN THỊ XẾP HẠNG 5 SAO - RICH SNIPPETS 



D. KẾT LUẬN HƯỚNG DẪN CÁCH TẠO HIỂN THỊ XẾP HẠNG 5 SAO - RICH SNIPPETS  Các công cụ tìm kiếm : Google, Yahoo, Bing... Nó giúp bạn làm đẹp và tăng tỉ lệ click trên google và mang đến cho bạn một lượng traffic lớn rất lớn . Tuy nhiên Rich Snippets cũng có tác hại riêng  của nó, khi mà tình trạng phổ biến để lạm dụng nó ngày càng trở nên rầm rộ và phổ biến hơn. Các website tạo ra những kết quả tìm kiếm có 5 sao với số phiếu bầu chọn 1000, thậm chí là hàng triệu như vậy có đúng nghĩa là Rich Snippets mà Google khuyến khích hay không? Với những kết quả mà bạn cố tình tạo ra đã đang và sẽ đi ngược lại với những tiêu chí của của công cụ tìm kiếm Google và được gọi là “Fake Rich Snippets” hoặc “Spam in Rich Snippets”. Những hành vi vi phạm của bạn có thể bị người khác báo cáo qua Report spam in rich snippets. Hiện tại nó không còn được ưa truộng nhiều nhưng đây là một trải nghiệm thú vị.
Bài trước
Next Post »

VIDEO

[ Video ] [ pvid ]