Thêm mô tả cho widget label của blogger

ới thủ thuật này đằng sau tên mỗi label sẽ xuất hiện một mô tả do amin của blog đặt. Thủ thuật này không thích hợp với kiểu label clouds mà chỉ thích hợp với label dạng danh sách. Các bạn có thể xem Demo bên dưới:

http://namkna-test.blogspot.com/2013/02/demo-them-o-ta-cho-nhan.html

Đây là hình minh họa của thủ thuật.

Bước 1: Thêm một tiện ích Label

Bạn có thể bỏ qua bước này nếu trong blog của bạn đã có label

1- Đăng nhập vào blog

2- Chọn Bố cục (Layout)

3- Chọn Thêm tiện ích (Add widget)

4- Chọn Nhãn (Label).

5- Tùy chọn cấu hình như hình dưới. (Nhớ chọn dạng hiển thị Danh sách)

6- Bấm lưu lại:

Bước 2: Tùy biến label

1- Vào Mẫu (Template)

2- Chọn chỉnh sửa HTML (Edit HTML)

3- Tìm đoạn mã dạng như sau:

<b:widget id='Label5' locked='false' title='Nhãn' type='Label'/>

Trong trường hợp bài viết này đây là Label5 blog của bạn có thể là Label1, Label2, Label3,...., nếu label khác thì đoạn nền màu cam phía sau bạn cũng phải đổi lại cho đúng lablel nha.

- Thay thế nó thành đoạn code bên dưới:

<b:widget id='Label5' locked='false' title='Nhãn' type='Label'>
<b:includable id='main'>
  <b:if cond='data:title'>
    <h2><data:title/></h2>
  </b:if>
  <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
    <b:if cond='data:display == &quot;list&quot;'>
      <ul>
      <b:loop values='data:labels' var='label'>
        <li>
          <b:if cond='data:blog.url == data:label.url'>
            <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
          <b:else/>
            <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
          </b:if>
          <b:if cond='data:showFreqNumbers'>
            <span dir='ltr'>(<data:label.count/>)</span>
          </b:if>
<!-- Label Description Start -->
<b:if cond='data:label.name == "Tên nhãn 1"'>
<span class="labeldesc"> - Đây là mô tả nhãn 1</span>
</b:if>
<b:if cond='data:label.name == "Tên nhãn 2"'>
<span class="labeldesc"> - Đây là mô tả nhãn 2</span>
</b:if>
<b:if cond='data:label.name == "Tên nhãn 3"'>
<span class="labeldesc"> - Đây là mô tả nhãn 3</span>
</b:if>
<!-- Label Description End-->
        </li>
      </b:loop>
      </ul>
    <b:else/>
      <b:loop values='data:labels' var='label'>
        <span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
          <b:if cond='data:blog.url == data:label.url'>
            <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
          <b:else/>
            <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
          </b:if>
          <b:if cond='data:showFreqNumbers'>
            <span class='label-count' dir='ltr'>(<data:label.count/>)</span>
          </b:if>
        </span>
      </b:loop>
    </b:if>
    <b:include name='quickedit'/>
  </div>
</b:includable>
</b:widget>

Bước 3: Tùy chỉnh label

- Thay: Tên nhãn 1,2,3,..n thành tên nhãn blog của bạn.

- Thay: Đây là mô tả nhãn 1,2,3,...n thành mô tả tương ứng với mỗi nhãn.

- Để thêm một nhãn mới có mô tả bạn chỉ cần thêm đoạn mã sau vào trước dòng màu vàng:

<b:if cond='data:label.name == "Tên nhãn n"'>
<span class="labeldesc"> - Đây là mô tả nhãn n</span>
</b:if>

4- Lưu mẫu lại và xem kết quả.
Nguồn Terocket

Socializer Widget by Nguyen D. Khanh

SOCIALIZE IT →

Tweet

FOLLOW US →

SHARE IT →

Các bạn có thể tham khảo thêm nhiều kiến thức từ các bài viết mà mình đã SEO bằng các Từ khóa bên dưới bài đăng nầy để tìm hiểu thêm về các khái niệm và ứng dụng có liên quan nhé..