Hướng dẫn tạo thanh điều hướng cho Breadcrumbs Blogspot

Bản chất Breadcrumbs: thanh điều hướng là một sự định vị cho độc giả biết họ đang ở đâu trên trang của chúng ta (để cảm nhận rõ hơn chúng ta cùng xem hình minh họa nhé)

Thực ra, http://www.dacbietthuvi.net cũng không có ý định viết thủ thuật blog gì cả. Tuy nhiên, thấy khá nhiều bạn quan tâm và tìm kiếm thủ thuật này. Nên mạo muội chia sẻ cùng người dùng Blogger - Blogspot.

Thủ thuật Breadcrumbs for blogger - blogspot có gì đặc biệt? có bạn ạ. Bạn thử và xem đó là điểm nào nhé.

Bước 1: Đăng nhập Blogger.com, vào Design > Edit HTML, chọn Expand Widget Templates. Tìm đoạn code:

<b:includable id='post' var='post'>

Bước 2: Bạn chèn đoạn code sau đây ngay dưới đoạn code trên:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='Breadcrumbs'>You are here: &#187;  <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> 
         <b:loop values='data:posts' var='post'>
           <b:if cond='data:post.labels'> 
             <b:loop values='data:post.labels' var='label'> 
               <b:if cond='data:label.isLast == &quot;true&quot;'> &#187; 
                 <a expr:href='data:label.url' rel='tag'><data:label.name/></a> 
               </b:if> 
             </b:loop> 
             &#187; <span><data:post.title/></span> 
           </b:if> 
         </b:loop>
       </div>  
  </b:if>

Bước 3: Chưa vội lưu, bạn chèn đoạn code sau vào trước thẻ ]]></b:skin> 

#Breadcrumbs{margin-bottom:15px;padding:10px;background:#F1E1FF;border:1px solid #DCB5FF}

SAVE lại và tận hưởng, chúc bạn thành công!

Nguồn: Nguyễn Hải blOg