Cool Recent Post Widget for Blogger

Showing Recent posts in your sidebar regularly help to your user to rapidly examine the substance that is all the more new and new.  It provides for them a perfect idea that what type of text is published on a blog. In the event that the latest post is to some degree connected on one another, at that point it may captivate your visitors for a bit longer. So many type of design to display recent posts. In this Article, we tell you how to add Cool Recent Post Widgets for Blogger.

Style # 1

 <script style="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/helplogger/recentpoststhumbs.js"></script><script style="text/javascript">var posts_no = 5;var showpoststhumbs = true;var readmorelink = true;var showcommentslink = false;var posts_date = true;var post_summary = true;var summary_chars = 70;</script><script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://helplogger.blogspot.com/2014/11/5-cool-recent-post-widgets-for-blogger.html" rel="nofollow">Recent Posts Widget</a><noscript>Your browser does not support JavaScript!</noscript><link href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed' rel='stylesheet' type='text/css' /><style type="text/css">img.recent-post-thumb {width:50px;height:50px;float:right;margin: 5px -5px 0px 0px; border-radius: 100%; padding: 3px;background: #fff}.recent-posts-container {font-family: 'Ubuntu Condensed', sans-serif; float: left;width: 100%;min-height: 55px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}ul.recent-posts-container {list-style-type: none; background: #fff;padding: 0px; }ul.recent-posts-container li:nth-child(1n+0) {background: #F49A9A; width: 100%}ul.recent-posts-container li:nth-child(2n+0) {background: #FCD092; width: 95%}ul.recent-posts-container li:nth-child(3n+0) {background: #FFF59E; width: 90%;}ul.recent-posts-container li:nth-child(4n+0) {background: #E1EFA0; width: 85%;}ul.recent-posts-container li:nth-child(5n+0) {background: #B1DAEF; width: 80%;}ul.recent-posts-container li {padding:5px 10px;min-height:50px; list-style-type: none; margin: 0px 5px -5px 5px; color: #777;}.recent-posts-container a { text-decoration:none; }.recent-posts-container a:hover { color: #222;}.post-date {color:#e0c0c6; font-size: 11px; }.recent-post-title a {font-size: 14px;color: #444; font-weight: bold;}.recent-post-title {padding: 6px 0px;}.recent-posts-details a{ color: #222;}.recent-posts-details {padding: 5px 0px 5px; }</style>

Style # 2

