Thứ Ba, 22 tháng 4, 2014

Tạo đường dẫn cho bài viết trong blog

Tạo đường dẫn cho bài viết trong blog



Bước 1: Chỉnh sửa HTML
Vào Thiết kế > 
Chỉnh sửa HTML và check vào ô chọn Mở rộng tiện ích mẫu để hiển thị  XML-code mẫu Blog của bạn để tiến hành các bước tùy chỉnh mã tiện ích widget của mẫu.
Tìm đoạn mã dưới: 
<b:includable id='main' var='top'>

  <!-- posts -->

  <div class='blog-posts hfeed'>



    <b:include data='top' name='status-message'/>



    <data:adStart/>


Vô hiệu hóa code mặc định bằng thủ thuật thêm dấu ngoặc <!——>
bao quanh chúng như dưới. (Bạn cũng có thể xóa dòng code này, nhưng theo ý của tôi thì bạn vô hiệu hóa code đó bằng thủ thuật trên thì hay hơn để có thể theo dõi và gỡ lỗi trong trường hợp xấu). 

<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 -->

    <data:adStart/>

 Thêm dòng mã:
 <b:include data='posts' name='breadcrumb'/>
Vào dưới code đã được vô hiệu hóa như sau:

<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/>

Thêm đoạn code màu đỏ ở dưới vào trên <b:includable id='main' var='top'> như dưới: 

<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:includable id='main' var='top'>

Bước 2: Thêm CSS vào <b:skin>

Tìm đoạn mã ]]></b:skin> và thêm ngày trước nó đoạn mã code như dưới:

.breadcrumbs {

padding:5px 5px 5px 0px;

  margin: 0px 0px 15px 0px;

font-size:95%;

  line-height: 1.4em;

border-bottom:3px double #e6e4e3;

}
 ]]></b:skin> 


Cuối cùng bạn save và xem kết quả. Chúc các bạn thành công
Previous Post
Next Post

post written by:

0 nhận xét:

Hãy để lại nhận xét một cách văn minh nhé !!!