How to Add Numbered Pagination in Your Blogger Blog

Add Numbered Pagination in Your Blogger Blog


Add Numbered Pagination in Your Blogger Blog

Here we will going to talk about how you can add numbered pagination in your blogger blog because today’s you can see many pro bloggers are use it on their blogs because its give you more pageviews instead of Next post and previous posts. It’s also better for SEO and you can also increase your pageviews if you use it, because visitors can easily navigate your site, so by viewing this point today we will going to share with you this topic with fully detail.

How numbered Pagination Look like?

If you visit daily some pro websites then I hope you know about it, however if you don’t know what is numbered pagination, so first let me introduce you what is numbered pagination and how your blog look like when you apply it on your blog. Spice Blogger Tricks are also use it, so simply visit our homepage and have a look how your blog look like when you apply it.

How to Add Numbered Pagination in Blogger?

After introduced, here is full method that how you can add numbered pagination in your blog and make it attractive and increase you blog pageviews. You just need to follow below steps and you can don it just in seconds.

1. First of all Log-in to your Blogger account and go to your Dashboard>> Template>> Edit HTML. (Tip: Before editing anything backup you template).

2. Now simply find ]]></b:skin> in your blog template.

3. After finding ]]></b:skin> simply past below coding right above it.

.showpageNum a {
background: #fff;
padding: 5px;
padding-left: 10px;
border: 1px solid #b9b9b9;
padding-right: 10px;
margin-right: 5px;
color: #000;
font-weight: bold;
}

.showpage a {
background: #fff;
padding: 5px;
padding-left: 10px;
border: 1px solid #b9b9b9;
padding-right: 10px;
margin-right: 5px;
color: #0099FF;
font-weight: bold;
}

.showpageArea {
float: left;
}

.feed-links {
display: none;
}

.showpageArea a {
float: left;
font-size: 15px;
color: #fff!important;
padding-left: 15px;
padding-right: 15px;
}

.showpagePoint {
float: left;
font-size: 15px;
padding-left: 15px;
padding-right: 15px;
}

.showpageArea a {
text-decoration: none;
}

.showpageArea {
float: left;
width: 363px;
margin-top: 10px;
}

4. Now in next step again find </body> tag in your blog Template and paste below coding right above it.

<!--SBT 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=6;
var displayPageNum=6;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>

<script src='https://googledrive.com/host/0B5XHBEaFFoSYSHgxaHFNUkdFWWc' type='text/javascript'/>
</b:if>
</b:if>
<!--SBT Page Navigation Ends -->

5. Now after it simply click on Save Template.

Now see the new look of your blog and you can see attractive Numbered Pagination. If you have some knowledge about CSS, so you can also customize it and make some changes as you want, however if you don’t know about CSS so left it.


Tags: Blogger Numbered Pagination, pagination, bootstrap pagination, pagination definition, ragin pagin, paginate, Numbered Pagination

About Masum Billah

Add Numbered Pagination in Your Blogger Blog 1stWebSuite website seo tool is a free website ranking tool site provides a lot of on page and off page seo useful tools for you. On this site, we have a large number of website ranking tools



Discuss about: How to Add Numbered Pagination in Your Blogger Blog


Newsletter Subscription

Enter your email address:

Delivered by FeedBurner