Friday, January 20, 2012

How to Add Wonderful Page Counting Buttons to Free Blog Blogger Better SEO Tips

Summary: Page Counting Buttons are very interested and beautiful looking in the footer of the free Blog Blogger Posts and and you can look view nice and also this facility to provide page counting to your visitors and readers that how much pages related with your blogger blog and also called better SEO Tips

By this important article you teach that how to add Wonderful Page Counting Buttons to free Blog Blogger, lot of new blogger owners and visitors have lot of pages on their precious blogs and want to count and settle pages on one page this procedure will be very easy to count your blogger pages and posts. Now I want to present following useful code for solve this simple problem.

1. Go to www. blogger.com and then Design after that Edit HTML and following code line with carefully.

</body>

2. Now paste the following useful code before the above code line with sensibility.

<style type="text/css">

.showpageArea{padding:10px;color : #003366;text-align : left;width : 100%;}

.showpage a {float:left;background:url(https://lh3.googleusercontent.com/-ssoShc5LRzw/TYB4mmwQxOI/AAAAAAAAAeI/VE8IzBS7JzA/way2blogging-button.gif) no-repeat 0 0;text-align : center;width : 127px;height : 42px;text-align : center;display : block;margin : 0 5px;color : #333;padding-top : 6px;}

.showpage a:hover {color : #333;margin : 0 5px;padding-top : 6px;}

.showpageOf{float:left;padding-top : 6px;}

.showpageNum a {background:url(https://lh4.googleusercontent.com/-mhmA2xKtrzc/TYB4m5bcS0I/AAAAAAAAAeM/uPZU2s1pe8M/way2blogging-pagenum.gif) no-repeat 0 0;width : 37px;height : 42px;display : block;text-align : center;float : left;margin : 0 5px;padding-top : 6px;text-decoration : none;color : #333;}

.showpageNum a:hover {background : url(https://lh4.googleusercontent.com/-mhmA2xKtrzc/TYB4m5bcS0I/AAAAAAAAAeM/uPZU2s1pe8M/way2blogging-pagenum.gif) no-repeat 0 100%;color : #fff;}

.showpagePoint {background : url(https://lh4.googleusercontent.com/-mhmA2xKtrzc/TYB4m5bcS0I/AAAAAAAAAeM/uPZU2s1pe8M/way2blogging-pagenum.gif) no-repeat 0 100%;width : 37px;height : 42px;display : block;float : left;text-align : center;margin : 0 5px;padding-top : 6px;font-weight : bold;color : #fff;}

.showpageNum a:link, .showpage a:link {text-decoration : none;color : #cc0000;}

</style>

<script style='text/javascript'>

var pageCount=7;

var displayPageNum=1;

var upPageWord="Previous";

var downPageWord="Next";

</script>

<script type='text/javascript' src="http://bloggerblogwidgets.googlecode.com/files/BeautifulPageNavi.js"/>

In view of the above code, if you want to change number of posts on the page as you like and change figures in the above code in green colors and then save your template and check your blogger blog and enjoy. See the following sample of Page counting buttons on Blog Blogger Training.