How To Put Twitter On A Blog On Blogger

How to Add together Numbered Pagination in Your Blogger Blog

Are you nevertheless wondering that how most of the famous blogs are using numbered pagination, instead of displaying older and new mail service buttons at the lesser of every Blogger archive page? Recently, ane of our users asked usa, How to add together Numeric Pagination in Your Blogger Blog? We have been using number pagination on MyBloggerLab for quite a while at present, and from our experience it gives you 10 times better pageviews than the older and newer post button. It is more user friendly, attractive, and SEO friendly. Most of the accelerate Blogger templates like Templateism comes with builtin Numeric pagination. In this article, nosotros will bear witness y'all how to add numbered pagination in your blogger blog?

What is Numbered Pagination?

Numbered pagination is a numeric navigation bill of fare which is unremarkably present at the bottom of the archive pages. It divides your whole weblog into unlike pages, but like the pages of a book. Users can just navigate through page 1, 2, iii, 4 and etc . We take attached a screenshot below, so that users can hands sympathise our words.

How to Add Numbered Pagination in Blogger?

The firest affair y'all need to practice is to login into your Google business relationship. In one case logged in become to Blogger Dashboard >> Template >> Edit HTML and search for the Skin tag ]]></b:skin>. Afterward finding the skin tag, simply to a higher place it paste the post-obit slice of coding.

.showpageNum a {
background: #02ab68;
padding: 5px;
padding-left: 10px;
edge: 1px solid #b9b9b9;
padding-right: 10px;
margin-right: 5px;
color: #000;
font-weight: bold;
}
.showpage a {
background: #02ab68;
padding: 5px;
padding-left: 10px;
edge: 1px solid #b9b9b9;
padding-right: 10px;
margin-right: 5px;
color: #000;
font-weight: assuming;
}
.showpageArea {
bladder: left;
}
.feed-links {
display: none;
}
.showpageArea a {
bladder: left;
font-size: 15px;
color: #fff!important;
padding-left: 15px;
padding-correct: 15px;
}
.showpagePoint {
float: left;
font-size: 15px;
padding-left: 15px;
padding-right: 15px;
}
.showpageArea a {
text-decoration: none;
}
.showpageArea {
bladder: left;
width: 363px;
margin-acme: 10px;
}

At present once the style sheet is added to your template, it is the time to add together the JavaScript coding that would plough the ordinary looking social club/newer post buttons into a robust and user-friendly numeric pagination. Search for the catastrophe </trunk> tag and simply higher up it paste the post-obit JavaScript coding. Once everything is done press "Save Template" button located on the top right corner of your screen.

<b:if cond='information:web log.pageType != "particular"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
var pageCount=6;
var displayPageNum=6;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script src='http://widcraft.googlecode.com/svn/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if>
</b:if>

Congratulations: Y'all have successfully added numbered pagination in blogger. At present go and check out the interactive preview to run into the amazing navigation in activity. With a trivial modification is CSS, anyone tin customize to give it the want touch that he needs.

We hope this tutorial may accept helped yous in learning how to add numbered pagination in blogger. If anyone detect any difficulty then don't be shy to make a comment below or tweet us@mybloggerlab.