Thứ Năm, ngày 24 tháng 11 năm 2016

Share CODE Phân Trang Đánh Số Style Đẹp cho Blogger Blogspot

Hiện nay có rất nhiều bài viết chia sẻ CODE Phân Trang đánh số thứ tự cho Blogspot nhưng đa số đều không sử dụng được bởi những file javascript lưu trữ tại google drive đều không thể hoạt động. Chính vì thế mình đã tìm kiếm được bài viết này có thể sử dụng bình thường (Hiện tại đang dùng cho CODESEO.NET) nên các bạn có thể yên tâm dù cho file có hỏng thì mình vẫn thay lại cho các bạn được




Thêm CSS

1 Vào Blogger Dashboard > Template > Edit HTML
2 Click vào bất kỳ chỗ nào trong khung chỉnh sửa HTML > nhấn tổ hợp phím Ctrl + F để mở hộm tìm kiếm các câu lệnh
3Bạn tìm đến thẻ ]]></b:skin> và paste đoạn code style mà bạn muốn ngay TRƯỚC nó. Dưới đây là các style cho bạn lựa chọn.

Chọn style

Có rất nhiều style cho bạn lựa chọn, tùy theo giao diện blog của mình, bạn hãy chọn style cho phù hợp.

Style 1

Style 2

Style 3

Style 4

Style 5

Style 6

Style 7

Nếu bạn muốn ẩn đi “First” and “Last” thì thêm đoạn code sau vào ngay SAU code CSS của style mà bạn chọn ở trên.

Thêm script CSS

4 Tìm đến thẻ </body>  và dán đoạn code sau ngay TRƯỚC nó


<b:if cond="data:blog.pageType != &quot;item&quot;">
<b:if cond="data:blog.pageType != &quot;static_page&quot;">
<script type="text/javascript">
  /*<![CDATA[*/

    var perPage=7;
    var numPages=6;
    var firstText ='First';
    var lastText ='Last';
    var prevText ='« Previous';
    var nextText ='Next »';
    var urlactivepage=location.href;
    var home_page="/";

  /*]]>*/
</script>
<script src="https://thinot4work.github.io/files/page-navigation2.js"></script>
</b:if>
</b:if>

[Update] Nếu đường link  http://thinot4work....page-navigation2.js bị lỗi, bạn có thể download filepage-navigation2.js  thay thế ở link này. Lưu ý, sau khi download file này về máy rồi, bạn cần upload nó lên một trang host nào đó cho phép up file javascript, rồi bạn dẫn link mới đến file page-navigation2.js và thay thế link đã bị hỏng ở trên.

Tùy chỉnh

Trong đoạn code trên có một số chỗ bạn có thể chỉnh lại sao cho phù hợp với blog mình nhất:
  • perPage: có bao nhiêu bài viết sẽ được hiện ở trong mỗi trang, mặc định là 7. Bạn chỉnh lại sao cho phù hợp với số lượng bài viết mà bạn đã thiết lập trong Settings của blog mình.
  • numPages: số lượng trang sẽ hiện trên thanh navigation (ở blog của mình, mình chọn số 3 và kết quả hiện thị là 123..5)
  • Thay các chữ “First“, “Last“, “Previous“, “Next” bằng các từ mà bạn mong muốn. 
5 Sau đó nhấn Save template.

Labels fix

Bạn sẽ gặp lỗi nếu hiển thị theo dạng label (nhãn bài đăng) bởi vì mặc định blogger thiết lập 20 bài viết trong mỗi trang khi bạn tìm theo label. Chúng ta sẽ thiết lập con số này nhỏ lại sao cho phù hợp với con số mà bạn đã thiết lập ở perPage.
6 Tìm TẤT CẢ dòng code sau (nó ở nhiều vị trí)
7 Thay thế nó bằng dòng code sau
Ở đây bạn thay số 7 trong max-results=7 bằng con số mà bạn đã gán cho perPage ở trên.
8Save template lại và tận hưởng thành quả.
9 Mình quên hướng dẫn các bạn cách làm cho việc khi nhấn vào “nhãn” (label) trên thanh menu bạn tự tạo, thì nó cũng phân trang giống vậy.  Ví dụ ở đây nhãn bài đăng của mình là “LaTeX“, nó sẽ có đường link như sau
Bạn cần vào chỉnh sửa Template thêm vào NGAY SAU CUỐI của đường link này đoạn sau
Ở đây, cũng thay số 7 bằng con số bài đăng trên mỗi trang mà ở các bước trước bạn đã định. Blog của mình là 15. Tóm lại, link của nhãn LaTeX sau khi dán đoạn code trên vào hoàn chỉnh sẽ là
Bạn cũng áp dụng cho tất cả các nhãn khác của bạn. Bạn có thể xem ví dụ khi nhấn vão từng nhãn bài đăng trong blog mình.
Nguồn: http://math2it.com/