Tiện ích Bài đăng phổ biến (Popular Posts) rất quan trọng đối với blogspot, nó giúp gây sự chú ý của độc giả, giúp dễ tìm đọc những bài viết nổi bật nhất trong tuần, trong tháng hoặc toàn thời gian đồng thời tăng cường traffic cho blog của bạn.
Ngoài cách bố trí các bài viết phổ biến theo chiều nằm ngang, mình sẽ giúp các bạn một cách bố trí khác và có phần lạ lẫm, đó là ghép 2 tiện ích Popular Posts lại với nhau; theo đó sẽ tạo định dạng bài đầu tiên có ảnh đại diện và tiêu đề bài viết, các bài còn lại hiển thị danh sách tiêu đề bài viết, kết hợp thuộc tính title là đoạn trích dẫn bài viết (snippet). Định dạng này không thể thực hiện được trên một tiện ích Popular Posts riêng biệt, vì thế ý nghĩ ghép 2 tiện ích đã giúp mình thực hiện thành công thủ thuật này. Bạn có thể xem Demo trên trang chủ của Thủ thuật Blogger.
Nào, chúng ta cùng thực hiện như sau:
Bước 1. Đăng nhập Blogger, vào Design >> Edit HTML, chọn Expand Widget Templates. Tìm đến thẻ đóng </b:widget> của một tiện ích nào đó mà bạn muốn bố trí tiện ích này gần với nó, sau đó đặt sau thẻ đóng </b:widget> này bằng đoạn code bên dưới:
<b:widget id='PopularPosts101' locked='false' title='Bài xem nhiều' type='PopularPosts'>Chú ý dòng <g:plusone expr:href='data:post.href' size='small'/> là mình khuyến mãi thêm cái nút G+ trên tiêu đề bài viết đầu tiên, muốn nó hiện thì thêm đoạn code sau đây trước thẻ </body>.
<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><div class='PPcontent'>
<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' expr:title='data:post.snippet'><data:post.title/></a>
</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'><div class='item-thumbnail'><b:if cond='data:post.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><b:else/><img class='item-nothumb' expr:height='data:thumbnailSize' expr:width='data:thumbnailSize' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8Ie4LNqiDnBe2tGNeGIAc2ydA90d_UXFyerqvhqcm22fXI_YVJj9EyGfcsN74qHUiRNMdj5HrTVv3FVOKkQn07QIud3bn7YrAzP3vTjjtVf5vyAt1ZpadlmIjtkNGXg8noORvwtxYn74/s1600/no-image.png'/></b:if></div><div class='item-title'><a expr:href='data:post.href' expr:title='data:post.snippet'><data:post.title/></a> <g:plusone expr:href='data:post.href' size='small'/></div></div><div style='clear: both;'/></b:if></b:if></div></li>
</b:loop>
</ul>
</div>
</b:includable>
</b:widget>
<b:widget id='PopularPosts102' 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><div class='PPcontent'>
<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' expr:title='data:post.snippet'><data:post.title/></a>
</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'><div class='item-title'><a expr:href='data:post.href' expr:title='data:post.snippet'><data:post.title/></a></div></div><div style='clear: both;'/></b:if>
</b:if>
</div></li>
</b:loop>
</ul>
</div>
</b:includable>
</b:widget>
<script src='http://apis.google.com/js/plusone.js' type='text/javascript'></script>
Nếu không thích hàng khuyến mãi này thì bạn có thể xóa nó đi nhé. :51)
Bước 2. Đặt code CSS dưới đây vào trước dòng ]]></b:skin>.
#PopularPosts101 .popular-posts ul{list-style-type:none;margin:0;padding:0}Lưu Template.
#PopularPosts101 .widget-content ul li{margin;border-bottom:1px dotted #DDD}
#PopularPosts101 .item-thumbnail{padding-left:5px}
#PopularPosts101 .item-title{padding:18px}
#PopularPosts102 ul li a{color:#069;text-decoration:none;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgsoZ40q-aQ_HFAvE5LObdpMYEi6GDfGBYB-QsDKmbhusE9vr9lvPHF6rCmdpIYusmPU6xKtpa9sEGIhhU774TMuO6skLZ3DpUkC0dnDK7R3AD5WVDCGx3VaVkMG0gQGe5dUvtwFiiREA/s1600/arrow.gif) no-repeat left 5px;padding-left:20px;display:block;margin:0;float:left}
Bước 3. Vào Page Elements, chỉnh sửa tiện ích có tiêu đề Bài xem nhiều, hiển thị dạng All time, chọn image thumbnail, snippet và chỉ hiển thị 1 bài viết. Tiếp tục chỉnh sửa tiện ích có tiêu đề Bài đăng phổ biến, hiển thị dạng Last 7 days, chọn snippet (không chọn thumbnail) và cho hiển thị 5-7 bài viết. Làm như thế này để tránh trường hợp bài viết phổ biến thứ nhất có ảnh đại diện lặp lại ở danh mục các bài viết phổ biến không có ảnh đại diện do sử dụng đến 2 tiện ích Popular Posts.
Ngày nay, việc tạo ra một blog cho riêng mình là điều hết sức dễ dàng. Bạn chỉ tốn khoảng dăm đôi phút là đã sở hữu ngay một blog với đầy đủ chức năng nhờ vào dịch vụ của 
Kể từ khi 
Các bạn có thể thấy tại trang chủ của 
Nếu blogspot của bạn đã có một số tác giả tham gia viết bài cộng tác viên thì tiện ích Team Blog Profile rất cần thiết vì nó cho độc giả biết rằng blogspot của bạn đang có chương trình cộng tác viên, đồng thời cũng giúp tạo sự trân trọng đối với các tác giả. Để làm như vậy, thông thường chúng ta sẽ thêm vào tiện ích Profile (Hồ sơ). Cấu trúc XML của tiện ích này như sau:
Cấu trúc một bài viết trên blogspot bao gồm tập hợp các lớp (class) và ID khác nhau và một khi chúng ta tạo các thuộc tính CSS cho các lớp và ID đó thì tất cả các bài viết trên blog đều có chung một định dạng. Vậy làm cách nào để có thể tùy biến CSS cho riêng từng (hoặc chỉ một số) bài viết vì trường hợp này cũng rất cần thiết cho một số tình huống khi bạn muốn tạo trang chuyên biệt có những định dạng khác biệt với những trang thông thường khác. Mấu chốt vấn đề là chúng ta cần tạo ID riêng cho mỗi bài viết, và một khi có ID riêng thì chúng ta có thể dễ dàng gán CSS riêng cho chúng.
Hầu như những bạn mới biết về blogspot (newbie) đều gặp khó khăn trong việc làm sao cho blog của mình load nhanh hơn. Mình cũng có một chút vốn liếng trong việc này nên mạn phép chia sẻ ở đây để các bạn mới có thể tích lũy thêm vài kinh nghiệm cỏn con trước khi tiếp tục dấn thân sâu vào con đường Blogspot.
Khi lướt xem một số blog được xây dựng trên nền tảng Wordpress, kéo xuống đáy trang hẳn bạn sẽ thấy các liên kết Next Post, Previous Post lần lượt hiển thị tiêu đề bài viết kế tiếp và bài viết trước (ví dụ ở trang 