Как создать постраничную навигацию на блоге?

Здравствуйте посетитель моего сайта

Согласитесь, удобнее просматривать страницы на блоге по номерации, чем «следующая», «предеущая». Я Вам расскажу, как это сделать.

1. Заходим в Шаблон—Изменить HTML. Далее с помощью поиска (Ctrl+F)  найдите  эту строку в вашем шаблоне: ]]></b:skin>. Перед этой строкой Вам надо будет поставить CSS стиль вашей навигации. Обязательно над ]]></b:skin> вставляем этот код:

.showpageNum a {
color:#FFF;padding:4px 10px;
margin:0 2px;
text-decoration:none;
-webkit-border-radius:2px;-
moz-border-radius:2px;
background:#848484
}
.showpageOf {
color:#222;
margin:0 6px 0 0
}
.showpageNum a:hover {
background:#222;
color:#FFF
}
.showpagePoint {
color:#FFF;
text-shadow:0 1px 2px #333;
padding:4px 10px;
margin:0 2px;
-webkit-border-radius:2px;
-moz-border-radius:2px;
background:#222;
text-decoration:none
}

Теперь находим другую строчку: </body> и над ней вставляем код:

 <script type='text/javascript'>
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=10;
var numshowpage=7;
var upPageWord =&#39;&#9668;&#39;;
var downPageWord =&#39;&#9658;&#39;;
</script>
<script src='https://dl.dropbox.com/u/48089857/pagenav.js' type='text/javascript'/>

Сохраняем шаблон. Выделенное можете настроить на своё усмотрение.
var postperpage=10; — это количество сообщений на одной странице
var numshowpage=7; — это количество кнопок навигации на одной странице. Работает не  во всех шаблонах

Если у Вас не установилась навигация попробуйте этот код, предварительно удалив установленный код ранее.

2. Добавить этот код в гаджет html

 

 <script type='text/javascript'>
var home_page_url = location.href;
var pageCount=1;
var displayPageNum=5;
var upPageWord ='Смотреть';
var downPageWord ='далее';
function showpageCount(json) {
var thisUrl = home_page_url;
var htmlMap = new Array();
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';
for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);
var title = post.title.$t;
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}
if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'&max-results='+pageCount;
}
}
itemCount++;
}
for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}
fFlag++;
}
if(p==(thisNum-1)){
html += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
if(p==0){
html += '<span class="showpageNum"><a href="/">1</a></span>';
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
}
}
if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}
}
if(thisNum>1){
html = ''+upPageHtml+' '+html +' ';
}
html = '<div class="showpageArea"><span class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;
}
if(postNum==1) postNum++;
html += '</div>';
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");
if(postNum <= 2){
html ='';
}
for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}
if(pageArea&&pageArea.length>0){
html ='';
}
if(blogPager){
blogPager.innerHTML = html;
}
}
function showpageCount2(json) {
var thisUrl = home_page_url;
var htmlMap = new Array();
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';
var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';
var thisUrl = home_page_url;
for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);
var title = post.title.$t;
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}
if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'&max-results='+pageCount;
}
}
itemCount++;
}
for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}
fFlag++;
}
if(p==(thisNum-1)){
html += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
if(p==0){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
}
}
if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}
}
if(thisNum>1){
if(!isLablePage){
html = ''+upPageHtml+' '+html +' ';
}else{
html = ''+upPageHtml+' '+html +' ';
}
}
html = '<div class="showpageArea"><span class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;
if(thisNum<(postNum-1)){
html += downPageHtml;
}
if(postNum==1) postNum++;
html += '</div>';

var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");
if(postNum <= 2){
html ='';
}
for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}
if(pageArea&&pageArea.length>0){
html ='';
}
if(blogPager){
blogPager.innerHTML = html;
}
}
</script>
<script type='text/javascript'>
var thisUrl = home_page_url;
if (thisUrl.indexOf("/search/label/")!=-1){
if (thisUrl.indexOf("?updated-max")!=-1){
var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"));
}else{
var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"));
}
}
var home_page = "/";
if (thisUrl.indexOf("?q=")==-1){
if (thisUrl.indexOf("/search/label/")==-1){
document.write('<script src="'+home_page+'feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" ></script>')
}else{document.write('<script src="'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&callback=showpageCount2&max-results=99999" ></script>')
}
}
</script>

Сохраняем и перетаскиваем

 

его под сообщение.

Заходим в Шаблон—Изменить HTML. Далее с помощью поиска (Ctrl+F)  найдите  эту строку в вашем шаблоне:</body> и перед этой строкой

вставляем этот код

 <!--Page Navigation Starts-->
<script src='https://rethna30.googlepages.com/smiley.js' type='text/javascript'/><noscript><a href='https://introblogger.blogspot.com' target='_blank'><span style='font-size: x-small;'>Add Smilies</span></a></noscript>

Я Вам рекомендую вставить последний код, он более универсален

Всё. Радуемся.  До новых встреч. Пожалуйста оставляйте комментарии, получается или нет.

0
Рубрики: Новости

Вероника

Веб-дизайнер,коуч - помогаю обучающемуся достичь жизненной или профессиональной цели. Модератор

5 комментариев

Ludmila Danilo · 13.09.2015 в 12:52

Спасибо Вероника за информацию!

0

Инария · 13.09.2015 в 19:14

Вероника, спасибо большое за те знания которые Вы нам даёте. И щедро делитесь безвозмездно.

0

Людмила Никулина · 14.09.2015 в 02:25

Большое спасибо,Вероника! Очень полезная фишка для блога!!!

0

Вероника · 14.09.2015 в 11:30

Я рада,что Вам это пригодится в своих блогах, буду в дальнешем помогать Вам.

0

Светлана · 15.10.2015 в 17:01

Спасибо, Вероника за прекрасный урок. Постраничную навигацию установила себе на видеоблог.https://infosona.ru/wp-content/plugins/wp-monalisa/icons/wpml_good.gifhttps://infosona.ru/wp-content/plugins/wp-monalisa/icons/wpml_yahoo.gif

0

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_bye.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_good.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_negative.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_scratch.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_wacko.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_yahoo.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_cool.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_heart.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_rose.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_smile.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_whistle3.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_yes.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_cry.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_mail.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_sad.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_unsure.gif 
https://shopingf.ru/wp-content/plugins/wp-monalisa/icons/wpml_wink.gif 
 
Авторизация
*
*
Регистрация
*
*
*
Пароль не введен
*

Генерация пароля