Tạo thanh điều hướng cho blogspot mới nhất | CAMNANGBLOG.COM | HƯỚNG DẪN BLOGSPOT Từ A-Z

Tạo thanh điều hướng cho blogspot mới nhất

Tạo thanh điều hướng cho blogspot blogger - Cách SEO blogspot hay nhất bạn nên xem.

Tạo thanh điều hướng cho blogspot mới nhất

Các bạn thường thấy trên mỗi website thường sẽ có một thanh điều hướng, gọi là thanh breadcumb. Tác dụng của nó là giúp cho khách và công cụ tìm kiếm dễ dàng kiểm soát được vị trí nội dung hiện tại, từ đó sẽ đánh giá cao hơn về chất lượng website/blog của bạn. 

Tao thanh dieu huong cho blogspot, namphongnet
Tạo thanh điều hướng cho blogspot

Các bước để tạo thanh điều hướng cho blogspot:

Bước 1:
Các bạn vào chỉnh sửa HTML và tìm đến đoạn code sau:
<b:includable id=’main’ var=’top’>  <!– posts –>  <div class=’blog-posts hfeed’>    <b:include data=’top’ name=’status-message’/>    <data:adStart/>

Sửa đoạn code trên thành:
<b:includable id=’main’ var=’top’>  <!– posts –>  <div class=’blog-posts hfeed’>  <!– disable default status message    <b:include data=’top’ name=’status-message’/>  default status message disabled –>    <b:include data=’posts’ name=’breadcrumb’/>    <data:adStart/>

Bước 2: Tìm đến dòng :

<b:includable id=’main’ var=’top’>

Và thêm đoạn code sau vào trên nó :

<b:includable id=’breadcrumb’ var=’posts’>  <b:if cond=’data:blog.homepageUrl == data:blog.url’>  <!– No breadcrumb on front page –>  <b:else/>    <b:if cond=’data:blog.pageType == &quot;item&quot;’>       <div class=’breadcrumbs’>         Browse &#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:else/>      <b:if cond=’data:blog.pageType == &quot;archive&quot;’>        <div class=’breadcrumbs’>          Browse &#187; <a expr:href=’data:blog.homepageUrl’>Home</a> &#187; Archives for <data:blog.pageName/>        </div>      <b:else/>        <b:if cond=’data:blog.pageType == &quot;index&quot;’>          <div class=’breadcrumbs’>          <b:if cond=’data:blog.pageName == &quot;&quot;’>            Browse &#187; <a expr:href=’data:blog.homepageUrl’>Home</a> &#187; All posts          <b:else/>            Browse &#187; <a expr:href=’data:blog.homepageUrl’>Home</a> &#187; Posts filed under <data:blog.pageName/>          </b:if>          </div>        </b:if>      </b:if>    </b:if>  </b:if></b:includable>

Bước 3: Tìm đến đoạn mã :  ]]></b:skin> 
Thêm vào trước nó đoạn code sau :

.breadcrumbs {padding:5px 5px 5px 0px;margin: 0px 0px 15px 0px;font-size:95%;line-height: 1.4em;border-bottom:3px double #e6e4e3;

Cuối cùng, nhấn lưu lại và xem thành quả nhé! 

>> Bạn đã có Template siêu đẹp cho Blog/ Web mình chưa? Xem ngay những template chuẩn SEO miễn phí mình chia sẻ tại: Template blogspot chuẩn SEO
Biên tập viên

Quản trị viên

Đăng nhận xét

Mới hơn Cũ hơn