Trang Chủ
Ẩn/Hiện Widgets/Gadgets tại một trang bất kì trong blogspot
Thứ Tư, 13 tháng 8, 2014
Ẩn/Hiện Widgets/Gadgets tại một trang bất kì trong blogspot
Ẩn – Hiện Widgets trong Blogger -Blogspot
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
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
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
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
Chúng ta sẽ thấy Code của Widgets Popular Post 1 như sau:
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
| <b:widget id='PopularPosts1' locked='false' title='Bài đăng phổ biến' type='PopularPosts'> <b:includable id='main'> <b:if cond='data:title'><h2><data:title/></h2></b:if> <div class='widget-content popular-posts'> <ul> <b:loop values='data:posts' var='post'> <li> <b:if cond='data:showThumbnails == "false"'> <b:if cond='data:showSnippets == "false"'> <!-- (1) No snippet/thumbnail --> <a expr:href='data:post.href'><data:post.title/></a> <b:else/> <!-- (2) Show only snippets --> <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div> <div class='item-snippet'><data:post.snippet/></div> </b:if> <b:else/> <b:if cond='data:showSnippets == "false"'> <!-- (3) Show only thumbnails --> <div class='item-thumbnail-only'> <b:if cond='data:post.thumbnail'> <div class='item-thumbnail'> <a expr:href='data:post.href' target='_blank'> <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/> </a> </div> </b:if> <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div> </div> <div style='clear: both;'/> <b:else/> <!-- (4) Show snippets and thumbnails --> <div class='item-content'> <b:if cond='data:post.thumbnail'> <div class='item-thumbnail'> <a expr:href='data:post.href' target='_blank'> <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/> </a> </div> </b:if> <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div> <div class='item-snippet'><data:post.snippet/></div> </div> <div style='clear: both;'/> </b:if> </b:if> </li> </b:loop> </ul> <b:include name='quickedit'/> </div></b:includable> </b:widget> |
Bước 5: Tùy chỉnh Ẩn – Hiện Widgets/Gadgets trong một trang hoặc một post bất kì
Để Widgets/Gadgets chỉ hiện ở trang chủ các bạn sẽ chỉnh sửa code như sau:
<b:widget id=’PopularPosts1′ locked=’false’ title=’Bài đăng phổ biến’ type=’PopularPosts’>
<b:includable id=’main’><b:if cond=’data:blog.url == data:blog.homepageUrl’>
<b:if cond=’data:title’><h2><data:title/></h2></b:if>
<div class=’widget-content popular-posts’>
<b:include name=’quickedit’/>
</div>
</b:includable>
</b:widget>
Hoặc:
<b:widget id=’PopularPosts1′ locked=’false’ title=’Bài đăng phổ biến’ type=’PopularPosts’>
<b:includable id=’main’><b:if cond=’data:blog.pageType == “index”‘>
<b:if cond=’data:title’><h2><data:title/></h2></b:if>
<div class=’widget-content popular-posts’>
<b:include name=’quickedit’/>
</div>
</b:includable>
</b:widget>
Chỉ hiển thị Widgets tại trang xem bài viết
<b:widget id=’PopularPosts1′ locked=’false’ title=’Bài đăng phổ biến’ type=’PopularPosts’>
<b:includable id=’main’><b:if cond=’data:blog.pageType == “index”‘>
<b:if cond=’data:title’><h2><data:title/></h2></b:if>
<div class=’widget-content popular-posts’><b:include name=’quickedit’/>
</div>
</b:includable>
</b:widget>
Chỉ hiển thị Widgets tại một trang bất kì
<b:widget id=’PopularPosts1′ locked=’false’ title=’Bài đăng phổ biến’ type=’PopularPosts’>
<b:includable id=’main’><b:if cond=’data:blog.url == “URL of the page”‘>
<b:if cond=’data:title’><h2><data:title/></h2></b:if>
<div class=’widget-content popular-posts’><b:include name=’quickedit’/>
</div>
</b:includable>
</b:widget>
Thay thế URL of the page bằng url của trang, bài viết mà bạn muốn widget sẽ hiển thị
Chỉ hiển thị Widgets tại những trang tĩnh – Static Page
<b:widget id=’PopularPosts1′ locked=’false’ title=’Bài đăng phổ biến’ type=’PopularPosts’>
<b:includable id=’main’><b:if cond=’data:blog.pageType == “static_page”‘>
<b:if cond=’data:title’><h2><data:title/></h2></b:if>
<div class=’widget-content popular-posts’><b:include name=’quickedit’/>
</div>
</b:includable>
</b:widget>
Ẩn Widgets tại trang tĩnh
<b:widget id=’PopularPosts1′ locked=’false’ title=’Bài đăng phổ biến’ type=’PopularPosts’>
<b:includable id=’main’><b:if cond=’data:blog.pageType != “static_page”‘>
<b:if cond=’data:title’><h2><data:title/></h2></b:if>
<div class=’widget-content popular-posts’><b:include name=’quickedit’/>
</div>
</b:includable>
</b:widget>
Ẩn Widgets tại một kiểu trang đặc biệt, ngoài loại trang đó các trang còn lại Widgets sẽ được hiển thị
<b:widget id=’PopularPosts1′ locked=’false’ title=’Bài đăng phổ biến’ type=’PopularPosts’>
<b:includable id=’main’><b:if cond=’data:blog.pageType != “index”‘>
<b:if cond=’data:title’><h2><data:title/></h2></b:if>
<div class=’widget-content popular-posts’><b:include name=’quickedit’/>
</div>
</b:includable>
</b:widget>
Thay index bằng các kiểu trang mà bạn muốn widgets ẩn đi (static_page, archive, item…)
Chỉ hiển thị Widgets tại trang lưu trữ
<b:widget id=’PopularPosts1′ locked=’false’ title=’Bài đăng phổ biến’ type=’PopularPosts’>
<b:includable id=’main’><b:if cond=’data:blog.pageType == “archive”‘>
<b:if cond=’data:title’><h2><data:title/></h2></b:if>
<div class=’widget-content popular-posts’><b:include name=’quickedit’/>
</div>
</b:includable>
</b:widget>
Trên đây là cách ẩn – hiện widgets tại một trang bất kì trong blogger – blogspot.
Do code quá dài nên ở phần sau mình thu gọn lại những phần không cần thiết để các bạn dễ theo dõi. Các bạn chỉ cần chú ý tới đoạn code được bôi màu đỏ và vị trí đặt đoạn code đó là đủ rồi. Hi vọng với thủ thuật nhỏ này các bạn sẽ có một giao diện blogger pro hơn.
Bài liên quan