<div class="recentpoststyle"><script src="http://helplogger.googlecode.com/svn/trunk/helplogger/recentposts.js"></script><script>var posts_no = 5;var posts_date = true;var post_summary = true;var summary_chars = 80;</script><script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showlatestposts"></script><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://helplogger.blogspot.com/2014/11/5-cool-recent-post-widgets-for-blogger.html" rel="nofollow">Recent Posts Widget</a><noscript>Your browser does not support JavaScript!</noscript><style type="text/css">.recentpoststyle {counter-reset: countposts;list-style-type: none;}.recentpoststyle a {text-decoration: none; color: #49A8D1;}.recentpoststyle a:hover {color: #000;}.recentpoststyle li:before {content: counter(countposts,decimal);counter-increment: countposts;float: left;z-index: 2;position:relative;font-size: 20px;font-weight: bold;color: #fff;background: #69B7E2; margin: 15px 5px 0px -6px; padding: 0px 10px; border-radius: 100%;}li.recent-post-title { padding: 5px 0px;}.recent-post-title { font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;}.recent-post-title a {color: #444;font-size: 13px; text-decoration: none; padding: 2px; font-weight: bold;}.post-date {padding: 5px 2px 5px 30px; font-size: 11px; color: #999; margin-bottom: 5px;}.recent-post-summ { border-left: 1px solid #69B7E2; color: #777; padding: 0px 5px 0px 20px; margin-left: 11px; font-family: Garamond,Baskerville,"Baskerville Old Face","Hoefler Text","Times New Roman",serif; font-size: 15px;}</style></div>

Style # 3

<script style="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/helplogger/recentpoststhumbs.js"></script><script style="text/javascript">var posts_no = 5;var showpoststhumbs = true;var readmorelink = true;var showcommentslink = true;var posts_date = true;var post_summary = true;var summary_chars = 70;</script><script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://helplogger.blogspot.com" rel="nofollow">Recent Posts Widget</a><noscript>Your browser does not support JavaScript!</noscript><link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/><style type="text/css">img.recent-post-thumb {padding:2px;width:65px;height:65px;float:left;margin: 0px 10px 10px; background: #fff; border: 1px solid #69B7E2;}.recent-posts-container {font-family: 'Oswald', sans-serif;  float: left;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}ul.recent-posts-container li {padding:5px 0px;min-height:65px; list-style-type: none; margin-bottom: 5px;}ul.recent-posts-container {counter-reset: countposts;list-style-type: none;}ul.recent-posts-container li:before {content: counter(countposts,decimal);counter-increment: countposts;z-index: 2;position:absolute; left: 15px; font-size: 13px;font-weight: bold;color: #fff;background: #69B7E2;padding: 4px 10px; border-radius: 100%;}.recent-posts-container a { text-decoration:none; }.recent-post-title a {font-size: 13px; text-transform: uppercase; color: #2aace3;}.recent-posts-details {margin: 5px 0px 0px 92px; }.recent-posts-details a{ color: #777;}</style>

 Style # 4 

<script style="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/helplogger/recentposts2.js"></script><script style="text/javascript">var posts_no = 5;var showpoststhumbs = false;var readmorelink = true;var showcommentslink = true;var posts_date = true;</script><script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://helplogger.blogspot.com">Recent Posts Widget</a><noscript>Your browser does not support JavaScript!</noscript><link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/><style type="text/css">img.recent-post-thumb {padding: 2px; width:35px;height:35px;float:right;margin: -14px 0px 0px 5px; border: 1px solid #cea5ac; border-radius: 10%;}.recent-posts-container {font-family: 'Oswald', sans-serif;  float: left;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}ul.recent-posts-container li {padding:5px 0px;min-height:65px; list-style-type: none; margin: 0px 10px 5px 35px;}ul.recent-posts-container {counter-reset: countposts;list-style-type: none;}ul.recent-posts-container li:before {content: counter(countposts,decimal);counter-increment: countposts;z-index: 2;position:absolute; left: 5px; font-size: 16px;color: #4D4D4D;background: #F7F7F7;padding: 9px 14px; border: 1px solid #efefef;}.recent-posts-container a { text-decoration:none; }.recent-posts-container a:hover{color: #4DACE3;}.post-date {color:#e0c0c6; font-size: 11px; }.recent-post-title a {font-size: 13px; text-transform: uppercase; color: #5C4D4D;}.recent-post-title { margin: 5px 0px; }.recent-posts-details {border-top: 4px solid #AC707A; margin-top: 5px; padding-top: 5px;}.recent-posts-details a{ color: #888;}a.readmorelink {color: #4DACE3;}</style>

Style # 5

<script style="text/javascript" src="https://helplogger.googlecode.com/svn/trunk/helplogger/recentposts2.js"></script><script style="text/javascript">var posts_no = 5;var showpoststhumbs = true;var readmorelink = true;var showcommentslink = true;var posts_date = true;</script><script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs" rel="nofollow"></script><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://helplogger.blogspot.com/2014/11/5-cool-recent-post-widgets-for-blogger.html" rel="nofollow">Recent Posts Widget</a><noscript>Your browser does not support JavaScript!</noscript><link href='http://fonts.googleapis.com/css?family=Lobster|Gloria+Hallelujah' rel='stylesheet' type='text/css' /><style type="text/css">img.recent-post-thumb {width:50px;height:50px;float:right;margin: -4px -35px 0px 0px; border: 4px solid #FCD6CB; border-radius: 100%;}.recent-posts-container {font-family: 'Gloria Hallelujah', cursive;  float: left;width: 100%;min-height: 55px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}ul.recent-posts-container {counter-reset: countposts;list-style-type: none; background: #fff; }ul.recent-posts-container li:before {content: counter(countposts,decimal);counter-increment: countposts;z-index: 2;position:absolute; left: -20px; font-size: 16px;color: #616662;background: #FCD6CB;padding: 9px 14px; border-radius: 100%; margin-top: 15px;}ul.recent-posts-container li {padding:5px 0px;min-height:50px; list-style-type: none; margin: -2px 5px 5px 5px;  border-top: 2px solid #FCD6CB;}ul.recent-posts-container {border: 2px solid #FCD6CB; }.recent-posts-container a { text-decoration:none; }.recent-posts-container a:hover { color: #222;}.post-date {color:#e0c0c6; font-size: 11px; }.recent-post-title a {font-size: 14px;color: #616662;}.recent-post-title {padding: 6px 0px;}.recent-posts-details a{ color: #888;}.recent-posts-details {padding-bottom: 5px;}a.readmorelink {color: #4DACE3;}</style>

How to Add Recent Posts Widget in Blogger 

Following are the steps to add

Step 1: Login to your blogger account and Go to Layout and click Add a Gadget > HTML/JavaScript

Step 2: Copy Recent Post widget code and add in to the gadget

Press Save Button. Done!

How to add Numbered Page Navigation Widget for Blogger

Today's I provide knowledge you to add page navigation gadget for your blogger blog. Blogger blog manually navigation shows Older Posts and Newer Posts, numerous blogger need to change this into numbered Navigation. I guide you and tell easy method to add page navigation gadget to replace of blogger old navigation. Old navigation is extremely troublesome for visitor to navigate deeper into your blog posts so we give you answer for change this.

How to Add Page Navigation Widget For Blogger

Following ways to Add Page Navigation gadget in Blogger blog.

Method # 1

• Login to your Blogger blog account
• Click “Layout” and “Add a Gedget”

• Click on “HTML/JavaScript”

• Select the style, copy the code and paste in to the box

Style 1

<style>#blog-pager{clear:both;margin:20px 0 20px;font-size: 12px;padding:10px 0;}#blog-pager-newer-link{float: left;}#blog-pager-older-link{float: right;}.Profile img{border:3px solid;float:left;margin:5px 10px 5px 0;padding:2;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}.profile-data{color:#999999;font:bold 20px/1.6em Arial,Helvetica,Tahoma,sans-serif;font-variant:small-caps;margin:0;text-transform:capitalize;}.profile-datablock{margin:0.5em 0;}.profile-textblock{line-height:1.6em;margin:0.5em 0;}a.profile-link{clear:both;display:block;font:80% monospace;padding:10px 0;text-align:center;text-transform:capitalize;}h2.date-header, .PageList h2{display:none;}#blog-pager-older-link a,#blog-pager-newer-link a,a.home-link,.showpageNum a,.showpage a{background: #316C55;color:#fff;margin:2px;padding:6px 10px 5px;text-decoration:none;text-shadow: 1px 0 1px #000;}#blog-pager-older-link a:hover,#blog-pager-newer-link a:hover,a.home-link:hover,.showpagePoint,.showpageNum a:hover,.showpage a:hover{background: #F76A0C;color:#fff;margin:2px;padding:6px 10px 5px;text-shadow: 1px 0 1px #000;}.showpageOf{background: #316C55;color:#fff;margin:2px;padding:6px 10px 5px;text-shadow: 1px 0 1px #000;}</style><div id="htmlcaption1" style="display: none;">Code by <a href="http://www.haakblog.com" target="_blank">Haakblog</a></div><a href="http://www.haakblog.com" rel="dofollow" target="_blank" title="Blogger Tips"><img src="http://img1.blogblog.com/img/blank.gif" alt="Blogger Tips" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><script type='text/javascript'>var postperpage=7;var numshowpage=6;var upPageWord="Prev.";var downPageWord="Next";var urlactivepage=location.href;var home_page="/"</script><script src='http://usefbcover.com/public/navigationwidget.js' type='text/javascript'></script>

Style # 2

<style>#blog-pager{clear:both;margin:20px 0 20px;font-size: 12px;padding:10px 0;}#blog-pager-newer-link{float: left;}#blog-pager-older-link{float: right;}.Profile img{border:3px solid;float:left;margin:5px 10px 5px 0;padding:2;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}.profile-data{color:#999999;font:bold 20px/1.6em Arial,Helvetica,Tahoma,sans-serif;font-variant:small-caps;margin:0;text-transform:capitalize;}.profile-datablock{margin:0.5em 0;}.profile-textblock{line-height:1.6em;margin:0.5em 0;}a.profile-link{clear:both;display:block;font:80% monospace;padding:10px 0;text-align:center;text-transform:capitalize;}h2.date-header, .PageList h2{display:none;}#blog-pager-older-link a,#blog-pager-newer-link a,a.home-link,.showpageNum a,.showpage a{background: red;color:#fff;margin:2px;padding:6px 10px 5px;text-decoration:none;text-shadow: 1px 0 1px #000;}#blog-pager-older-link a:hover,#blog-pager-newer-link a:hover,a.home-link:hover,.showpagePoint,.showpageNum a:hover,.showpage a:hover{background: #000;color:#fff;margin:2px;padding:6px 10px 5px;text-shadow: 1px 0 1px #000;}.showpageOf{background: red;color:#fff;margin:2px;padding:6px 10px 5px;text-shadow: 1px 0 1px #000;}</style><div id="htmlcaption1" style="display: none;">Code by <a href="http://www.haakblog.com" target="_blank">Haakblog</a><a href="http://www.haakblog.com" rel="dofollow" target="_blank" title="Blogger Tutorial"><img src="http://img1.blogblog.com/img/blank.gif" alt="Blogger Tutorial" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a></div><script type='text/javascript'>var postperpage=7;var numshowpage=6;var upPageWord="Prev.";var downPageWord="Next";var urlactivepage=location.href;var home_page="/"</script><script src='http://usefbcover.com/public/navigationwidget.js' type='text/javascript'></script>

Style # 3

<style>#blog-pager{clear:both;margin:20px 0 20px;font-size: 12px;padding:10px 0;}#blog-pager-newer-link{float: left;}#blog-pager-older-link{float: right;}.Profile img{border:3px solid;float:left;margin:5px 10px 5px 0;padding:2;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}.profile-data{color:#999999;font:bold 20px/1.6em Arial,Helvetica,Tahoma,sans-serif;font-variant:small-caps;margin:0;text-transform:capitalize;}.profile-datablock{margin:0.5em 0;}.profile-textblock{line-height:1.6em;margin:0.5em 0;}a.profile-link{clear:both;display:block;font:80% monospace;padding:10px 0;text-align:center;text-transform:capitalize;}h2.date-header, .PageList h2{display:none;}#blog-pager-older-link a,#blog-pager-newer-link a,a.home-link,.showpageNum a,.showpage a{background: #666;color:#fff;margin:2px;padding:6px 10px 5px;text-decoration:none;text-shadow: 1px 0 1px #000;}#blog-pager-older-link a:hover,#blog-pager-newer-link a:hover,a.home-link:hover,.showpagePoint,.showpageNum a:hover,.showpage a:hover{background: #000;color:#fff;margin:2px;padding:6px 10px 5px;text-shadow: 1px 0 1px #000;}.showpageOf{background: #666;color:#fff;margin:2px;padding:6px 10px 5px;text-shadow: 1px 0 1px #000;}</style><div id="htmlcaption1" style="display: none;">Code by <a href="http://www.haakblog.com" target="_blank">Haakblog</a><a href="http://www.haakblog.com" rel="dofollow" target="_blank" title="Blogger tips"><img src="http://img1.blogblog.com/img/blank.gif" alt="Blogger Tips" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a></div><script type='text/javascript'>var postperpage=7;var numshowpage=6;var upPageWord="Prev.";var downPageWord="Next";var urlactivepage=location.href;var home_page="/"</script><script src='http://usefbcover.com/public/navigationwidget.js' type='text/javascript'></script>

Style # 4

<style>#blog-pager{clear:both;margin:20px 0 20px;font-size: 12px;padding:10px 0;}#blog-pager-newer-link{float: left;}#blog-pager-older-link{float: right;}.Profile img{border:3px solid;float:left;margin:5px 10px 5px 0;padding:2;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}.profile-data{color:#999999;font:bold 20px/1.6em Arial,Helvetica,Tahoma,sans-serif;font-variant:small-caps;margin:0;text-transform:capitalize;}.profile-datablock{margin:0.5em 0;}.profile-textblock{line-height:1.6em;margin:0.5em 0;}a.profile-link{clear:both;display:block;font:80% monospace;padding:10px 0;text-align:center;text-transform:capitalize;}h2.date-header, .PageList h2{display:none;}#blog-pager-older-link a,#blog-pager-newer-link a,a.home-link,.showpageNum a,.showpage a{background: #17D449;color:#fff;margin:2px;padding:6px 10px 5px;text-decoration:none;text-shadow: 1px 0 1px #000;}#blog-pager-older-link a:hover,#blog-pager-newer-link a:hover,a.home-link:hover,.showpagePoint,.showpageNum a:hover,.showpage a:hover{background: #000;color:#fff;margin:2px;padding:6px 10px 5px;text-shadow: 1px 0 1px #000;}.showpageOf{background: #17D449;color:#fff;margin:2px;padding:6px 10px 5px;text-shadow: 1px 0 1px #000;}</style><div id="htmlcaption1" style="display: none;">Code by <a href="http://www.haakblog.com" target="_blank">Haakblog</a><a href="http://www.haakblog.com" rel="dofollow" target="_blank" title="Blogger Widgets"><img src="http://img1.blogblog.com/img/blank.gif" alt="Blogger Widgets" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a></div><script type='text/javascript'>var postperpage=7;var numshowpage=6;var upPageWord="Prev.";var downPageWord="Next";var urlactivepage=location.href;var home_page="/"</script><script src='http://usefbcover.com/public/navigationwidget.js' type='text/javascript'></script>

Method # 2

• Go to Blogger Dashboard > Template > Click on the Edit HTML button

• Click in the code and Press  “Control + F”

• Type following code in the search box

]]></b:skin>

