Chỉ hiển thị widget khi xem bài viết một nhãn nhất định là cách giúp tạo sự khác biệt cho các bài viết thuộc một nhãn nào đó. Theo đó tiện í...

Hiển thị tiện ích khi xem bài viết thuộc nhãn nhất định

Chỉ hiển thị widget khi xem bài viết một nhãn nhất định là cách giúp tạo sự khác biệt cho các bài viết thuộc một nhãn nào đó. Theo đó tiện ích được chọn hiển thị sẽ mặc định được ẩn đi, khi nào vào xem các bài viết thuộc nhãn nào đó, nếu lệnh lặp nhãn tìm thấy nhãn đã chỉ định thì tiện ích sẽ được hiển thị.
Để thực hiện thủ thuật này, trước tiên bạn cần xác định ID của một tiện ích (widget) mà bạn muốn chỉ hiển thị khi xem các bài viết thuộc nhãn nào đó. Lấy ví dụ ở đây là một tiện ích có ID là HTML1.

Bước 1. Đăng nhập Blogger, vào Design >> Edit HTML, chọn Expand Widget Templates. Đặt đoạn code sau đây vào trước thẻ </head>:

<style type='text/css'>
#HTML1{display:none}
</style>

Bước tiếp theo, tìm đoạn code tương tự đoạn code sau đây:

<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span>

Rồi đổi nó thành thế này:

<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<script>var getLabel='<data:label.name/>';</script>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span>

Bước 2. Kế đến dùng từ khóa HTML1 tìm đến cấu trúc XML của tiện ích này rồi thêm vào thành như sau (phần được đánh dấu màu đỏ là phần thêm vào):

<b:widget id='HTML1' locked='false' title='Tên tiện ích' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
<script>
//<![CDATA[
// Code to display widgets on posts from a label by www.thuthuatblogger.info
if(getLabel=="Tên nhãn") {
document.getElementById("HTML1").style.display = "block";
}
//]]>
</script>
</b:if>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:includable>
</b:widget>