Home »

Ẩn/Hiện Widgets/Gadgets tại một trang bất kì trong blogspot

Thứ Năm, 27 tháng 2, 2014
☼Bây giờ là cách để tùy chỉnh Widget đó:

Theo mặc định thì các Widgets/Gadgets khi được thêm vào blogspot sẽ được hiển thị ở mọi trang và mọi bài viết. Tuy nhiên với thủ thuật nhỏ trong bài viết này việc ẩn hoặc hiện một widgets/gadgets bất kì tại một trang hoặc một post sẽ không phải là một điều quá khó khăn với các blogger nữa.
Trước tiên để đọc bài viết này các bạn nên tìm hiểu kĩ về các kiểu trang trong Blogger – Blogspot để giúp cho quá trình tùy biến được dễ hơn.

Bước 1: Thêm một Widgets/Gadgets bất kì trong Blogger –Blogspot

Các bạn truy cập vào trang quản lý của Blogger, chọn blog muốn thực hiện thủ thuật này và chọn Bố cục (Layout). Tiếp tục chọn Thêm tiện ích (Add Gadgets), một cửa sổ sẽ hiện ra cho phép các bạn lựa chọn các tiện ích để thêm vào blogger. Ở đây tôi chọn tiện ích bài đăng phổ biến (Popular Post). Để nguyên mặc định và nhấn lưu. Bây giờ tiện ích bài đăng phổ biến đã được thêm vào blog của bạn.


Thêm Widgets - Gadgets trong Blogger
Thêm Widgets – Gadgets trong Blogger

Bước 2: Truy cập vào phần tùy chỉnh mẫu giao diện bằng cách nhấn vào mẫu và chọn Chỉnh sửa HTML

Chỉnh sửa html Blogger Template
Chỉnh sửa html Blogger Template

Bước 3: Trong mục Chuyển tới tiện ích hãy chọn Popular Post 1 hoặc Widget mà bạn đã thêm trước đó.

Sửa Code HTML cho Blogger Widgets
Sửa Code HTML cho Blogger Widgets

Bước 4: Click vào mũi tên ở đầu dòng để mở Code của tiện ích đó.

Hiển thị code HTML của các Widgets trong Blogger - Blogspot
Hiển thị code HTML của các Widgets trong Blogger – Blogspot
5. Tìm đọan Widget id bạn muốn chỉnh (vd:HTML3)
Code thường có dạng mhư bên dưới
<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:includable>
</b:widget>

☼ Sau khi đã biết được "Widget" đó thì chúng ta sẽ tùy chỉnh hiển thị chúng
bây giờ bạn hãy chọn nơi để hiển thị "Widget" đó, bạn chỉ việc thêm code màu đỏ vào đúng vị trí như bên dưới

I. Chỉ cho phép widget hiển thị ở trang chủ
<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>

</b:if>

</b:includable>
</b:widget>

II. Chỉ cho phép widget hiển thị ở từng bài viết:
<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>

<b:if cond='data:blog.pageType == "item"'>

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>

</b:if>

</b:includable>
</b:widget>

III. Chỉ cho phép widget hiển thị ở những trang nhất định:
<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>

<b:if cond='data:blog.url == "Link của bạn"'>

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>

</b:if>

</b:includable>
</b:widget>

Bạn hãy thay code màu xanh trên thành đường link mà bạn muốn widget đó hiển thị (ví dụ:http://quyet223.blogspot.com/2013/11/zip-postal-code-ma-buu-chinh-64-tinh.html). Khi bạn chọn đường link như vậy thì khi bạn click đến link đó widget mới hiển thị, còn những đường dẫn khác widget đó sẽ không hiển thị

IV. Hiển thị ở trang label nhất định
<b:widget id='HTML4' locked='false' title='test 1' type='HTML'>
<b:includable id='main'>

<b:if cond='data:blog.url == "http://quyet223.blogspot.com/search/label/Advanced blogger"'>

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>

</b:if>

</b:includable>
</b:widget>

Bạn hãy thay dòng màu xanh (http://quyet223.blogspot.com/) thành địa chỉ blog của bạn và dòng (Advanced blogger) thành tên nhãn bài viết của bạn.

Chúc bạn thành công
Tags:

Comments[ 0 ]


Đăng nhận xét