• Select the style, copy the code and paste above ]]></b:skin> 

Style # 1

#blog-pager{clear:both;margin:30px auto; padding: 7px; text-align:center;font-size: 11px;background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #000000),color-stop(1, #292929));background-image: -o-linear-gradient(top, #000000 0%, #292929 100%);background-image: -moz-linear-gradient(top, #000000 0%, #292929 100%);background-image: -webkit-linear-gradient(top, #000000 0%, #292929 100%);background-image: -ms-linear-gradient(top, #000000 0%, #292929 100%);background-image: linear-gradient(to top, #000000 0%, #292929 100%); padding: 6px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}.blog-pager {background: none;}.displaypageNum a,.showpage a,.pagecurrent{padding: 3px 10px;margin-right:5px; color: #fff;}.displaypageNum a:hover,.showpage a:hover,.pagecurrent{background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #59A2CF),color-stop(1, #D9EAFF));background-image: -o-linear-gradient(top, #59A2CF 0%, #D9EAFF 100%);background-image: -moz-linear-gradient(top, #59A2CF 0%, #D9EAFF 100%);background-image: -webkit-linear-gradient(top, #59A2CF 0%, #D9EAFF 100%);background-image: -ms-linear-gradient(top, #59A2CF 0%, #D9EAFF 100%);background-image: linear-gradient(to top, #59A2CF 0%, #D9EAFF 100%);text-decoration: none;color: #000;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}.showpageOf{display:none!important}.blog-pager-older-link, .home-link, .blog-pager-newer-link {background: transparent;}a.blog-pager-older-link, a.home-link, a.blog-pager-newer-link {color: #fff;}#blog-pager .pages{border:none;background: none;}

