Làm Rich Snippets cho Breadcrumb trên Google với plugin WordPress Breadcrumb NavXT

Lâu rồi không kiểm tra email trên Google+. Hôm nay kiểm tra mail thì thấy có một bạn gửi email trên Google+ của mình hỏi về việc làm Breadcrumb xuất hiện trên Google search với plugin WordPress Breadcrumb NavXT.

Thật sự thì mình cũng không rành WordPress lắm và cũng ít khi nghiên cứu về WordPress. Tôi chỉ bắt đầu mò mẫm WordPress từ tháng 4/2011 khi bắt đầu làm blog với tên miền babywolfvn.com này. Tuy nhiên mình cũng đã dùng plugin Breadcrumb NavXT cho blog của mình và modify một số thứ cho phù hợp với Google.

Sẵn tiện có bạn hỏi mình thông qua Google+ nên tôi gửi bài lên đây chia sẽ cho những bạn muốn làm nhưng chưa biết cách làm. Nếu bạn nào rành WordPress và có cách nào hay hơn thì vui lòng chia sẽ bằng việc comment bên dưới.

Hôm trước, mình cũng đã có một bài giới thiệu về việc cách tạo Breadcrumb cho website theo cấu trúc Rich Snippets của Google. Nhìn chung mục đích chính là bạn chỉ cần tạo ra mã HTML theo đúng chuẩn thì sẽ làm được. Các bạn có thể xem bài viết đó tại đây: Tối ưu breadcrumb giúp Google hiểu cấu trúc website tốt hơn.

Bước 1: Bạn cần cài đặt plugin Breadcrumb NavXT cho WordPress.

Bước 2: Bạn mở file breadcrumb_navxt_class.php trong wp-content/plugins/breadcrumb-navxt để chỉnh sửa một số thứ như sau:

  1. Trong function assemble thêm </span> trước </a>.
  2. Trong function post_terms thêm </span> trước </a>.

Bước 3: Bạn vào Settings > Breadcrumb NavXT chỉnh sửa một số thứ sau:

1. Tab Posts & Pages:

1.1 Post Template: 

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" title="Go to %title%." href="%link%"><span itemprop="title">%htitle%</span></a></div>

1.2 Page Template

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" title="Go to %title%." href="%link%"><span itemprop="title">%htitle%</span></a></div>

2. Categories: Categories Template

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" title="Go to the %title% category archives." href="%link%"><span itemprop="title">%htitle%</span></a></div>

3. Tags: Tag Template

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" title="Go to the %title% tag archives." href="%link%"><span itemprop="title">%htitle%</span></a></div>

4. Picture Tag: Picture tag Template

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" title="Go to the %title% Picture Tag archives." href="%link%"><span itemprop="title">%htitle%</span></a></div>

5. Date Archives: Date Template

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" title="Go to the %title% archives." href="%link%"><span itemprop="title">%htitle%</span></a></div>

6. Mecellanous: Search Template

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" title="Go to the first page of search results for %title%." href="%link%"><span itemprop="title">%htitle%</span></a></div>

Vì phải tự mò lại để làm hướng dẫn trên, có thể có sai sót, các bạn làm thử nếu không được thì comment lại đây cho mình biết nhé.

Ngoài ra, trên blog của Thành Nhọ cũng có một bài hướng dẫn tạo Breadcrumb cho WordPress bằng một cách khác. Các bạn có thể tham khảo theo bài viết dưới đây:

Tạo Breadcrumb cho WordPress theo chuẩn của Google

Leave a comment ?

10 Comments.

  1. bạn ơi mình đã làm theo hướng dẫn thay đổi theo cách trên nhưng không được, bạn có thể hướng dẫn mình được chứ. Hiện tại mình dùng bản Breadcrumb 4.0.2, nick online của mình duytoi86. rất mong hồi âm

  2. Mình làm theo bạn nhưng check trong google webmaste thì nó vẫn không nhận, giúp mình với
    Yahoo : thuan_90_bkpro

  3. Giờ có thể dùng RDFa Breadcrumb rất tiện lợi không cần phải chỉnh sửa gì nữa rồi

  4. Không dùng cái này có ảnh hưởng đến SEO nhiều không bác? Em chỉ quan tâm điều đó thôi.

  5. Em làm bước 2 mà không biết sửa phần đó. anh chụp hình lại chỗ cần sửa dùm em được không ạ 🙁

  6. cái plugin này hiện giờ có áp dung được nữa ko bạn ơi

Leave a Comment


NOTE - You can use these HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>