Hướng dẫn sử dụng Rich Snippets toàn tập

Thứ tư - 24/07/2013 05:12
Hướng dẫn sử dụng Rich Snippets toàn tập

Thảo theo yêu cầu tim hiểu về Rich Snippets của anh em.

Bài viết này tôi sẽ tổng hợp những  Rich Snippets phổ biến nhất

Công cụ Test Rich Snippets: http://www.google.com/webmasters/tools/richsnippets

Hướng dẫn:

- itemscope: Định nghĩa khối có tác dụng.
- itemtype: Khai báo cho Google biết định nghĩa và nhận dạng data cho thuộc tính itemprop.
- itemprop: Khai báo định dạng cấu trúc mà itemtype cung cấp

 

Nguồn: http://schema.org/docs/schemas.html và http://www.data-vocabulary.org

 

1. Rich Snippets xếp hạng, bình chọn, bỏ phiếu:

HTML:

<div itemscope itemtype=”http://schema.org/Recipe”>
    <span itemprop=”name”>Cộng đồng Google Việt Nam</span>
    <img itemprop=”image” src=”http://igoo.vn/Source/images/logo.png” alt=”Cộng đồng Google Việt Nam”>
    <div itemprop=”aggregateRating” itemscope=”" itemtype=”http://schema.org/AggregateRating”>
        <span itemprop=”ratingValue”>9</span>/<span itemprop=”bestRating”>10</span>
        <span itemprop=”ratingCount”>99</span> bình chọn
    </div>
</div>

Minh hoạ:

Hướng dẫn sử dụng rich snippets toàn tập

HTML:

 

<div itemscope itemtype=”http://schema.org/Recipe”>
    <span itemprop=”name”>Cộng đồng Google Việt Nam</span>
    <img itemprop=”image” src=”http://igoo.vn/Source/images/logo.png” alt=”Cộng đồng Google Việt Nam”>
    <div itemprop=”aggregateRating” itemscope=”" itemtype=”http://schema.org/AggregateRating”>
        <span itemprop=”ratingValue”>9</span>/<span itemprop=”bestRating”>10</span>
        <span itemprop=”reviewCount”>999</span> bài đánh giá
    </div>
</div>



Minh hoạ:

Hướng dẫn sử dụng rich snippets Google

HTML:
 

<div itemscope itemtype=”http://data-vocabulary.org/Recipe”>
<span itemprop=”name”>Cộng đồng Google Việt Nam</span>
    <img itemprop=”photo” src=”/images/logo.jpg” alt=”Cộng đồng Google Việt Nam” />
    <div itemprop=”review” itemscope itemtype=”http://data-vocabulary.org/Review-aggregate”>
        <span itemprop=”rating”>2</span>
        <span itemprop=”count”>10</span>
    </div>
</div>
Minh hoạ:
Hướng dẫn làm rich snippets chuẩn Google

HTML
 

<div itemscope itemtype=”http://data-vocabulary.org/Recipe”>
<span itemprop=”name”>Cộng đồng Google Việt Nam</span>
    <img itemprop=”photo” src=”/images/logo.jpg” alt=”Cộng đồng Google Việt Nam” />
    <div itemprop=”review” itemscope itemtype=”http://data-vocabulary.org/Review-aggregate”>
        <span itemprop=”rating”>2</span>
        <span itemprop=”votes”>15/span>
    </div>
</div>
Minh hoạ:
Hướng dẫn làm rich snippet chuẩn Google

2. Rich Snippets Breadcrumb link (navigation link):

HTML:
 
<ul itemscope itemtype=”http://data-vocabulary.org/Breadcrumb”>
    <li><a itemprop=”url” href=”/” title=”Trang chủ”><span itemprop=”title”>Trang chủ</span></a></li>
    <li itemscope itemtype=”http://data-vocabulary.org/Breadcrumb”><a itemprop=”url” href=”/trang1″ title=”Trang 1″><span itemprop=”title”>Trang 1</span></a></li>
    <li itemscope itemtype=”http://data-vocabulary.org/Breadcrumb”><a itemprop=”url” href=”/trang2″ title=”Trang 2″><span itemprop=”title”>Trang 2</span></a></li>
    <li itemscope itemtype=”http://data-vocabulary.org/Breadcrumb”><a itemprop=”url” href=”/trang3″ title=”Trang 3″><span itemprop=”title”>Trang 3</span></a></li>
</ul>
Minh hoạ:
Hướng dẫn làm Rich Snippet hiển thị trên Google

3. Xác nhận Google+ Pages với Website: [Video SEO]

4. Xác nhận tác giả bài viết bằng Google+:

Bạn chỉ cần thao tác 2 bước đơn giản để khai báo với Google là bài viết đó là của bạn.

B1: Copy thẻ <a> vào bài viết:
 
<a rel=”author” href=”https://plus.google.com/[ID Google+]?rel=author“>[Tác giả]</a>
ví dụ: <a rel=”author” href=”https://plus.google.com/116602647998496576269?rel=author”>Bình Nguyễn</a>

 
B2: Đăng nhập Google+ -> sửa tiểu sử của bạn -> thêm website của bạn vào mục Cộng tác viên để xác nhận bạn đang làm việc với Website
 
Hướng dẫn làm Rich Snippets Author chuẩn Google
 

Kết luận: Các  bạn chỉ cần nhìn và phân tích chút là oki vì nó cũng rất đơn giản.
 

Hướng dẫn làm Rich Snippets Google
 
Chúc các bạn thành công!
Thanks Bình Nguyễn – iGoo

Tổng số điểm của bài viết là: 25 trong 5 đánh giá

Xếp hạng: 5 - 5 phiếu bầu
Click để đánh giá bài viết

Những tin mới hơn

Những tin cũ hơn

Bạn đã không sử dụng Site, Bấm vào đây để duy trì trạng thái đăng nhập. Thời gian chờ: 60 giây