Ở bài viết này mình sẽ lại giới thiệu 1 style mới cho tiện ích Recent Posts, đó là sẽ tạo thêm button "Xem thêm" bên dưới, khi click vào button này thì sẽ hiển thị thêm các bài viết khác. Với hiệu ứng hiển thị sử dụng từ jQuery. Ngoài việc hiển thị bài viết, ở thủ thuật này mình cũng giới thiệu khung trang trí mẫu cho tiện ích.
Xem demo : LIVE DEMO
Ở thủ thuật này, khung trang trí mẫu có kích thước cố định, vì thế nếu muốn hiển thị tốt trên blog của bạn, bạn phải chỉnh sửa các hình ảnh của khung mẫu lại cho phù hợp. (Việc chỉnh sửa đơn thuần là dùng các chương trình đồ họa để tăng hoặc giảm kích thước của ảnh)
Bên dưới là 3 file ảnh của khung trang trí, các bạn có thể download về để chỉnh sửa lại :
http://i342.photobucket.com/albums/o433/bkprobk/head.gif
http://i342.photobucket.com/albums/o433/bkprobk/center.jpg
http://i342.photobucket.com/albums/o433/bkprobk/footer.jpg
☼ Các bước thực hiện:
1. Vào bố cục
2. Vào chỉnh sửa code HTML
3. Chèn code bên dưới vào trước thẻ đóng
Hình ảnh minh họa :
Ở thủ thuật này, khung trang trí mẫu có kích thước cố định, vì thế nếu muốn hiển thị tốt trên blog của bạn, bạn phải chỉnh sửa các hình ảnh của khung mẫu lại cho phù hợp. (Việc chỉnh sửa đơn thuần là dùng các chương trình đồ họa để tăng hoặc giảm kích thước của ảnh)
Bên dưới là 3 file ảnh của khung trang trí, các bạn có thể download về để chỉnh sửa lại :
http://i342.photobucket.com/albums/o433/bkprobk/head.gif
http://i342.photobucket.com/albums/o433/bkprobk/center.jpg
http://i342.photobucket.com/albums/o433/bkprobk/footer.jpg
☼ Các bước thực hiện:
1. Vào bố cục
2. Vào chỉnh sửa code HTML
3. Chèn code bên dưới vào trước thẻ đóng
Xem thêm
- Nếu muốn hiển thị bài viết theo nhãn nào đó thì các bạn đổi file RP_jQuery-post.js thành file RP_jQuery-label.js.
- Và đây là link của file RP_jQuery-label.js :
http://fandung.110mb.com/JS-files/jQuery-RP/RP_jQuery-label.js
- Gợi ý nhỏ khi hiển thị các bài viết từ nhãn, các bạn có thể chú thích thêm ở phần header của khung như hình bên dưới :
- Để làm điều này, các bạn tìm đến đoạn code như bên dưới (trong code của thủ thuật), và thêm vào đoạn code màu đỏ như bên dưới:
Love