Phân trang tự động tải thêm bài viết cho Blogger với Ajax Jquery

Như các bạn đã biết để cho website gọn gàng hơn người ta thường sử dụng nút xem thêm bài viết. Và hiện nay nhiều trang web đang sử dụng một dạng code tự động load nội dung khi chúng ta kéo đến 1 vị trí nhất định (Scroll to load more data) hoặc nó sẽ tự động load nội dung mà không cần load lại trang...bài viết sau đây sẽ hướng dẫn các bạn làm được điều đó. Nó sẽ giúp load nội dung dễ dàng hơn và tăng thời gian load trang của bạn hơn...
Với thủ thuật này khi thay vì sử dụng một tiện ích phân trang có các Button số để bấm thì nó sẽ hiển thị khi bạn bấm vào nút tải thêm bài viết. Điểm đặc biệt của phân trang này là nó sử dụng Ajax Jquery cho nên bài viết của bạn sẽ được tải thêm khi bấm vào nút tải thêm mà không cần phải tải lại trang web. Điểm đặc biệt khi áp dụng tiện ích này không hề phát sinh lỗi HTML 5 nên bạn có thể yên tâm áp dụng nó.

Phân trang tự động tải thêm bài viết cho Blogger với Ajax Jquery

» Thêm tiện ích Nút like với hiệu ứng ẩn hiện sau lá cờ trên sidebar cho blogspot

Chú ý nếu blogger các bạn đang sử dụng code để phân trang bài viết có dạng như sau thì xóa nó đi 

Để thêm nó vào blog bạn chỉ cần làm theo một số bước đơn giản sau:

1. Đăng nhập vào blog.

2. Chọn thẻ Bố cục (Layout).
3. Thêm đoạn code bên dưới vào trước thẻ đóng ]]>

 trong mẫu của bạn.

.button {text-align: center;border: 1px solid #055;box-shadow: 0 1px rgba(255,255,255,.2) inset;background: #066;color: #fff!important;text-decoration: none!important;cursor: pointer;padding: 5px 10px;}
.button a{color: #fff!important;font-weight:bold;}
.button.medium {padding: 5px 10px;font-size: 15px;}
.button:hover {border: 1px solid #222;background: #2c2a28;}

4. Dán đoạn code bên dưới vào trước thẻ đóng

(Bạn cũng có thể thêm bằng cách Chọn Thêm tiện ích => Tạo một tiện íchHTML/Javascripts ngay bên dưới phần bài đăng của bạn và dán đoạn code bên dưới vào).

» Tùy chỉnh code:

• Xóa đoạn code màu xanh nếu trong blog của bạn đã có thư viện Jquery. (Lưu ý giữ lại nếu nó là phiên bản vao hơn nha).
• Sửa lại đoạn mình tô màu đỏ cho phù hợp với trang web của bạn nha.
• Link ảnh màu tím chính là link ảnh loadding hiển thị khi bạn bấm vào tải thêm bài viết. Bạn có thể sửa thành link ảnh khác nếu muốn.

5. Lưu mẫu lại và quay trở lại trang blog của bạn để xem kết quả bạn đã thực hiện nha.