Numbered Page Navigation for Blogger andrey пятница, 25 января 2013 г. No Comment

Now am going to explain how to make Numbered Page Navigation for Blogger blogs. It was an already described topic in many blogs, Its also one from my readers. The default navigation links is not easy if you are having a lot of posts. Its a completely new script and work for numbered page navigation for Blogger. It is a must have for any new blogs.This new script allows you to add numbered page navigation to blogger/ blogspot blog.

Steps:

1.Login to Blogger Dashboard and navigate to Layout > Edit Html

2.Don’t click the checkbox which says ‘Expand Widget Templates’

3.Now find :

]]>

and replace with

/* Page Navigation styles */ .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;   } .showpageOf { margin:0 8px 0 0; } .showpageNum a:hover {   border:1px solid #888;   background: #ccc;   } .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;   text-decoration: none;   } ]]>

This is the CSS part. You can change it according to your template. If you not sure comment below, i will help you.
4. Now find

and replace with

There are some customization parameters in this code

varpostperpage=4;

This code determines the number of posts that would be displayed per page.

varnumshowpage=6;

This code determines the number of additional page navigation numbers that will be displayed on the page.

var upPageWord ='Previous';
downPageWord ='Next';

These two lines determine the text that would be shown for the previous page and next page.

Now am going to explain how to make Numbered Page Navigation for Blogger blogs. It was an already described topic in many blogs, Its also one from my readers. The default navigation links is not easy if you are having a lot of posts. Its a completely new script and work for numbered page navigation for Blogger. It is a must have for any new blogs.This new script allows you to add numbered page navigation to blogger/ blogspot blog.

Steps:

1.Login to Blogger Dashboard and navigate to Layout > Edit Html

2.Don’t click the checkbox which says ‘Expand Widget Templates’

3.Now find :

]]>

and replace with

/* Page Navigation styles */ .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;   } .showpageOf { margin:0 8px 0 0; } .showpageNum a:hover {   border:1px solid #888;   background: #ccc;   } .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;   text-decoration: none;   } ]]>

This is the CSS part. You can change it according to your template. If you not sure comment below, i will help you.
4. Now find

and replace with

There are some customization parameters in this code

varpostperpage=4;

This code determines the number of posts that would be displayed per page.

varnumshowpage=6;

This code determines the number of additional page navigation numbers that will be displayed on the page.

var upPageWord ='Previous';
downPageWord ='Next';

These two lines determine the text that would be shown for the previous page and next page.

Tweet

by Jillur Rahman

Jillur Rahman is a Web designers. He enjoys to make blogger templates. He always try to make modern and 3D looking Templates. You can by his templates from Themeforest.

Follow him @ Twitter | Facebook | Google Plus

Tags: Без рубрики