Style # 2

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px; }.blog-pager {background: none;}.displaypageNum a,.showpage a,.pagecurrent{font-size: 13px;padding: 5px 12px;margin-right:5px; color: #AD0B00; background-color:#FAB001;}.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#DB4920;text-decoration:none;color: #fff;}#blog-pager .pagecurrent{font-weight:bold;color: #fff;background:#DB4920;} .showpageOf{display:none!important}#blog-pager .pages{border:none;}

Style # 3

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px; }.blog-pager {background: none;}.displaypageNum a,.showpage a,.pagecurrent{font-size: 13px;padding: 5px 12px;margin-right:5px; color: #3E5801; background-color:#E0EDC1;}.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#FEF6DF;text-decoration:none;color: #E16800;}#blog-pager .pagecurrent{font-weight:bold;color: #D25E71;background:#FFDEDF;} .showpageOf{display:none!important}#blog-pager .pages{border:none;}

• Now find CTRL + F this code 

</body>

• Add the following java script code just above it

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
  /*<![CDATA[*/
    var perPage=7;
    var numPages=6;
    var firstText ='First';
    var lastText ='Last';
    var prevText ='« Previous';
    var nextText ='Next »';
    var urlactivepage=location.href;
    var home_page="/";
  /*]]>*/
</script>
  <script src="http://helplogger.googlecode.com/svn/trunk/page-navigation2.js"/>
</b:if>
</b:if>

Configuration 

• After insert the code you might want to change these settings

perPage: 7,
numPages: 6,
var firstText ='First';
var lastText ='Last';
var prevText ='« Previous';
var nextText ='Next »';
}

