Which One Is Better?? Wordpress Or Blogger???

Are you confused with which blogging platform to choose to start your blogging career? The major blogging hosting platforms are no doubt Blogger and WordPress. Now to judge which one is better I have written a detailed comparison chart below that will be of great help in making a smart decision.

Note:- I am not an employee of either Blogger or WordPress. The below chart is solely my personal research.

WordPress VS Blogger Comparison Chart 

FEATURES	BLOGGER	WORDPRESS	WHO WON?
Template Customization	Offers Free Layout/Style Sheet Customization	No style sheet customization. Payment required	Blogger
Tutorials/Help	Innumerable Tutorials on Blogger Tricks	Hardly some	Blogger
Number of un-official Themes	Innumerable Designers Creating Free Templates each day	Few Designers Involved in offering free templates	Blogger
Coding Used	Uses user friendly scripting and coding i.e HTML, XML, CSS	Uses advance scripting like php that few can understand	Blogger
Dashboard Interface	Highly user friendly. Easy to navigate.	Complicated Interface with hectic navigation	Blogger
Default Template Collection	Limited Collection Of Default templates mostly un-professional	Over 70+ high quality Templates	WordPress
Template/Theme Replacement	Default Template can be replaced by a more free professional template	No template change allowed	Blogger
Widgets	Innumerable Official and Un official Widgets available	Limited Official widgets available. Rarely few un- official gadgets available.	Blogger
Comments	No commenting editing. Moderation allowed. No Spam protection. No user friendly comment form	Comments can be edited and moderated. Spam protection available. User friendly comment form	WordPress
SEO, Optimization	Though Owned by Google, no favoritism. Manual optimization is required	Owned by a private party. Meta Tags Plugins used. Easy To optimize	Both
Blog Privacy	You can limit access to your blog to 100 Authors and 100 readers. All must be Google account holders.	You can limit access to your blog to 35 Wordpress account holders. Posts can be password protected or Private.	Blogger
Comment restriction	You can restrict comments to Google account holders, Open ID users or Any one (includes Anonymous)	Comments can not be restricted. Anyone can comment	Blogger
Blog Import	Only from one BlogSpot blog to another	A Blog can be imported from another WordPress blog or from Blogger, Yahoo! 360, LiveJournal and Movable Type and TypePad	WordPress
Posts and Comment Notification	Authors and subscribers can be notified of latest posts and comments via Email	Same here	Both
Comment Verification	Asks users to verify if they are humans using a 4-6 digit code	Does not asks for any verification. More spam effected	Blogger
Video Storage Limit	Unlimited with Google Video and an upload limit of 16GB	Just 3GB. More space on upgrade.	Blogger
Image storage limit	1 Gigabyte With Picasa Web Albums	3 Gigabytes. More space can be gained through upgrade. You can also upload.ppt, .doc, .odt and.pdf files	WordPress
File type Storage	Only allows image uploading	Allows upload of files like .ppt, pdf .doc and .odt files. More file types can be uploaded on upgrading.	WordPress
Blog Stats	Does not have any default stats system. But allows third party tracking scripts.	Has a default visitor stats system that shows statistics for two days only and does not provide detailed stats reports. Does not allow third party tracking scripts.	Blogger
Blog co-partners	100 Google account holders can be added as Administrators or Authors	35 WordPress account holders can be added as Administrators, Editors, Authors or Contributors.	Blogger
Advertisements	Displays no advertisement of its own on your blog.	Displays discreet AdSense advertisements on your blog for small percentage of the page views	Blogger
Posts By Email	Has a Mail-to-Blogger feature which turns any email account into a blog-posting application	Posts can be published using emails	Both
Post Feed On Mobile Phones	Supported	Not Supported	Blogger

Conclusion

When choosing a blogging service three things are most important than anything else which are,

1. Template Editing
2. Huge Image Storage Capacity
3. Huge Video Storage Capacity

Believe it or not Blogger has all these three features and is undoubtedly a blessing to millions of teenagers and people from other classes who can’t afford to pay online. The Template editing feature of Blogger is one of its best feature. Within a year of blogging a guy like me who didn’t even know what CSS, HTML, XML meant, is now playing with codes day and night. Blogger made my life meaningful and interesting and will surely be a blessing to you too. Blogger is surely the best free Blogging Service available in Blogosphere if equipped with a good web hosting service.

Thanks to MyBloggerTricks.com For this Wonderful Post.

How to Create a Sitemap or Table of Contents in Blogger

One of the limitations of a blog is that it doesn't have an index or sitemap of the site that could make it easier for readers to find content that they are searching for.
While the blog archive and labels have all the information about the published post, these do not appear on a single page completely, so searching for more posts is not always easy.

Luckily, this gadget will help you to add a table of contents or sitemap on Blogger showing the index of all posts separated by categories that have been published. It will also show the latest posts with a text saying New!

