Blogger Limitations

Most of them started blogging career in blogger platform as it is free and no need to invest except time and knowledge.But the blogger has its own limitations to use but it is very simple and not for the newbies as it will be good to know their own limitation and plan the post.

Number of Blog Per Google or Blogger Account

Google Blogger posses some limitation in creating blog,yes you can create a blog in seconds but it should not exceed the limit of 100 blogs.After that google authorities will have wrights to disable you to access you blogs but also they can permanently disable your access to blogger account.You can't access your own blog.So keep track on number of blogs.

Number of Post per Blog

There is no such limitation you can post as much post you want,yes you can even post hundreds of post in a single day,they won't mind it.Those contents will be your blogger account and they will won't be deleted unless you manually delete posts.

Size of Each pages

There is size limitation on bloggers each pages including homepage,post pages,separate pages that should not be more than 1MB limit.In this limit will hold up to few hundred pages of text files,so you need to be worry.

There is an option to make more 100 post in home and archive pages,but it should not exceed that size limit,otherwise it will results in  ERROR: "006 please contact Blogger support" know more about HTTP status codes.You can get rid of those errors by reducing number of posts in those pages.

Number of Comments

There is no limitation in comments for each post,you can have any number of comments per post, but its your wish to show are hide of the comments.But the pre-existing comments will be stored in your blogger account and you can show anytime you want.

Size of Pictures

Picture have no limitations and you can add up any size of the format jpg,jpeg,gif,png etc.But the files upload in mobile and smart phone will have size limit of 250kb.

Length or Size of Each Post

There is no such limitation for blogger about the size of each post but the overall page size should not exceed the 1MB limit.For those it will show an error.

Standalone Pages in Blogger

Blogger has default page (i,e) homepage and can able to add another 19 pages and we can set different priority.These pages can be used to create contact forms like www.blog4al.com/p/contactus.html.

Storage limit for Blogger 

Each blogger account has 1GB storage and images are hosted in picasa but the limit can be exceed by upgrading the picasa account and you can store as much as you can. Upgrade is not free it will cost some dollar.

Label limitation in Blogger

You can create up to 5000 unique labels for a blog and you can add 20 unique label per post.Not more than that is allowed by google's blogger.

Team Members per Blog

Are you allowing guest post or team members then there is limit to add only up to 100 members per blog.

Account Suspension

Google has wide range of strict terms and conditions, when we just tick check box accepting terms and conditions without reading,are you one of that kind? If yes be careful google will suspend the entire account without giving any notification to blog administrator.Even if you have adsense  they had a chance to disable that too.

Read More

Add jquery Back to Top and Move to bottom Blogger widget

Add a smooth scrolling query Back to top and move to bottom Blogger widget which make the blog post with length of post which makes the visitors to scroll down to bottom of the page.This widget will scroll to bottom of the page and top in seconds.This is pretty nice widget that we had already posted back to top with move to comment blogger widget.

Adding jquery Back to top and move to bottom widget CSS

Add the css code for jquery blogger widget that consists of few optimizations to adjust in blogger templates. This widget can be used in both default and custom blogger templates.

• Log in to blogger.
• Then search for ]]></b:skin>
• Then above or before that code paste the below code.

.blog4al_up{
padding:7px;
background-color:white;
border:1px solid #CCC;
position:fixed;
background: white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr31_eknpxFG_wwIq9m_3QG7Qk24NqwocHy74mmM8ozoWIKIX7H409aQXfjAS8RaeIVYtfVZDacx4s9oi9_X92EGOF8o3cxjmfBs6siHDGFUEPdQnie6C1jgtAphysX1zmdms5hskr4Lo/s16/arrow_up.png) no-repeat top left;
background-position:50% 50%;
width:20px;
height:20px;
bottom:280px;
right:5px;
white-space:nowrap;
cursor: pointer;
border-radius: 3px 3px 3px 3px;
opacity:0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
.blog4al_down{
padding:7px;
background-color:white;
border:1px solid #CCC;
position:fixed;
background: white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDZJ5TBViHTrn7DeOEIBb2xSqPrHHODMBLODJEoTeLf6Eba_5rMTEs8uhwUyFTizPbz5DrUVJMGDJ0cOrimW-S1nc39ccYpchuZx_NA0TSJWBUvaXVCvgFlstaid2s5XnLZxHi-W0_mIM/s16/arrow_down.png) no-repeat top left;
background-position:50% 50%;
width:20px;
height:20px;
bottom:242px;
right:5px;
white-space:nowrap;
cursor: pointer;
border-radius: 3px 3px 3px 3px;
opacity:0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}