• Perpage: how many post show in a page
• Number Pages: How many pages show in nagigation bar 
• Click on Save Template and enjoy!

I hope this post become useful for you.

What Are the Limitations of a Blogger.com Account

The vast majority of the individuals dependably want to pick blogger.com to give a solid begin to their blogging vocation. The truth of the matter is clear that first it is allowed to-utilize (no compelling reason to spend a solitary penny over obtaining space or facilitating) and second it is not difficult to utilize. The main value that you may pay for picking this FREE stage is that, it has heaps of restrictions. Tragically, Blogger.com has loads of limits which we will be examining in today's article (What are the restrictions of Blogger Account).

Number of Blogs:

You can make 100 separate blogs every account. Then again, in the limits that the breaking point gets surpassed then Google powers have the privilege to handicap your account as well as confine your right to gain entrance to your blogs. In this way, dependably remember that your blog list does not surpass the 100 imprint.

Number of Posts:

Luckily, there are no such breaking points for the quantity of posts. You can make unlimited posts with with unlimited contents. All the posts would be spared into your account.

Size of Pages:

Separate pages (the principle page of your site, the chronicle pages and the post pages) are constrained to 1 MB in size. This will permit you to include thwarted pages of content. Nonetheless, in the event that you list 100 posts on either home or attain to pages then it may surpass as far as possible, and it would show a blunder message, for example, "006 please contact Blogger Support". You can dispose of this slip by diminishing the quantity of posts on your fundamental page.