Demo: You can see it working by clicking here.

How To Add a Sitemap with a List of Posts to Blogger

To implement it on your blog, follow the steps below:

Step 1. Login to your Blogger Dashboard and select your blog

Step 2. Go to Pages > click the New Page button and select Blank page 

Step 3.  Click on the HTML tab and paste the following code inside the empty box:

 <style>
p.labels a{color: #242424; text-transform: uppercase;font-size: 15px;}
a.post-titles {color: #0000FF;}
ol li{list-style-type:decimal;line-height:25px;}
</style>
<script>
//<![CDATA[
var postTitle=new Array();var postUrl=new Array();var postPublished=new Array();var postDate=new Array();var postLabels=new Array();var postRecent=new Array();var sortBy="titleasc";var tocLoaded=false;var numChars=250;var postFilter="";var numberfeed=0;function bloggersitemap(a){function b(){if("entry" in a.feed){var d=a.feed.entry.length;numberfeed=d;ii=0;for(var h=0;h<d;h++){var n=a.feed.entry[h];var e=n.title.$t;var m=n.published.$t.substring(0,10);var j;for(var g=0;g<n.link.length;g++){if(n.link[g].rel=="alternate"){j=n.link[g].href;break}}var o="";for(var g=0;g<n.link.length;g++){if(n.link[g].rel=="enclosure"){o=n.link[g].href;break}}var c="";if("category" in n){for(var g=0;g<n.category.length;g++){c=n.category[g].term;var f=c.lastIndexOf(";");if(f!=-1){c=c.substring(0,f)}postLabels[ii]=c;postTitle[ii]=e;postDate[ii]=m;postUrl[ii]=j;postPublished[ii]=o;if(h<10){postRecent[ii]=true}else{postRecent[ii]=false}ii=ii+1}}}}}b();sortBy="titleasc";sortPosts(sortBy);sortlabel();tocLoaded=true;displayToc2();document.write('</br><div class="sitemap-link"><a href="http://helplogger.blogspot.com/2013/12/add-sitemap-table-of-contents-to-blogger.html" style="font-size: 10px; text-decoration:none; color: #5146CD;">Get This Widget</a></div>')}function filterPosts(a){scroll(0,0);postFilter=a;displayToc(postFilter)}function allPosts(){sortlabel();postFilter="";displayToc(postFilter)}function sortPosts(d){function c(e,g){var f=postTitle[e];postTitle[e]=postTitle[g];postTitle[g]=f;var f=postDate[e];postDate[e]=postDate[g];postDate[g]=f;var f=postUrl[e];postUrl[e]=postUrl[g];postUrl[g]=f;var f=postLabels[e];postLabels[e]=postLabels[g];postLabels[g]=f;var f=postPublished[e];postPublished[e]=postPublished[g];postPublished[g]=f;var f=postRecent[e];postRecent[e]=postRecent[g];postRecent[g]=f}for(var b=0;b<postTitle.length-1;b++){for(var a=b+1;a<postTitle.length;a++){if(d=="titleasc"){if(postTitle[b]>postTitle[a]){c(b,a)}}if(d=="titledesc"){if(postTitle[b]<postTitle[a]){c(b,a)}}if(d=="dateoldest"){if(postDate[b]>postDate[a]){c(b,a)}}if(d=="datenewest"){if(postDate[b]<postDate[a]){c(b,a)}}if(d=="orderlabel"){if(postLabels[b]>postLabels[a]){c(b,a)}}}}}function sortlabel(){sortBy="orderlabel";sortPosts(sortBy);var a=0;var b=0;while(b<postTitle.length){temp1=postLabels[b];firsti=a;do{a=a+1}while(postLabels[a]==temp1);b=a;sortPosts2(firsti,a);if(b>postTitle.length){break}}}function sortPosts2(d,c){function e(f,h){var g=postTitle[f];postTitle[f]=postTitle[h];postTitle[h]=g;var g=postDate[f];postDate[f]=postDate[h];postDate[h]=g;var g=postUrl[f];postUrl[f]=postUrl[h];postUrl[h]=g;var g=postLabels[f];postLabels[f]=postLabels[h];postLabels[h]=g;var g=postPublished[f];postPublished[f]=postPublished[h];postPublished[h]=g;var g=postRecent[f];postRecent[f]=postRecent[h];postRecent[h]=g}for(var b=d;b<c-1;b++){for(var a=b+1;a<c;a++){if(postTitle[b]>postTitle[a]){e(b,a)}}}}function displayToc(a){var l=0;var h="";var e="Post Title";var m="Click to sort by title";var d="Date";var k="Click to sort by date";var c="Category";var j="";if(sortBy=="titleasc"){m+=" (descending)";k+=" (newest first)"}if(sortBy=="titledesc"){m+=" (ascending)";k+=" (newest first)"}if(sortBy=="dateoldest"){m+=" (ascending)";k+=" (newest first)"}if(sortBy=="datenewest"){m+=" (ascending)";k+=" (oldest first)"}if(postFilter!=""){j="Click to view all"}h+="<table>";h+="<tr>";h+='<td class="header1">';h+='<a href="javascript:toggleTitleSort();" title="'+m+'">'+e+"</a>";h+="</td>";h+='<td class="header2">';h+='<a href="javascript:toggleDateSort();" title="'+k+'">'+d+"</a>";h+="</td>";h+='<td class="header3">';h+='<a href="javascript:allPosts();" title="'+j+'">'+c+"</a>";h+="</td>";h+='<td class="header4">';h+="Read all";h+="</td>";h+="</tr>";for(var g=0;g<postTitle.length;g++){if(a==""){h+='<tr><td class="entry1"><a href="'+postUrl[g]+'">'+postTitle[g]+'</a></td><td class="entry2">'+postDate[g]+'</td><td class="entry3">'+postLabels[g]+'</td><td class="entry4"><a href="'+postPublished[g]+'">Read</a></td></tr>';l++}else{z=postLabels[g].lastIndexOf(a);if(z!=-1){h+='<tr><td class="entry1"><a href="'+postUrl[g]+'">'+postTitle[g]+'</a></td><td class="entry2">'+postDate[g]+'</td><td class="entry3">'+postLabels[g]+'</td><td class="entry4"><a href="'+postPublished[g]+'">Read</a></td></tr>';l++}}}h+="</table>";if(l==postTitle.length){var f='<span class="toc-note">Show All '+postTitle.length+" Posts<br/></span>"}else{var f='<span class="toc-note">Show '+l+" posts by category '";f+=postFilter+"' the "+postTitle.length+" Total Posts<br/></span>"}var b=document.getElementById("toc");b.innerHTML=f+h}function displayToc2(){var a=0;var b=0;while(b<postTitle.length){temp1=postLabels[b];document.write("<p/>");document.write('<p class="labels"><a href="/search/label/'+temp1+'">'+temp1+"</a></p><ol>");firsti=a;do{document.write("<li>");document.write('<a class="post-titles" href="'+postUrl[a]+'">'+postTitle[a]+"</a>");if(postRecent[a]==true){document.write(' - <strong><span style="color: rgb(255, 0, 0);">New!</span></strong>')}document.write("</li>");a=a+1}while(postLabels[a]==temp1);b=a;document.write("</ol>");sortPosts2(firsti,a);if(b>postTitle.length){break}}}function toggleTitleSort(){if(sortBy=="titleasc"){sortBy="titledesc"}else{sortBy="titleasc"}sortPosts(sortBy);displayToc(postFilter)}function toggleDateSort(){if(sortBy=="datenewest"){sortBy="dateoldest"}else{sortBy="datenewest"}sortPosts(sortBy);displayToc(postFilter)}function showToc(){if(tocLoaded){displayToc(postFilter);var a=document.getElementById("toclink")}else{alert("Just wait... TOC is loading")}}function hideToc(){var a=document.getElementById("toc");a.innerHTML="";var b=document.getElementById("toclink");b.innerHTML='<a href="#" onclick="scroll(0,0); showToc(); Effect.toggle(\'toc-result\',\'blind\');">?? Display Table of Contents</a> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-66TQxHyluvFf_DcNOS_pz10mzNo8EpU1XVJQB-wYaONt475qFAfignGwW6uTOBlAohjJ9GwNlNIuu95-lrzUVQm-UcBISjdzmsqyIBPZUnEd8P2aTixRwLlgsjbp6SHSHcoYEIKSJxIX/s1600/new_icon.gif"/>'}function looptemp2(){for(var a=0;a<numberfeed;a++){document.write("<br>");document.write('Post Link : <a href="'+postUrl[a]+'">'+postTitle[a]+"</a><br>");document.write('Read all : <a href="'+postPublished[a]+'">'+postTitle[a]+"</a><br>");document.write("<br>")}};
//]]>
</script>
<script src="http://chili-pie.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=bloggersitemap"></script>

After adding the above code, replace http://chili-pie.blogspot.com with the address of your blog.

Customization:

- to change the color and font size of categories title, replace the values in Blue
- to change the color of the links, replace the value in green

Step 4. Click Options on the right side and select Don't allow (hide existing) for the reader's comments

Step 5. Finally, click the Publish button and View the page.

That's all!

The index of the posts is sorted alphabetically and is updated automatically each time a new post is published.

How to Remove Or Disable Lightbox Image View From Blogger

Blogger has officially announced that the lightbox image view has been implemented on all blogger blogs. When you click an image it opens up with a large transparent black frame around it, exactly the same way photos are displayed on your Google+ account when clicked.

While for some, this feature is an awesome improvement to how pictures are displayed, but for most bloggers users, this addition has caused problems. The blogger help forum is filled with complains by blogger users, demanding that this feature must be removed and others who see it as a bug in the blogger template.

Unfortunately blogger did not offer it as an opt-in feature. The problem with this addition is that images on a blog post don’t show up enlarged when clicked, as the way they showed up before the changes were made by blogger.

Until blogger address this issue, here is a work around by Mark from EnglishJavaDrinker that removes the lightbox affect.

To implement the code, simply head to:

Dashboard > Template > Edit HTML and find the </head> tag.

Now copy the code below and paste it right before </head>

<script type="text/javascript">
//<![CDATA[
function killLightbox() {
  var images = document.getElementsByTagName('img');
  for (var i = 0 ; i < images.length ; ++i) {
    images[i].parentNode.innerHTML = images[i].parentNode.innerHTML;
  }
}
if (document.addEventListener) {
  document.addEventListener('DOMContentLoaded',killLightbox,false);
} else {
  document.attachEvent('onDOMContentLoaded',killLightbox);
}
//]]>
</script>

Update: You can now simply head over to blogger settings and disable the lightbox option.

The option is available under 

Settings --> Posts and Comments --> Showcase images with Lightbox

Create a Simple Navigation Menu Bar For Your Website/Blog [Beginner]

Creating a basic menu using HTML and CSS is pretty straightforward even for starters. If you're in search for a simple navigation menu bar for your website/blog, here's all the code you need.

The CSS:

#nav {
   padding:0;
   background: black;
   border-bottom: 1px solid #999999;
   height: 36px;
}
#nav li a {
   font-family: Arial;
   font-size:12px;
   text-decoration: none;
   float:left;
   padding:10px;
   color:white;
   font-weight:bold;
}
#nav li a:hover {
   background:white;
   color:black;
   border-radius: 2px;
   border-bottom: 1px solid white;
}
#nav li {
    display:inline;
}