Adding jquery Back to top and move to bottom widget script

Now we had added the widget css, now to add the jquery script to blogger template.This script is very simple and doesn't affect the loading time of the page.

• Now search for </body>
• Then add the below code above that code.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
<div class='blog4al_up' id='blog4al_up' style='display:none;'/>
<div class='blog4al_down' id='blog4al_down' style='display:none;'/>
<script src="https://blog4al.googlecode.com/files/jquery-back-to-top-and-bottom.js">
/* blog4al jquery blogger widget for Back to top and move to bottom*/
</script> 

• Now save the template.

Now you can see a back to top and move to bottom widget blogger widget.Have any trouble comment it below?

Read More

Create custom 404 Error Page for Blogger

Customize blogger 404 Error page in blogger with information and back link to home page or to sitemap - Blogger sitemap table of contents page.This helps the visitor to continue in your website until what the searched in for.This option is available for all blogger blogs to customize error page or redirection.This nothing but a page appears when user clicks on the broken which doesn't exist in the blog or website of won domain.Here we provide the bloggers custom 404 page in two different styles.You can opt it which matches your style.

Design 404 Error Page in Blogger - CSS

• This provide a link to previous page of your blog.
• A link to home page.
• Then a link to contact Blogger Administrator.

We already have an option in blogger to customize the error page for broken links which we need to optimize for better appearance. 

1. Log in to blogger.
2. Then settings > search preferences
3. Then click edit link in custom page not found.
4. Then inside the box paste the below codes.

style 1

<div class='b4l-404-box'>
 <p align='center'>
 <span style="color: red; font-family: Georgia, 'Times New Roman', serif;"><span style="font-size: 150px; line-height: 18px;"><b>404</b></span></span></p>
 <p align='center'><span style="color: #0080ff; font-family: Georgia, 'Times New Roman', serif;">
 <span style="font-size: 150px; line-height: 18px;"><b><br/></b></span></span></p>
  <p align='center'><span style="color: #0080ff; font-family: Georgia, 'Times New Roman', serif;"><span style="font-size: 150px; line-height: 18px;"><b>Error</b></span></span></p>
  <p align='center'>
<br />
  <p align='center'>
<br />
  <p align='center'>
<b><span style="font-size: x-large;">Page Not Found!!!</span></b></p>
<br />
  <p align='center'>
<a href="http://www.blog4al.com"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKkoAHVTCIb9DG0YFUbl8b8un7tp0XUD4R1tsVywegG_GAM0TDDLpgkOzUnavTwwHhnjjTWm85aeQSmNpbLhZcOnAOSV9L9Nd-NolfLNGqC_CIMxYgioOQpTeZTY5CIZ0UGhlorke-R9yi/s1600/home+button+2.jpg" /></a>
<a href="http://www.blog4al.com/p/contactus.html"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHnT9zZ5ESl2272NRB0QUF6SWxVfZXmqm5ukYEOtcNHSZana7NEeoHCqcc2WFBaqap4HHI88_zVNBFQ6zovKV4OJPRfDQ5eZibF1ZctP5TVK3-53zqmhyphenhyphen6VnCA3RjcInH51jFSgfPVqnBt/s1600/contact+button+2.jpg" /></a></p>
You can look at our <a href='http://www.blog4al.com/p/sitemap.html>sitemap</a>
</div>

• For above you can create sitemap from - blogger sitemap table of contents

or

style 2

