Stylish Round Numbered Page Navigation For Blogger

Stylish Round Numbered Page Navigation For Blogger

Password = 1234

 Stylish Round Numbered Page Navigation For Blogger 

Live Demo

Every one want to insert stylish Numbered Page Navigation to blogger because blogger is not providing numbered page navigation.There are several tutorial provided for this type of page navigation for blogger but they are very hard to understand,This navigation menu are having round numbers and on hover there color changes.You can Install this navigation menu easily by following two simple steps-

Follow Below Steps to add this Stylish Round Numbered Page Navigation Menu to your Blog-

Step 1

• Go To Blogger Dashboard
• Click On Template Tab
• Now Click On Edit HTML>>Proceed
• Now Find ]]></b:skin>
• Paste Below Code Above ]]></b:skin>

.blog-pager,#blog-pager{font-family:"Times New Roman", Times, serif;font-weight:normal;font-size:12px;width:700px;padding:17px;}
.showpageNum a,.showpage a {background:#000; color:#FFF; margin-right:.6em;text-decoration:none;font-size:15px;font-style:italic;line-height:0;text-align:center;padding:12px 18px 12px;-moz-border-radius:36px;-webkit-border-radius:36px;border-radius:36px;}
.showpageNum a:hover,.showpage a:hover {background:#FF0000; color:#FFF; margin-right:.6em;text-decoration:none;font-size:15px;font-style:italic;line-height:0;text-align:center;padding:12px 18px 12px;-moz-border-radius:36px;-webkit-border-radius:36px;border-radius:36px;}
.showpageOf{margin:0 8px 0 0;font-family:'Coming Soon', cursive;text-decoration:none;font-size:100%;}
.showpagePoint {background:#FF0000; color:#FFF; margin-right:.6em;text-decoration:none;font-size:15px;font-style:italic;line-height:0;text-align:center;padding:12px 18px 12px;-moz-border-radius:36px;-webkit-border-radius:36px;border-radius:36px;}

Step 2 

• Now Find </body>
• Paste Below Code Above </body>

<script type='text/javascript'>;
var home_page=&#39;/&#39;;
var urlactivepage=location.href;
var postperpage=4;
var numshowpage=4;
var upPageWord =&#39;Prev&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='https://www.opendrive.com/files/MV8zNTk3MjA3X3ZQdGFO/lordhtml-roundpagenavigation.js' type='text/javascript'/>

Finally Click On Save Template Button and Enjoy This Awesome Navigation menu.

Password = 1234

Stylish Round Numbered Page Navigation For Blogger