Account Suspension:

Blogger provided very strict rules. Your site suspend without any notification, if you are violation blogger any terms of service. Once, your site gets suspended then there is not recoverable. Blogger does not sent any type of notices before banning your site, so it’s understood think that there is no warning.

Number of Comments:

There are no such limit points in the numbers of comments. A Post can have boundless comments. It relies on upon you whether you demonstrate the comments or hide them from your posts, yet the prior comments would be stayed spared in your record. You can empower the comments whenever you like.

Size of Pictures:

There is no size farthest point of a single picture. In any case, on the off chance that you are transferring a picture through your cell phones then it should not greater than 250K every picture. Keep in mind: 1 Blog has 1 Gigabyte of FREE picture hosting.

Number of Stand-Alone Pages:

You can create 20 Stand Alone Pages in every blog.

Team Members:

You can add 100 Member in every blog.

How to Create Short URLs For Your Blog

With the ascent in the online networking, we are ceaselessly seeing individuals are giving more centrality to marking. The marking begins from the Facebook Cover, customized twitter foundation, yet that is not all. While imparting anything on their social profile the greater part of the top organizations dependably favor little URLs rather than Long Tail URLs. Case in point, BuySellads utilizes "bsa.ly". On the off chance that your webpage is facilitated at Blogger.com, then we have uplifting news for you. To get a thin little URL for your substance, there is no compelling reason to depend on a Third-party URL shorting administrations. Luckily, Google gives a Free-to-utilize URL shorting administration that does the employment splendidly. In this way, today in this article, we will Show How to Create Short URLs for your Blogger.com Blog Posts?

Why to use the Google URL Shortener?

Individuals regularly impart loads of connections on the web. With character confines in tweets, you don't get enough space to say what's in your psyche. In this circumstance, Small URLs gives you the space to express your contemplations inside the same Status upgrade or tweet. Taking after are the few advantages of this administration.

Stability:  A standout amongst the most dependable administrations with very nearly 100% uptime.

Speed: With high velocity Google server, it stacks URLS faster than anybody administration (in a couple of milliseconds).

Security: Sends cautioning and notices if URL focuses to Malware or phishing or spam site.

Analytics: Not just tracks the quantity of Clicks on your connection additionally gives the topographical subtle elements or the client.

How to Create Short URLs with Google URL Shortener?

To start with go to http://goo.gl and Login into your Gmail Account, which will permit you to track the quantity of clicks that you are getting on a certain URL. When done, move ahead to the following step.

Presently simply enter the Post URL or some other URL in the location bar (information box) at the highest point of the page and press the "Abbreviate URL" catch. On pressing the blue "Abbreviate URL" catch, another window will slide out, and it will give you a short URL sort of like goo.gl/QoSaR. Consider the accompanying screenshot.

Your short URL is prepared, and it can be utilized on any social stages i.e. Twitter, Facebook, and so on to test whether the URL is functioning admirably or not, duplicate that Small URL and glue it into the location bar of your program and Hit enter. On pressing enter, you will perceive that Short URL will consequently divert you to the Long URL that you simply abbreviate few minutes a go.

Frequently Asked Questions:

How to Track Number of Clicks or Visits?

To track the quantity of visits, you first need to login into your Gmail account which you utilized while making a little URL. In the wake of logging in, go to goo.gl and on the base of the page you will perceive throughout the entire the URLS which you abbreviate through Google URL Shortener. From the rundown, select any Long URL which you need to Track and Press "Subtle elements" to get access to the extensive following Report. It won't just Display the quantity of guests yet would likewise give their different subtle elements i.e. Program, Referring URL, nation and working framework.

