Hôm nay mình sẽ gửi đến các bạn một thủ thuật Blogger nhỏ nhỏ nhằm giúp các bạn có thể dễ dàng tùy chỉnh việc hiển thị bài viết theo nhãn ở trang chủ của Blog. Nói cách khác, đối với Blogger thì sau khi bạn publish một bài viết nào đó thì thường nó sẽ tự động hiển thị ra trang chủ ngay. Bây giờ chúng ta sẽ giả định rằng, bạn muốn xây dựng một static page ở trang chủ. Bạn chỉ muốn hiển thị những bài viết theo một nhãn nhất định nào đó mà thôi.
Ok, công việc không quá khó đâu. Chúng ta sẽ cùng làm theo hướng dẫn này nhé.
Hướng dẫn hiển thị bài viết theo nhãn ở trang chủ Blogger
*Lưu ý: Đoạn code hiển thị bài viết với những template khác nhau thì sẽ khác nhau. Vì thế nào bạn tìm được đoạn code không giống thì cũng đừng bất ngờ nhé. Cứ làm đúng theo hướng dẫn là Ok.
B1: Đăng nhập vào phần quản trị Blogger của bạn nhé.
B2: Lựa chọn phần chỉnh sửa HTML ở trong mục Template (Mẫu)
B3: Gõ Ctrl+F để tìm đoạn code sau:
<b:includable id=’main’ var=’top’>
Nhấp vào mũi tên màu đen nhỏ để mở rộng đoạn code đó ra nhé.
Sau khi bạn đã mở rộng đoạn code. Bạn sẽ nhìn thấy dòng code như sau:
<b:loop values=’data:posts’ var=’post’>
<b:include data=’post’ name=’post’/>
<b:if cond=’data:blog.pageType != "index"’>
<b:if cond=’data:post.showThreadedComments’>
<b:include data=’post’ name=’threaded_comments’/>
<b:else/>
<b:include data=’post’ name=’comments’/>
</b:if>
</b:if>
</b:loop>
Đoạn code này tùy theo từng template là khác nhau. Vì thế không nhất thiết phải giống như mình đâu nhé. Bạn chỉ cần quan tâm tìm được đúng đoạn mã bloop mở và đóng như mình đã bôi đỏ mà thôi. Code bên trong như nào thì không cần quan tâm lắm đâu.
B4: Giờ thì bạn thay thế toàn bộ đoạn code ở trên bằng đoạn mã sau:
<b:loop values=’data:posts’ var=’post’>
<b:if cond=’data:blog.url == data:blog.homepageUrl’>
<b:if cond=’data:post.labels’>
<b:loop values=’data:post.labels’ var=’label’>
<b:if cond=’data:label.name == “Show Label”‘>
<b:include data=’post’ name=’printPosts’/>
</b:if>
</b:loop>
</b:if>
<b:else/>
<b:include data=’post’ name=’printPosts’/>
</b:if>
</b:loop>
Lưu ý nhé: Vị trí “Show Label” bạn hãy thay bằng một nhãn nào đó mà bạn muốn hiển thị nó ra trang chủ.
B5: Giờ thì bạn tìm đến thẻ </b:includable> của thẻ <b:includable id=’main’ var=’top’> nhé. Thêm đoạn code sau vào NGAY SAU thẻ </b:includable> nhé.
<b:includable id=’printPosts’ var=’post’>
<b:if cond=’data:post.dateHeader’>
<h2 class=’date-header’>
<data:post.dateHeader/>
</h2>
</b:if>
<b:include data=’post’ name=’post’/>
<b:if cond=’data:blog.pageType == "static_page"’>
<b:include data=’post’ name=’comments’/>
</b:if>
<b:if cond=’data:blog.pageType == “item”‘>
<b:include data=’post’ name=’comments’/>
</b:if>
</b:includable>
B6: Giờ thì bạn hoàn toàn có thể SAVE lại và kiểm tra lại xem mọi thứ đã làm việc đúng theo ý bạn chưa.
Rất đơn giản phải không nào? Giờ thì bạn có thể tự mình tùy chỉnh trang chủ Blog của bạn theo ý của mình rồi.
Mọi thắc mắc vui lòng gửi comment hoặc Liên Hệ với mình để được giải đáp nhé.
Chúc các bạn thành công!