<div class='b4l-404-box'>
<p style='line-height: 30px'>
<strong>
<font color='#ff0000' size='5'>
Oops!
</font>
<font color='#666666'>
Looks like you either clicked a broken link or a Page that no more exits. Kindly do one of the followings:
</font>
</strong>
</p>
<ol style='line-height: 25px'>
 <li><a href='javascript:history.go(-1)'>&#171; Go Back</a> </li>
 <li>Report the Problem to us by <a href='http://blog4al.com/p/contactus.html'>Clicking Here</a>&#160;&#160;&#160; (<em>This will help us serve you even better</em>) </li>
    <li>Go To Homepage by <a href='http://www.blog4al.com'>Clicking Here</a>
      <br/></li>
  </ol>
  <p>
    <br/>
    <br/>
    <br/></p>
  <p align='center'><font color='#0080ff' style='font-size: 150px'><strong>404</strong></font></p>
  <p>&#160;</p>
  <p align='center'/>
  <p align='center'><font size='5'>Page Not Found!</font></p>
</div>

Now replace the highlighted link with the your own blogger link.Then save the setting now we need to add the css script to the blogger template.

404 error page css code for blogger

•  Now go for template then search for ]]></b:skin>
• Then "below / after" that code add the following code.

You can use any one of above block of code but the css code is to override the default bloggers style of custom page.

<b:if cond='data:blog.pageType == &quot;error_page&quot;'><style type='text/css'>.status-msg-wrap {    font-size: 100%;    margin: none;    position: static;    width: 100%;}.status-msg-border {    display:none}.status-msg-body {    padding: none;    position: static;    text-align: inherit;    width: 100%;    z-index: auto;}.status-msg-wrap a {    padding: none;    text-decoration: inherit;}.b4l-404-box {  background:#FFFFFF;  width:98%;  margin:10px 0px;  padding:20px 10px;  border:1px solid #ddd;  -moz-border-radius:6px;  -webkit-border-radius:6px;  border-radius:6px;  box-shadow: 5px 5px 5px #CCCCCC;}</style></b:if>

• Then now save the template.

Now when ever any user clicks the broken then they will see this page.

Read More

Delete or Rename Label in Blogger

Renaming Blogger labels are used to customize post in a decent structure,they are used as wordpress tags or category format but the only difference is the tags will be included in search results,but the labels won't be added.This cause the wordpress to produce more than one link for the same post.Blogger label are need to customized for two purpose the main is to provide visitor satisfaction then for CSS drop down menu and to create table of contents - sitemap for blogger.This could also help you to keep track of your post.

Delete a Blogger Label in Single Click

If have configured label improperly then no need worry just delete all the labels at a single click,for before i try to delete a label and i didn't found any easy way the only thing did is editing all my post and removing the label.But its more simple in new blogger interface.

Steps to Remove Blogger Label

• Log in to your blogger and posts.
• Then next thing is to select the label which you want to delete or rename.

• Then select the post which you want to delete the label.
• Then select the label drop down box.

• When you hover over the label you can see "Add or remove the label".
• If you click that once it will add the post to that label and if you click the label one it will remove the label from that post.

Renaming the Label for Blogger Post

To rename the blogger label follow the above method to delete the label for selected post.Then add new label (3rd image has option to create new label) after selecting the post which you wants that label name.

Note:

when you try access the renamed label then you will be having 404 page error.

Advantages in Renaming Blogger Label

• Its is completely to make you a structure of the post.
• It gives user a new experience to browse.
• You can add multiple label for same post.
• It has no SEO.

Read More

How to put adsense ads in anywhere of blogger post

Adsense is always being the bloggers target to get earned but there is always a need in blogger how to place the adsense ads in the middle of the post or anywhere on the post.In our last post we had posted how to add anywhere with a javascript but it same simple but if we want to add those code in all post and place ads middle or anywhere in blogger post.

There are few disadvantage as we won't place more ad units by that method,for that we can use the below method as it is simple and don't affect the blog loading time as it use the html elements only.It also has the advantage of placing adsense ads inside the div class.

Adsense ads in anywhere of blogger post

This helps to add adsense ads on any part of the blogger post,but this should be add during the post and for older post you need to add manually.

• While posting a post select the place the post the adsense ads.
• Then complete the post and save the button.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='b4ladsense'>
<br/>
<center>
Place Adsense parsed Code Here 
</center>
<br/>
</div>
</b:if> 

•  Now you want add the parsed adsense ad code to the above - to parse adcode use our adsense adcode parser
• Then replace the place adsense parsed code here with your own parsed code.
• Then style or alignment of the ads in post.
• Either center or left or right.

Then save the code and have a copy in notepad, then copy the code and paste into blog post anywhere in the blog post.

Read More

How to put Adsense in Middle or anywhere on Blogger post

Adsense is the real way of money for bloggers as they have good content with good traffic but it should be place at right place to earn high CPC like middle of the post or at the bottom of the post or elsewhere.To put adsense code in middle of the post you need insert it each time you post.Here is a simple script to post it automatically at the middle of the post.

Put Adsense in Middle or Anywhere in Blogger Post 

• First get the ad code
• Then parse those code through Adsense code parser.
• Then log in to blogger.
• Edit template then expand widget template.
• Then now search for the below code.

<data:post.body/>

If there are more then one occurrance then replace the last one with the below code.

<div expr:id='"aim1" + data:post.id'></div>
<div style="clear:both; margin:10px 0">
<!-- Your AdSense code here -->
</div>
<div expr:id='"aim2" + data:post.id'>
<data:post.body/>
</div>
<script type="text/javascript">
var obj0=document.getElementById("aim1<data:post.id/>");
var obj1=document.getElementById("aim2<data:post.id/>");
var s=obj1.innerHTML;
var r=s.search(/\x3C!-- adsense --\x3E/igm);
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+16);}
</script>