The HTML:

<ul id="nav"> 
 <li><a href="#">Home</a></li> 
 <li><a href="#">About</a></li>
 <li><a href="#">Services</a></li>
 <li><a href="#">Products</a></li> 
 <li><a href="#">Blog</a></li>
 <li><a href="#">Contact Us</a></li>
</ul>

Simply change the URL to your desired location.

Recover an Accidentally Deleted Post on Blogger

While it may take hours to write a lengthy and well thought out blog post, you never know when you accidentally hit the delete button while saving or modifying your work -- And Poof!, all your previous work is gone.

You my have lost a post that was in draft or a previously published one. Fortunately, in both cases you can still recover or retrieve the post that was deleted unintentionally. There are several ways to do so:

Recovering a Post in draft / Unpublished:

If your post was in draft and got deleted, you need to find its URL:

• Depending on your browser, navigate to the your browser history and start looking for the link to the draft post.

Once you've found, you are most likely to retrieve it. 

Recovering a published post:

If your post was published earlier, you have two places to look for:

    1. Search Engine Cache:

All popular search engines maintain the cache of indexed pages. To access the cache of your blog, enter the following and click the cache button right next to the results.

site:yourblogurl.com

For example: site:chili-pie.blogspot.com

    2. Blog Feeds:

If your blog publishes feeds, subscribe to your own feeds using Google Reader (google.com/reader) or any other similar feed readers and recover your post.

