--------------- CHIA SẺ CÔNG NGHỆ - KẾT NỐI ĐAM MÊ ----------------

--------------- CHIA SẺ CÔNG NGHỆ - KẾT NỐI ĐAM MÊ ----------------

Tạo phân trang đánh số thứ tự trong blogspot

blogspot tips, Page Navigation, phân trang, thu thuat blogspot, blogspot
Phân trang là một tính năng cần thiết cho blog của bạn khi mà danh sách bài viết của bạn trở nên đồ sộ, nó giúp khách viếng thăm blog của bạn dễ dàng điều hướng đến những trang kế tiếp hoặc trước đó. Hôm nay mình và các bạn sẽ lần lượt tạo phân trang cho blog của mình với các trang được đánh số thứ tự như hình bên dưới :
blogspot tips, Page Navigation, phân trang, thu thuat blogspot, blogspot

Bước 1 : Đăng nhập vào Blogger : Dashboard > Design > Edit Html
Bước 2 : Sao lưu lại toàn bộ template trước khi tiến hành
Bước 3 : Tìm kiếm đoạn code sau :
?
1
]]></b:skin>
và thay thế bằng :
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
.showpageArea a {
 
text-decoration:underline;
 
}
 
.showpageNum a {
 
text-decoration:none;
 
border: 1px solid #cccccc;
 
margin:0 3px;
 
padding:3px;
 
}
 
.showpageNum a:hover {
 
border: 1px solid #cccccc;
 
background-color:#cccccc;
 
}
 
.showpagePoint {
 
color:#333;
 
text-decoration:none;
 
border: 1px solid #cccccc;
 
background: #cccccc;
 
margin:0 3px;
 
padding:3px;
 
}
 
.showpageOf {
 
text-decoration:none;
 
padding:3px;
 
margin: 0 3px 0 0;
 
}
 
.showpage a {
 
text-decoration:none;
 
border: 1px solid #cccccc;
 
padding:3px;
 
}
 
.showpage a:hover {
 
text-decoration:none;
 
}
 
.showpageNum a:link,.showpage a:link {
 
text-decoration:none;
 
color:#333333;
 
}
 
]]></b:skin>
Đây chỉ là phần css dùng để định dạng phân trang, bạn có thể chỉnh sửa lại tùy theo ý muốn của mình.
Bước 4 : Tìm đoạn code:
?
1
</body>
Và thay thế với :
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!--Page Navigation Starts-->
 
<b:if cond='data:blog.pageType != &quot;item&quot;'>
 
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
 
<script type='text/javascript'>
 
var pageCount=5;
 
var displayPageNum=5;
 
var upPageWord =&#39;Previous&#39;;
 
var downPageWord =&#39;Next&#39;;
 
</script>
 
<script src='https://www.thuthuatweb.net/download/blogger_pagenavi_min.js' type='text/javascript'/>
 
</b:if>
 
</b:if>
 
<!--Page Navigation Ends -->
 
</body>

– pageCount : Số lượng bài viết hiển thị trên trang
– displayPageNum : Số lượng trang được đánh dấu sẽ hiển thị trên trang
– upPageWord và downPageWord được dùng để hiển thị trang trước và trang sau, các bạn có thể thay thế bằng những dòng chữ hay kí tự tùy ý.
Bước 5 : Bây giờ chúng ta sẽ chỉnh sửa thêm một vài thứ, mặc định thì blogger label sẽ hiển thị 20 bài viết trên một trang, chúng ta sẽ phải cắt giảm số lượng này xuống bằng 5 cho phù hợp với đoạn script phân trang mà chúng ta đã làm ở phía trên.
Các bạn tìm :
?
1
'data:label.url'
Và thay thế bằng :
?
1
'data:label.url + &quot;?&amp;max-results=5&quot;'

CHÚC BẠN THÀNH CÔNG - TIN HỌC CƠ BẢN BLOG

Share on Google Plus

Admin Admin

Một số bài đăng trong blog có sử dụng nhiều nguồn thông tin khác nhau nên dễ xảy ra vấn đề trùng bài hoặc vi phạm bản quyền, mong các bạn thông cảm. Nếu phát hiện bài đăng vi phạm bản quyền vui lòng comment ngay bên dưới để được hỗ trợ tốt nhất ! Xin cảm ơn và chúc các bạn có trải nghiệm vui vẻ tại blog :)
    Blogger Comment
    Facebook Comment

0 nhận xét: