Các Bạn Vui Lòng Chờ Trong Giây Lát Đang tải dữ liệu Từ ITnguyenHuy...
Chủ Nhật, 23 tháng 9, 2012 - 0 nhận xét

Tạo Số Trang Chuyển Hướng Trong Blog


Hôm nay chúng ta sẽ xem làm thế nào để thêm một số trang chuyển hướng trong blogger. Các mặc định liên kết điều hướng (tức là bài viết cũ hơn) không truy cập thân thiện nếu bạn đang có một số lượng lớn các bài viết và các nhiều người đọc - blogger readers. Một số blogger có vấn đề với với thanh trang quay lại. Bây giờ đây là một đoạn mã hoàn toàn mới và làm việc cho đánh số trang mục chính (ví dụ Panigation) cho Blogger. Các widget phân trang cho blogger làm cho nó đơn giản cho khách truy cập của bạn. . Bất kỳ đoạn mã mới nào cũng cho phép bạn thêm số điều hướng trang blog blogger blogspot / với số trang bắt đầu (1, 2, 3, 4 ....) giống như của một cuốn sách.
Lưu ý: các đoạn mã "code" là các mã có màu xanh da trời
Hướng dẫn : 
Bước # 1 Đăng nhập vào Blogger, vào Thiết kế -> Edit HTML và đánh dấu vào ô chọn "Expand Widget Templates"
 
Bước # 2 Tra tìm (Ctrl + F) đoạn mã này trong mẫu HTML:
</body>
Và ngay lập tức trước nó, dán mã này:
 
&lt;script type='text/javascript'&gt;
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=4;
var upPageWord ='Prev';
var downPageWord ='Next';
&lt;/script&gt;
&lt;script src='http://sites.google.com/site/testsajasite/pagenav.js' type='text/javascript'&gt;&lt;/script&gt;

Postperpage : Bao nhiêu bài viết bạn muốn hiển thị trên mỗi trang
Numshowpage : Bao nhiêu số trang hiển thị trên thanh Your page Navigation
 
ví dụ: Nếu bạn muốn hiển thị 5 bài viết trên mỗi trang sau đó thay đổi postperpage var = 7; để var postperpage = 5;
 
Bước # 3 Trả tìm (Ctrl + F) đoạn mã này trong mẫu HTML:
]]></b:skin>
Và ngay lập tức trước nó, dán mã CSS Style vào Mẫu của bạn
.showpageArea {
font-family:verdana,arial,helvetica;
color: #000;
font-size:11px;
margin:10px;
}

.showpageArea a {
color: #000;
text-shadow:0 1px 2px #fff;
font-weight: 700;
}

.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
border:1px solid #919106;
-webkit-border-radius:3px;-moz-border-radius:3px;
background: #ddd url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSlI52sRRuCS2YVX4nK9-V7ewZwfDhKXatX8VeEmbPvDoCdSOIngtlw7yqU6JLrHk-h6-lt9DEmq3K5he5wQlQH23Tr73UXkaDhyphenhyphen2wyJNxOt2OBg-zPaQ_QZBSAD9p9MewMEPAbFuq6eA/s400/wp2.jpg) 0 -50px repeat-x;
}

.showpageNum a:hover {
border:1px solid #aeae0a;
background: #ccc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSlI52sRRuCS2YVX4nK9-V7ewZwfDhKXatX8VeEmbPvDoCdSOIngtlw7yqU6JLrHk-h6-lt9DEmq3K5he5wQlQH23Tr73UXkaDhyphenhyphen2wyJNxOt2OBg-zPaQ_QZBSAD9p9MewMEPAbFuq6eA/s400/wp2.jpg) 0 -25px repeat-x;
}

.showpageOf{
margin:0 8px 0 0;
}

.showpagePoint {
color:#fff;
text-shadow:0 1px 2px #333;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
-webkit-border-radius:3px;-moz-border-radius:3px;
border:1px solid #919106;
background: #666 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSlI52sRRuCS2YVX4nK9-V7ewZwfDhKXatX8VeEmbPvDoCdSOIngtlw7yqU6JLrHk-h6-lt9DEmq3K5he5wQlQH23Tr73UXkaDhyphenhyphen2wyJNxOt2OBg-zPaQ_QZBSAD9p9MewMEPAbFuq6eA/s400/wp2.jpg) 0 0 repeat-x;
text-decoration: none;
} 
Bạn có thể thay đổi kiểu CSS của Danh mục số trang chỉ cần thay thế đoạn code trên với bất kỳ đoạn của mã code dưới đây

.showpageArea {padding: 0 2px;margin-bottom:10px;margin-top:10px;
}

.showpageArea a {border: 1px solid #505050;
color: #000000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;
}
.showpageArea a:hover {
font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;
}

.showpageNum a {border: 1px solid #505050;
color: #000000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;

}
.showpageNum a:hover {
font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;

}
.showpagePoint {font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
font-weight: bold;
border: 1px solid #333;
color: #fff;
background-color: #000000;


}

