Với các blogger có quá nhiều nhãn thì việc kích hoạt (Displaying) tất cả các nhãn trong thanh bên (sidebar) không phải là một lựa chọn hoàn hảo vì nó sẽ mất quá nhiều diện tích của sidebar. Vậy giải pháp đặt ra là nên đặt tiện ích này ở đâu và làm thế nào để tiện ích này trong bắt mắt gọn nhẹ hơn mà vẫn đầy dủ các nhãn của bạn. Thủ thuật này namkna sẽ liệt kê tên các nhãn theo thứ tự bảng chữ cái và chia thành 5 cột đặt ở dưới chân trang blog (phần footer). cho độc giả đễ tìm kiếm các nhãn này.
Bạn có thể xem demo hoặc hình minh họa bên dưới:
VIEW DEMO
Thủ thuật này được namkna dựa trên ý tưởng của Ipietoon và Myherro . Bạn chỉ cần thực hiện một vài bước đơn giản để áp dụng tiện ích này cho blog.
» Thêm Like, Subscription box vào blogspot của bạn!
1. Đăng nhập vào tài khoản Blogger
2. Vào phần Mẫu (Template)
3. Chọn Chỉnh sửa HTML (Edit HTML)
4. Tìm kiếm thẻ ]]></b:skin> . Và dán code bên dưới vào trước thẻ vừa tìm được.
/*Start Category Wrapper Css*/ #category-wrapper { width:900px; clear:both; margin:0 auto 10px; padding-top:15px; line-height: 1.6em; text-align:left; border-bottom:0px solid #efefef; } .cat { color: #000000; line-height: 1.5em; } .cat ul { list-style:none; margin:0 0 0; padding:0 0 0 8px; } .cat ul li { float:left; width:18%; list-style-type: none; margin: 0 0 5px; padding-left: 12px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEik_pvam94RXH1m4UpmY6g2VRbJvOMqD53bCzo2W5UA5IYGR-cNyfnh_JdhvNGw6AELgYA5oQv2uNk2Fudf06oj1nzTl9PaSsji96bxw8UQ3Kj_G7Pm4cdZovrRXlt-nxHUpf3q0kM57bFf/s1600/bullet-suyb-namkna-blogspot-com-0001.gif) no-repeat left center; } .cat .widget { border-bottom:0px dotted #ddd; margin:0 .5em 1.5em .5em; padding:0 0 1.5em; } /* End Category Wrapper Css Info @ http://namkna.blogspot.com/ */
Tùy chỉnh CSS.
- Width 900px; là chiều rộng tổng của các cột.
- width:18%; chiều rộng của từng cột nhỏ. Ở đây mình dùng số tương đối. Nếu muốn chia thành 4 cột bạn sửa thành 23%, và để chia thành 3 cột sửa thành 31%.
- Link ảnh màu xanh là link ảnh icon trước mỗi nhãn. bạn có thể thay đổi thành link ảnh khác nếu bạn muốn,
5. Tìm mã HTML sau đây:
<div id='footer-wrapper'>
Lưu ý: thẻ bên dướicó thể khác nhau với mỗi blog, tùy vào người thiết kế) .nếu bạn không tìm thấy vui lòng comment địa chỉ blog của bạn ở cuối bài viết này mình sẽ hướng dẫn cụ thể
Với mẫu simple của blogger bạn có thể chèn ngay trước thẻ <footer> hoặc <div class='footer-outer'>.
- Dán đoạn mã bên dưới vào trước thẻ vừa tìm được.
<div id='category-wrapper'> <b:section class='cat' id='cat'> <b:widget id='Label99' locked='false' title='Categories' type='Label'/> </b:section> </div>6- Lưu mẫu lại và quay lại blog bạn sẽ tháy phần chân blog có 5 cột nhãn./
Nhận xét
Semo:
Trả lờiXóahttp://namkna-test.blogspot.com/2013/03/demo-chia-widget-label-o-footer-thanh.html
Bạn cho ra lò ngày càng nhiều thủ thuật mới ( thật tiếc là chưa có thời gian để thử). Sẽ rất có ích cho mọi người đó, cảm ơn sự công phu của bạn nhé!
Trả lờiXóaCảm ơn bạn! Mình sẽ cố gắng :))
XóaNam chỉ cho mình xin bài nào hướng dẫn phân nhãn thành các nhãn con (nôm na là như vậy). Ví như kiểu hiển thị bài viết này: Từ nhãn Blogspot Label », mình muốn có các nhãn con của nó kiểu như: Blogspot Widgets » ( trong này có các bài viết thuộc nội dung Blogspot Widgets) để cho nó gọn. Trên sidebar chỉ hiện nhãn Blogspot Label, có được không Nam?
Trả lờiXóaBlogger không hỗ trợ như vậy đâu bạn ak. Nó không có dạng nhãn mẹ nhãn con. Bạn muốn làm như thế thì chỉ có thể làm thủ công bằng tay cho từng nhãn thôi.
Xóabạn ơi mình không tìm thấy đoạn code trên bạn xem dùm mình nhé
Trả lờiXóahttp://gameonmobi.blogspot.com/
Bạn có thể chèn trước đoạn":
Xóa<div class="ads1" style="text-align:center;position: relative;">
anh ơi giúp em với @@ em ko tìm thấy đoạn code đó :(
Trả lờiXóaE có thể chèn trước đoạn":
Xóa<div id="footer">
anh ơi bên em chỉ có cái mã mà anh đưa em tìm ko có ,mà chỉ có cái ngoặc đơn ở 2 bên chữ footer thôi anh à chứ ko phải ngoặc kép như cái mà anh đưa ở 2 bên chữ footer :(,như thế này nè anh 'footer' chứ ko phải "footer" như anh đưa ,anh giúp em vs dk ko ạ :)
XóaTrong blog thì ngặc đơn hay ngoặc kép đều như nhau thôi. 'footer' chính là "footer" và ngược lại. Nó chỉ khác cách viết thôi. Ví dụ: SÚP và Muối viết khác nhau nhưng đều mặn :)
Xóavậy à ,tks bạn nhé :D
XóaNhận xét này đã bị quản trị viên blog xóa.
Trả lờiXóa