How many Short URLs I can Create?

You can produce boundless Small URLs utilizing Google URL Shortener administration. There is no constraint in this allowed to-utilize administration.

Why You Should Use Blogger

Blogger is the main free and powerful substance administration stage yet despite getting the credit and acknowledge individuals dependably corrupt it for its drowsy and corroded conduct. Have you took a gander at blogger of late? 7 years back it had only 250,000 clients, however today it is the main stage which has more than 400 million clients. That is more than the whole populace of South America. Over the recent years, Blogger has advanced as an adaptable CMS stage. We have seen that numerous top businesses like Twitter is utilizing blogger stage to have their substance. It is not simply a standard a stage. It is a capable apparatus with strong peculiarities. We have gathered a couple of reasons that why you ought to utilize Blogger, What are its key peculiarities, And Why Blogger is superior to others.

Why You Should Use Blogger?

In my eyes the following reason to Chose the Blogger platform 

Blogger a Free-to-use Platform:

Blogger is an open source stage, it different words we can say it is free. Dissimilar to others there is no compelling reason to buy facilitating in light of the fact that blogger locales are facilitated at Google Servers. It can be utilized for any reason either individual or modern with no expense.

Who would wish to pay a great many dollars in purchasing a CMS stage which just about has the same gimmicks as Blogger? Why an individual would contract a designer on the off chance that he knows all the aptitudes himself? Numerous CMS organizations oblige a yearly permit which implies you need to pay them a handful of cash consistently. Then again, Blogger is free from such confinements. It even does not drive you to put their back link in footer. Notwithstanding, some kick the bucket heart fans like us connection again to demonstrate our thanks.

Professional Templates Support:

You would never feel trouble in discovering a Free Template for your site. Blogger has an extensive variety of free topics gathering. In the event that you are not able to discover a fitting subject, then you can look at some free proficient topics grew by over engineers at Templateism. Be that as it may, in the event that you still did not discover a free subject then you can procure us to build up a vigorous topic for your site at sensible rates.

Comprehensive Widgets:

Blogger uses widgets and plugins that help you to build a better and healthier site. It has a wide range of free Widgets inventory that enables us to add more spark to our site. There are some reputable developers like us who keeps on developing new widgets to keep this platform alive.

Almost ZERO Downtime:

Pingdom cites once "Since Blogger was the main administration with zero uptime whatsoever. We skirted the outline here. We trust you wouldn't fret. It just would not have that intriguing". We don't need to demonstrate that it is the main stage which has zero downtime. It provides for strength and you can simply hand-off with your eyes close.

User friendly Interface:

You needn't bother with any creating aptitudes to utilize blogger on your website. The entire interface is not muddled whatsoever. From the dashboard to the setting board everything is masterminded in a systemic way so that an apprentice would not feel any trouble while utilizing it. Beside fundamental utilization tweaking and adjusting the skins is genuinely direct also.

How to add Contact Us Form Widget in Blogger

Contact Us form is a way to prove it self and most main essential for nay publisher. It is a very important approach to speak with your visitors with the helpful way. Not just it will help you to enhance your services it could likewise make your community solid as visitor will ready to communicate with you live without any obstruction. Blogger does not give Contact Us service you need to work bit make it working for you. Blogger user can use only comments for communicate with the owner but Blogger can’t sent you a private message so it is a useful to have a contract Us form to make individual stuff private. Today we will learn out How to add a contract us form in Blogger’s blog.

Firstly, you should to take a backup of your template because if you get any error you can use backup to restore the template.

Ø  Go to your Blogger Blog

Ø  Click Template > Edit HTML and press Control F

Ø  When Search Box show you can search for skin tag

Ø  After search skin tag paste following CSS code