Good Luck!

Add Adsense In the Middle of Posts

Ad placement and customization has been written and discussed much in the webosphere. In fact, a famous heat map detailing the ideal places for a higher click through rate (CTR) has been floating around for quite a few years now. Then, Google also has a dedicated help section outlining the best positions for ads on blogs, forums, and sites covering the news, classifieds and gaming.

For blogs, an ad unit somewhere in the middle of your post can potentially boost your CTR, especially if its a lengthy post with fewer images. Unfortunately, unlike WordPress which has a number of excellent plugins for injecting ads anywhere in your blog, blogger does not have this options.

But thanks to a simple JavaScript solution developed by adsinthemiddle, you can place your Adsense code within a post - anywhere.

Its worth noting that this method does not, by anyway violate the Adsense policies.

1. To Manually Display Ads In The Middle of Selective or Every Post:

Manually inserting Adsense ads in the middle of posts in blogger is pretty simple, here are two easy steps to do so:

• Before proceeding, do backup your template as a precaution.

Step 1: On New Blogger (Post Designer Template):

Find <data:post.body/>. Now, replace it with a parsed copy of the following code:

To parse your HTML, you can use this HTML Parse Tool.

<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>

Note: In the above code, replace <!-- Your adsense code here --> with your actual Adsense code.

Step 2:

Now, where ever you wan't your ad unit to appear, put a special comment:

<!-- adsense -->

Done.