• Replace the with above parsed adcode.
• Then now save the template.

Adding Adsense adcode middle or anywhere in blogger post

Then now add the below code in any post where you want that ad block to be appear in the blog post at any place of the blog post.

<!-- adsense -->

• Then save the post.

Recommendation:
We recommend not to post more then one of this method as it will conflict as same adcode exist more than once in same page.

Read More

How to Activate Comment notification For Blogger

Comment Notification is very important in blogger because comment is very useful to make the visitors to have a chance of contact or a discussion rage.As we had already posted athreaded comments for blogger to make more interactive also to add reply button to blogger comments.Here we add how to activate the comment notification in blogger.

Comment Notification In Blogger

Comment notification in blogger is a option that if any of your visitors of blog comments in any post you will get instant notification of comment details and which post which allow us to make comment moderation in blogger and also to reply instantly.

• Log in to blogger --> settings-->Mobile and email option.

• Then in that click add option in Comment Notification Email?

• In that text area add mail address which you need to receive comment notification.
• Then click save setting at the top of that page.
• That's it you will receive notification whenever someone comment in blog.

Have any trouble comment below?

Read More

Add Reply Link with Reply Button in Blogger Comments

Commenting is to post queries to the post then any visitor post a query then there must be an option to clarify the doubt or query.This option is available in wordpress,forums etc. But now it has also implemented in Blogger,as we had already posted  how make threaded comments in blogger and if your using older templates now you can add this button and make others also to reply and make comments.Visitors will be impressed about the blog if they get reply for their comments.Visitor satisfaction is our first priority as blogger.

Add a Customized "Reply Link" to blogger comments

• Log in to blogger.
• Then click template and edit html.
• Expand widget template
• Backup your blog.
• The add the below code ]]></b:skin>
• Then add the below code above it.

.b4l-replycomments{
background:#ECEAEA;
cursor:pointer;
color:#fff;
margin:5px 0;
float:right;
border:none;
padding:4px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
font:10px sans-serif;
}
.b4l-replycomments:hover{
background:#E7E7E7;
}

You can change the color of the link with color matches your template.

• Change this color code #ECEAEA with new code. 
• To change the hover color #E7E7E7 replace with own.

You can also use our color code generator to get hex code for the color you need.

Now we need to add the reply link or reply button to blogger comments in blogger comment area.So you need to look for the below code add this code.

<dd class='comment-footer'>

or try search for the highlighted code, then above that code paste the below code.

<div class='b4l-replycomments'><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=*******************&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=650,height=650&quot;); return false;'>Reply..</a></div>

• Now replace the *************** with your blog id,which will be an 18 digit code at the address when you logged into that blogger.
• Then save the template.

You will now have reply button and visitors try to reply will click and then comment will open in a blank popup window.We recommend to read how to customize author comment in blogger.

Having any trouble comment below?

Read More