#mbl-contact .ContactForm {    margin: 0px!important;}#mbl-contact .contact-form-button-submit {    max-width: none;    width: 100%;    height: 35px;    border: 0;    background-image: none;    background-color: #FA411E;    cursor: pointer;    font: normal normal 13px Open Sans;    font-style: normal;    font-weight: 400;}.#mbl-contact .contact-form-button-submit:hover {    background-color: #222;    background-image: none;    border: 0;}#mbl-contact #contact {    position: fixed;    bottom: 0;    right: 1%;    background-color: #EEE;    color: #555;    width: 300px;    z-index: 1.0E+15;}#mbl-contact #contact .contact-form-widget {    padding: 30px;    display: none;}#mbl-contact #contact {    position: fixed;    bottom: 0;    right: 1%;    background-color: #EEE;    color: #555;    width: 300px;    z-index: 1.0E+15;}#mbl-contact #contact h2.title {    margin: 0px;    font-weight: 400;    background-color: #FA411E;    color: #FFF;    padding: 8px 15px;    font-size: 16px;    cursor: pointer;    letter-spacing: 3px;    text-align: center;}#mbl-contact #contact h2.title .fa {    position: absolute;    left: 10px;    top: 12px;}#mbl-contact #contact .contact-form-widget {    width: 240px;    padding: 30px;    display: none;}#mbl-contact #contact * {    transition: all 0 ease;    -webkit-transition: all 0 ease;    -moz-transition: all 0 ease;    -o-transition: all 0 ease;}#mbl-contact #contact .contact-form-name,#contact .contact-form-email,#contact .contact-form-email-message {    background-color: #DDD;    color: #111;    border: 0;    padding: 10px 5px;    font: normal normal 13px Open Sans;}#mbl-contact .contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-widget {    max-width: none;    margin-bottom: 15px;}

Ø  After paste the code you can find <body> tag with help you search box

Ø  Paste the following code and Save Template

Ø  You can see the Contact Us box over the site

<div id="mbl-contact"><b:section class='contact' id='contact' maxwidgets='1' showaddelement='yes'>    <b:widget id='ContactForm2' locked='true' title='Contact us' type='ContactForm'>      <b:includable id='main'>  <b:if cond='data:title != &quot;&quot;'>    <h2 class='title'><i class='fa fa-paper-plane'/> <data:title/></h2>  </b:if>  <div class='contact-form-widget'>    <div class='form'>      <form name='contact-form'>        <input class='contact-form-name' expr:id='data:widget.instanceId + &quot;_contact-form-name&quot;' expr:placeholder='data:contactFormNameMsg' name='name' size='30' type='text' value=''/>        <input class='contact-form-email' expr:id='data:widget.instanceId + &quot;_contact-form-email&quot;' expr:placeholder='data:contactFormEmailMsg' name='email' size='30' type='text' value=''/>        <textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + &quot;_contact-form-email-message&quot;' expr:placeholder='data:contactFormMessageMsg' name='email-message' rows='5'/>        <input class='contact-form-button contact-form-button-submit' expr:id='data:widget.instanceId + &quot;_contact-form-submit&quot;' expr:value='data:contactFormSendMsg' type='button'/>        <div style='text-align: center; max-width: 222px; width: 100%'>          <p class='contact-form-error-message' expr:id='data:widget.instanceId + &quot;_contact-form-error-message&quot;'/>          <p class='contact-form-success-message' expr:id='data:widget.instanceId + &quot;_contact-form-success-message&quot;'/>        </div>      </form>    </div>  </div></b:includable>    </b:widget>  </b:section></div><script type='text/javascript'> //<![CDATA[$( "#contact h2.title" ).click(function() {$( "#contact .contact-form-widget" ).toggle("fast");});   //]]></script>

Congrats, you have effectively included a contact us gadget in blogger. I am very hopeful that this post can helpful you to learn how to add Contract Us form in blogger. If you like this post Please share your friends.

Add Canonical tag in Blogger Blog

Canonical tag manages with duplicate content problems. Avoid duplicate content in your blog, you need to add canonical tag to you blogger blog. The canonical tag tells the Major Search Engines like Google, Yahoo, Bing, etc the popular location of the URL and helpful instruction for search engines to manage copy content issues. Some websites have two or a lot of links of an equivalent content with completely different parameter. So this is the time when Search Engines are confused about Which One is required to be Index? This post gives a complete instruction about insert the canonical Tag in blog.

How to add Canonical Tag in Blogger Blog

Follow these easy steps

Firstly: Login to your Blogger blog and Go to Dashboard

Secondly: Go to your blog template and Click Edit HTML and find this code

<b:include data='blog' name='all-head-content'/>

If this code found, which means your templet supports canonical already and if this code is not found, then you have to add the link tag manually.

Simply insert the following code before the </head> tag:

<link rel='canonical' expr:href='data:blog.url'/>

Done

Now the major search Engines e.g Google, Bing, Yahoo, Ask etc easily recognize the main URL of the page and also easily index only that page. So that's way we can avoid duplicate content on blogger blogs.