.showpage a:hover {font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;

}
.showpageNum a:link,.showpage a:link {
font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #0066cc;
color: #0066cc;
background-color: #FFFFFF;}

.showpageNum a:hover {font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;
}
 
 
 

.showpageArea {
font-family:verdana,arial,helvetica;
color: #fff;
font-size:11px;
margin:10px;
padding:8px 20px;
background: #333;
}
.showpageArea a {
color: #fff;
}
.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
background: #666;
}
.showpageNum a:hover {
background: #888;
}

.showpagePoint {
color:#fff;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
background: #da6100;
text-decoration: none;
}

.showpageOf{
margin:0 8px 0 0;
}
 


.showpageArea {
font-family:verdana,arial,helvetica;
color: #000;
font-size:11px;
margin:10px;
}
.showpageArea a {
color: #fff;
}
.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
background: #333 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp5.jpg) 0 -50px repeat-x;
}
.showpageNum a:hover {
background: #666 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp5.jpg) 0 -25px repeat-x;
}

.showpagePoint {
color:#fff;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
background: #06a2b9 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp5.jpg) 0 0 repeat-x;
text-decoration: none;
}

.showpageOf{
margin:0 8px 0 0;
}
 

.showpageArea {
font-family:verdana,arial,helvetica;
color: #000;
font-size:11px;
margin:10px;
}
.showpageArea a {
color: #fff;
}
.showpageNum a {
padding: 3px 4px;
margin:0 4px;
text-decoration: none;
border-top:2px solid #000;
border-left:1px solid #000;
border-right:1px solid #000;
border-bottom:1px solid #000;
background: #666 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp4.jpg) 0 -25px repeat-x;
}
.showpageNum a:hover {
border-top:2px solid #999;
border-left:1px solid #999;
border-right:1px solid #999;
border-bottom:1px solid #999;
background: #999 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp4.jpg) 0 -50px repeat-x;
}

.showpagePoint {
color:#fff;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
border-top:2px solid #000;
border-left:1px solid #000;
border-right:1px solid #000;
border-bottom:1px solid #000;
background: #000 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp4.jpg) 0 0 repeat-x;
text-decoration: none;
}

.showpageOf{
margin:0 8px 0 0;
}



.showpageArea {
font-family:verdana,arial,helvetica;
color: #000;
font-size:11px;
margin:10px;
}
.showpageArea a {
color: #fff;
}
.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
background: #363636 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp3.jpg) 0 -25px repeat-x;
}
.showpageNum a:hover {
background: #044697 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp3.jpg) 0 -50px repeat-x;
}

.showpagePoint {
color:#fff;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
background: #e30000 url(whttp://i879.photobucket.com/albums/ab351/bloggerblogimage/wp3.jpg) 0 0 repeat-x;
text-decoration: none;
}

.showpageOf{
margin:0 8px 0 0;
}



.showpageArea {
font-family:verdana,arial,helvetica;
color: #000;
font-size:11px;
margin:10px;
}
.showpageArea a {
color: #000;
text-shadow:0 1px 2px #fff;
font-weight: 700;
}
.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
border:1px solid #919106;
-webkit-border-radius:3px;-moz-border-radius:3px;
background: #ddd url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp2.jpg) 0 -50px repeat-x;
}
.showpageNum a:hover {
border:1px solid #aeae0a;
background: #ccc url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp2.jpg) 0 -25px repeat-x;
}

.showpageOf{
margin:0 8px 0 0;
}

.showpagePoint {
color:#fff;
text-shadow:0 1px 2px #333;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
-webkit-border-radius:3px;-moz-border-radius:3px;
border:1px solid #919106;
background: #666 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp2.jpg) 0 0 repeat-x;
text-decoration: none;
}



.showpageArea {
font-family:verdana,arial,helvetica;
color: #000;
font-size:11px;
margin:10px;
}
.showpageArea a {
color: #000;
text-shadow:0 1px 2px #fff;
font-weight: 700;
}
.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
border:1px solid #999;
-webkit-border-radius:3px;-moz-border-radius:3px;
background: #ddd url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp1.jpg) 0 -50px repeat-x;
}
.showpageNum a:hover {
border:1px solid #888;
background: #ccc url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp1.jpg) 0 -25px repeat-x;
}

.showpageOf{
margin:0 8px 0 0;
}

.showpagePoint {
color:#fff;
text-shadow:0 1px 2px #333;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
-webkit-border-radius:3px;-moz-border-radius:3px;
border:1px solid #999;
background: #666 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp1.jpg) 0 0 repeat-x;
text-decoration: none;
}


.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #ccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #ccc;
background-color:#ccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #ccc;
background: #ccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #ccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333;
}
hahuyhoanglong Unknown vào lúc 03:10

0 nhận xét:

Đăng nhận xét

Đăng ký: Đăng Nhận xét (Atom)

Liên Hệ Email

Bắc
Trung
Nam
piano
Guita
trống
* Required Create Email Forms

Recent Posts

Danh Mục Bài Viết!!!