Nếu bạn nào muốn biến blogspot thành trang đọc truyện chắc hẳn sẽ gặp phải vấn đề đối với những truyện quá dài. Có 1 giải pháp thường thấy đó là chia bài viết thành nhiều trang. Nhưng bạn không biết phải làm như thế nào. Thì nay, trong khi mình đang thực hiện 1 blog đọc truyện nên đã tìm ra được cách để giải quyết vấn đề trên.
Còn bạn nào thích có thể xem các bài viết hướng dẫn biến blogspot thành web,wap truyện tại đây nhé.
Cách chia bài viết thành nhiều trang
Bước 1: Thêm đọc code sau vào trong cặp thẻ <HEAD>...</HEAD> trong template của bạn:
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
Bước 2: Tạo 1 bài đăng mới và chuyển sang trình soạn thảo bằng HTML và dán đoạn code sau:
<style>
.post-pagination {
margin: 20px auto;
text-align: center;
width: 100%;
}
.button_1, .button_2, .button_3 {
border: 2px solid #f4655f;
font-weight: 900;
padding: 6px 36px;
color:#f4655f;
transition:ease 0.69s !important;
}
.button_1:hover, .button_2:hover, .button_3:hover {
background: none repeat scroll 0 0 #f4655f;
color: #fff;
text-decoration: none;
}
</style>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('.button_1').click(function(){
jQuery('.content_1').fadeIn('slow');
jQuery('.content_2').fadeOut('fast');
jQuery('.content_3').fadeOut('fast');
jQuery(this).css('background','#F4655F');
jQuery(this).css('color','#fff');
jQuery('.button_2').css('background','#fff');
jQuery('.button_2').css('color','#F4655F');
jQuery('.button_3').css('background','#fff');
jQuery('.button_3').css('color','#F4655F');
return false;
});
jQuery('.button_2').click(function(){
jQuery('.content_1').fadeOut('fast');
jQuery('.content_2').fadeIn('slow');
jQuery('.content_3').fadeOut('fast');
jQuery(this).css('background','#F4655F');
jQuery(this).css('color','#fff');
jQuery('.button_1').css('background','#fff');
jQuery('.button_1').css('color','#F4655F');
jQuery('.button_3').css('background','#fff');
jQuery('.button_3').css('color','#F4655F');
return false;
});
jQuery('.button_3').click(function(){
jQuery('.content_1').fadeOut('fast');
jQuery('.content_2').fadeOut('fast');
jQuery('.content_3').fadeIn('slow');
jQuery(this).css('background','#F4655F');
jQuery(this).css('color','#fff');
jQuery('.button_1').css('background','#fff');
jQuery('.button_1').css('color','#F4655F');
jQuery('.button_2').css('background','#fff');
jQuery('.button_2').css('color','#F4655F');
return false;
});
});
</script>
<div class="content_1">
Bài viết trang 1
</div>
<div class="content_2" style="display: none;">
Bài Viết Trang 2
</div>
<div class="content_3" style="display: none;">
Bài viết trang 3
</div>
<div class="post-pagination">
<a class="button_1" href="#">1</a>
<a class="button_2" href="#">2</a>
<a class="button_3" href="#">3</a>
</div>
Đây là code chia bài viết thành 3 phần, nếu bạn muốn chia thêm 4 trang hoặc nhiều hơn thì chỉ cần thêm đoạn code với dạng
<div class="content_4" style="display: none;">
Bài viết trang 4
</div>
Thay 4 là số trang bạn muốn chia
Và thêm đoạn sau để tạo thêm nút:
<a class="button_4" href="#">4</a>
Đây là cách mình đã áp dụng để chia bài viết thành nhiều trang cho 1 blogspot dùng làm web đọc truyện. Nếu trong quá trình thực hiện có vấn đề gì các bạn cứ để lại lời nhắn nhé, mình sẽ cố gắng giúp đỡ. Chúc các bạn thành công.
a ơi giúp em với ak em đang muốn tạo 1 blogspot đọc truyện em post truyện HARRY POTTER lên nhưng mà em toàn phải post 18 chương truyện lên sau đó mới liên kết lại thành 1 bài viết nhưng mà khi em vào trang chủ thấy những CHƯƠNG truyện em vừa post 1 đống ý có cách nào post truyện nó vào từng chương luôn không anh không như này lúc vào đọc nó hiện 1 đống ý
Trả lờiXóaMột truyện có nhiều chương thì mình phải làm ntn vậy bro
Trả lờiXóaCái này sao bấm sang tab 2 nó ko tự động ngắt tab 1 vậy AD
Trả lờiXóa