Recent Posts with Thumbnails Widget for Blogger

This post explains how to add Recent Posts widget in Blogger with image thumbnails:

Yesterday, when I was working on my new Magazine style wordpress to Blogger template conversion (I'll release the template tomorrow)
..this idea popped up in my mind. This feature is also requested so many times here.. so, here we go..
After many trial n errors, I finally did it!

Features:
Thumbails to Recent Posts
Comment Count

So, let's see how to install this cool widget in your blog..

1. Sign into Blogger dashboard
2. Go to Layout » Add a gadget » html/javascript

3. Just copy and paste this code..




Explanation:

(Edit the values to fit your blog)

boxwidth - Width of the widgetcellspacing - Space between cells (default one is good)
borderColor - Border color (add the background color of your template to perfectly blend it in the template)
thumbwidth & thumbheight - Width and Height of the thumbnail (default are good)fntsize - Font size of the titleacolor - Color of the titleaBold - you want bold titles? (true or false)
numposts - How many posts you want to show?
home_page : http://schemar-mag.blogspot.com/ (change this to your blog url)
This script is currently hosted in my server ( http://myblogtalk.com/bloggertemplates/js/recentposts_thumbnail.js ).
But, it is STRONGLY Recommended to download the script and upload to your own hosting (google for free javascripts hosts) and replace that url with yours.

4. Last but not the least.. Save the Changes.

That's it guys!

Note : Make sure you selected YES in Settings » Site Feed » Full » Allow Blog Feeds

How to get Free One Way Backlinks to your site

One way backlinks are very critical to any website success. The more one way backlinks pointing to your site, the more your Google Pagerank and the more amount of traffic you will get. This should also increase your sales,etc.
But the thing is.. getting the right and quality one way backlinks from high pagerank sites is not an easy task, and in this article, we'll find out some of the best ways to get free one way backlinks:

1. Try to write as much quality content as you can... that will encourage the readers to link to your site. The more useful, informative content you post, the more likely people are to link it. But, this method can take a while to really pay off because like all the new websites, you don't get much traffic.

2. Write quality articles and submit them to top article directories like ezinearticles and goarticles. The advantage in this is, you'll not only get a backlink from high pagerank directories, but also you'll find that your articles are used on other people's sites with a backlink to your site.

3. Participate in forums,discussion boards that are related to your website's niche and add a link to your site in the signature. Make sure that you write quality posts, don't spam. This will also help you get some decent traffic to your site.

4. There is absolutely nothing wrong to get a backlink from a related blog post you decide to comment on. This is one of the effective way of one way link building especially if you comment often on blogs. Comment on blogs related to your niche with a link back to your site as your signature.. and Again, make sure you never spam.

5. Submit your site link to major, well known web directories. Getting listed in directories related to your site not only bring you tons of targetted traffic, but will also improve your search engine rankings. Some of the popular directories to get listed in are DMOZ directory and Yahoo directory. You can submit your link to both paid and free directories and they worth your time.

Useful Widgets,Add-Ons & Tools for Your Blog,Website

Adding Widgets, Add-Ons & tools to your blog is not just a lot of fun for your blog readers, but can also be very useful and help you to create a community for your blog or even a loyal reader base.

Here's a collection of best and most useful blog widgets or add-ons that can be easily integrated with any website/blog. All these below add-ons are 100% Free and they are very easy to install.

Outbrain Star Ratings Widget: Very eager to know what your readers think about your posts?
Here is a cool star rating widget by Outbrain. The insttallation is very simple,
just follow the step by step instructions on their site.

ShareThis or AddThis : Sharethis or Addthis social bookmarking buttons makes it easy for your visitors to share your content with others. It is a good way to increase your link popularity and publicity. Their nice css dropdown icons reduces the clutter on your pages and eliminates the need to add a different button for each social bookmarking service.


whos.amung.us : This is a real time visitor tracking widget and displays
the number of people currently on your site and what pages they are
reading. You don't need any sign-up's to grab this widget.

Web2PDF Online : With this widget installed, your visitors can easily download
your articles in PDF format with just a click. The downloaded PDF's are
free of any advertising and you can get full access to download stats,etc.

ZOHO Creator: With Zoho Creator, you can create professional online
contact forms/web forums in minutes. The good things about this is
there are no data limits and readers can also upload attachments while
submitting the form.

Google Talk Badge: Google Talk Badge will let your visitors to
chat with you.The badge will active whenever you sign in to
Googletalk. The nice thing is your visitors can chat with you even
if they don't have a google account.

Yahoo Media Player: With this very useful widget, you can easily add a simple media player to your blog which can auto detect mp3 links and create an embedded player. This tool is very useful for especially audio,music blogs.


Cbox: Cbox or Chatbox is a chat widget which can be easily embedded
in any web page. It is free and have many features including message
history, spam blocking,etc. It can be easily customizable to fit your
blog layout.

Google Translate: This widget lets your non-English speaking
visitors to quickly translate your webpage in their native
language with just a single click.

Add Star ratings widget to your blog posts & get instant feed back from the readers

Are you curious about what readers are thinking about your posts? then, you can add this beautiful looking outbrain 5 stars rating button to your blogger,wordpress,typepad,etc.You can also use this ratings button in any webpage.By adding this,you will automatically get the beautiful five stars rating widget just below every post.

This was very simple,easy to use,free and you don't need to register to grab this widget.By adding this widget,you will get instant feedback by your readers.
Most of the visitors feel a bit lazy to write a comments,so with this widget,they will help them and rate your posts as easy as 123.
You can get this rating widget here.Thanks to outbrain for providing this great widget.

List of Popular tracking visitor site

So,here are the good ones:-


Sitemeter.com:This one is one of the Most Popular tracking source.This is as simple as 123. Just create an account,copy the code from your account and paste it in your blog as suggested above.
You have also the option to keep your blog stats PRIVATE.
They will give you the stats on how many pageviews(hits) per day,unique visitors,geolocation of the visitors,how many users online,and much more...As it is simple(not much animation),you site will load as fast as it is before.Stats are updated hourly.
You can setup a Free Account here


Histats.com:Unlike the Sitemeter which is very simple, this site will have very cool and animated counters.


Tracking is updated every 5 minutes.I personally using this site for my blogs.Like Sitemeter,
this is also have the option to keep your site stats PRIVATE.
They will provide Animated graphs about your site visitors and fully animative.
You can register with them here


Statcounter.com:Same here!As in the name,it is a stats counter.It is fast,free,and quick loading.
Invisible tracking is available and no ads on your site.All the stats are in real time and super fast.It is not much animated as histats.com.They will provide pageviews,unique vistors,visitors activity,search engine wars,keyword analysis,and many more..
Register a free counter for your blog here

How to track your blog visitors?

As a new blogger(webmaster),it is always interesting to know how many people are visiting your blog/site,pageviews,where they are coming from,which sites are referring,how many are coming via Search Engines(google,yahoo,etc) and what they are typing in the search engines to visit your site.
These stastistics are very handy interms of improving your blog and it is for FREE

If you search the google,you will find hundreds of sites which will track the visitors of your blog/site.But,some sites will provide more information about your visitors than the others.
So,how to do this?
Here are the best tracking sources interms of the feautures they provide.

Note:One thing is common for all the tracking sites.First you need to register,and provide the necessary information about your blog/website.Next,they will give you a html code and you have to embed it in your blog.
How to do that in blogger?
1.Sign in to your blogger dashboard.
2.Click on the 'layout' link next to your blog name.
3.Click on the "Add a Page element"
4.Select "html/javascript" and past the code they provide and SAVE THE CHANGES.

From then,your blog will be tracked and you can check your blog stats from time to time after logging in to your registrate's website.

How to add background image to blogger header

So, you want to add an image or a picture to your blogger header to give a unique look to your blog.Adding image to header is not a complex one,it is very simple.

Before this,first take a backup of your blog template,so there is a chance to get back to your current template if you made any mistakes.

1.First sign in to your blogger account>Edit html

and scroll down the template till you see the below one and note down the width(sothat, you will have an idea of which image dimensions best fits your blog)

In the above case, my template is minima and the width is 660 px.



2.If you have photoshop or any other tools,crop the picture corretly to 660 px(width).If you don't have photoshop,then you can crop a photo by this free online tool Click here.

3.So, your image is ready now! click the page elements tab again.


Click on the edit button as shown below next to your blog name.


4.And you will go to a window just like the below one.First select,the option whether you want to place the image behind the title and description or insted of title and description.Next,browse for the image and save the changes after the image has uploaded.

5.That's it! Now, your blog has a background image in the header.

How to add "Email Subscription Form" to your blog(blogger,blogspot)

If are a new blogger,you may have seen an email subscrtiption form like the below one in other blogs while browsing.

It is delevered by FeedBurner.When people subscribe,they will recieve a email with your blog posts whenever your blog is updated.It is a very easy thing and make your visitors come back again and again to your blog.

So,Let's see how to add a "Email Subscription form" like that in your blog:

1.First,Sign in to your FeedBurner account.If you don't have a FeedBurner account yet,you can register it here

2.Click on the "My Feeds" link at the top of the page and next ,click on your blog name[look at the below screenshot]

3.Next,Click on the 'Publicize' tab as shown below.

4.Select the "Email Subscriptions" option[look at the left sidebar]

5.Next, you will see like this

Click on 'Activate'

6.If you look at the sidebar now,there are a few more options under the Email Subscriptions column namely Subscription Management,Communication Preferences,Email Branding and Delivery options.Edit them according to your needs.

Now,Click on the Subscription Managemant option and copy the code they provide[see the below *screenshot*]

7.Um............Finally,the last step

Sign in to your blogger dashboard>layout>add a page element>html/javascript

and paste the code and SAVE THE CHANGES.

That's it!..........too long process know? No.Very simple process to do.

hide-disable-remove-blogger navbar from your blog

Learn how to hide,disable or remove the blogger navbar(navigation bar) from your blog.
First,let us see what blogger navbar is:

Blogger navbar allows users to easily navigate to other random blogs and it also has a feauture to search the blogs ,and mark any blog as spam.
So,now you have a clear idea of what really a blogger navbar is.So, why so many people prefer to just remove the navbar inspite of the feautures it has like search,etc.Many people think that, it spoils the look of the blog,especially if your blog has differnet subtitle layout which looks too obvious to see for a visitor.Well, let me come to the actual point on how to disable or hide your blogger navbar.

Below is the step-by-step procedure on how to do it with photos to make it easy to understand.

1.Sign in to your blogger account and click the layout button next to your blog name

2.Next,click the edit html tab as shown in the below picture.

3.Add the below html code as specified in the below picture.

#navbar {
      height: 0px;
      visibility: hidden;
      display: none;
}

4. Save the changes.

Now, you can see your blog without that navbar(this tip can only hides the navbar,it doesn't completely delete it).If you want the navbar to appear again,just remove that code and save the changes.

List Of Popular BLOG DIRECTORIES:

1 Technorati 
  Technorati is the largest blog(weblog) directory currently tracking more than 112.8 million blogs.Join technorati and verify your authorship,then you will be provided with detailed statistics regarding your blog,how many blogs are linking to your blog,(they call it 'authority').It is one of the best blog directory and will send tons of triffic if your blog is regularly updated. 


2 Topblogarea 
 This is another big blog directory which rates and rank the blogs interms of Unique visitors your blog gets.They start the counting from Zero every week, so that even newly submitted blog can have the chance to rank higher in the list.
 
3 Topblogarea:
 This is another big blog directory which rates and rank the blogs interms of Unique visitors your blog gets.They start the counting from Zero every week, so that even newly submitted blog can have the chance to rank higher in the list.

4 Blogtoplist
 Same here,they rank according to the unique hits you get.But,there is a little change, they will give you to place a voting button in your blog.If any visitor votes for your site from your blog,that is equal to 100 unique hits,but there is only one chance per visitor(one IP address) a day.

5 Fuelmyblog
This is a cool weblog resource which is different from the ones we discussed so far.You can vote to other blogs and others vote to you.They will keep the top six blogs(voted the most) on the homepage.You can join their forums, read other blogs content,joining in the compitetions and win prizes,etc.
 
6 MyBloggingarea 
 This is a very good weblog directory which ranks the blogs accoring to the unique visitors they get,brought me so much traffic to my celebrity blog than all the other blog directories.I recommend this.

Submit blogger to blog directories then increase the traffic

Submitting your blog to these directories is a very good thing to do particularly if your blog is very new one with low traffic.
These blog directories have high pageranks than your blog(since your blog is a new one with pagerank Zero).So, if someone searches for a particular keyword,there is more possibility for the blog directory to appear in the results than yours.So,by adding your blog to these directories,the visitors enters these directories containing your articles(when they click the article,they enter your site) and also your blog posts will be indexed little faster.So,submitting your blog to these directories will gain you more traffic.

Here are a few popular visitor tracker websites:

1.Histats(histats.com)
2.Sitemeter(sitemeter.com)
3.Statcounter(Statcounter.com)
So,let me come to the main topic...
Before submitting your blog to these blog directories,my personal suggestion is to create a new email address for this purpose so,your personal emails can't flooded with the emails from the blog directories administrators,etc.)Creating an email is free lol....creat one.

Free Forum Advertising.

well to start back on blogging, Heres a list of Free Advertising Forums where you can market your sites/ blogs for free. As of now this is my current collections, visit this blog more often for updates.

http://www.postyouradforfree.com/
http://www.thefreeadforum.com/
http://www.freeadvertisingzone.com/
http://freetoadvertise.biz/
http://www.workathomebusinessopportunity.com/
http://www.zobox.net/
http://www.freeadvertisingforum4u.com/
http://www.youradvertisingforum.com/
http://www.freeforumadvertising.com/
http://www.freeadsboard.com/
http://forums.digitalpoint.com/
http://freeadvertisingforums.org/
http://www.freeadvertising.com/
http://freeadsforyou.top-site-list.com/
http://www.freeadsplanet.com/
http://ads.forumarena.com/
http://www.freeclassifiedsforum.com/
http://www.freeadzforum.com/
http://www.freeclassifiedadsforum.com/
http://chuckysplace.top-site-list.com/

Directory Listing Site Ranking

Theres a lot of this question flying everywhere, asking if directory listing can hurt ranking or can actually be a help to your site.. Well in my own experience, directory submission is my first choice when im doing Offpage SEO. Because theres a lot of resources already out there, ready and available for you to submit.

Now, directory submission is not just submitting your websites there is also a lot of things you need to consider. Its not about how many huge list of directories you have submitted but its about the quality and proper submission.

This are the methods that i do when im submitting websites to directories.

1. Always check the PageRank of the directories where you want to submit your site, it would not be lower than your Website. If your site is PR 5 then you have to submit it in PR5 and above.

2. It should not be 2 clicks away from the index page where you link will be place.

3. I check the page where my link will be place and make it sure that it was already cached.

4. Make it sure that this directories you have submitted is not a Link Farm.

5. Static page is a plus when submitting your links.

6. NO rel="nofollow" links in the code or meta tags

I will be posting more guides, so please do check more often and also if you want to add something just let me know so that i can credit you on this post.

Adding meta tags to blogger(blogspot) blogs,websites-SEO

If you don't know what meta tags are, and what is the importance of adding meta tags, here is the detailed description on how to add them to your blogger(blogspot) blogs or any website.

Do you know adding meta tags is so important if you want to get more traffic from search engines like google,yahoo,msn,etc,especially the meta description is the most important one.

If you don't know what meta tags are,Meta tags are the tags which describes your site and tells the search engines what your site is all about.Adding meta tags is an important factor in SEO.(Search Engine Optimisation).Meta tags allows search engines to index your web pages more accurately. In other words,Meta tags communicate with the search engines and tells more information about your site and make it index correctly and accurately.
Here is an example.This is what I got when I typed 'Kranthi tips' in the Google Search Engine.


adding meta tags to blogger
As you can observe.'Tips and tricks............' is the meta tags description which I added to my site.

We have to add two meta tags to the head section of the template.One is the Meta description which describes your site and another one is Meta Keywords which tells about your site keywords(what your site is all about)

Here is how to add meta tags to your blogger(blogspot) blog:

1.Sign in to your blogger dashboard>click the 'layout' button[see the screenshot below]
click on the 'layout' link
2.Click on the 'Edit html' tab
click on the 'edit html' tab



3.Add the above code just after this



add the code just like this
Don't forget to add description and keywords.
and save the changes.
IMPORTANT:

Several people were filling with just the keywords in the description.DON'T DO THAT.Google and other search engines will ban your site from the search engines list if you did so.And also,don't repeat the keyword more than 3 times.

That's it!You have sucessfully added the metatags to your blogger(blogpsot) blog.If you want to check whether you added the meta tags correctly or not,just type 'meta tags analyzer tool' in the google and you will find so many sites which can check whether you have added the tags correctly or not.

Video upload icon and the old post editor Blogger

Many bloggers have asked why they cannot upload video via Blogger post editor anymore? Or they ask, what happened to the "filmstrip icon" which I believe is the Blogger video upload icon at the end of the toolbar you see in the screen shot below:



In practically every case, I have found that the reason their "filmstrip icon" disappeared is because they are using the new updated post editor which do not provide for video upload.

The solution is simple. Just go to SETTINGS > BASIC (the Basic tab is the very first "sub-tab" for SETTINGS which you will be in once you click the SETTINGS tab) and scroll to the bottom of the page. There you will see the options to select the new updated post editor or the old post editor:



Select the old post editor, save, go to your post editor and there you will see your "filmstrip icon".

Note: Many also asked after uploading a video via Blogger's video upload icon, where is the video stored, meaning, where is it accessible (like when you upload a video to Youtube, then anyone can view the video or get the embed code at Youtube)? The answer according to a Blogger Employee is, it "disappear into a deep black hole" meaning you will not get anything like uploading to Youtube.

How to embed webpages in blog with iframe

Suppose you want to integrate a website or a particular webpage with your blog. Some possibilities, you may be auctioning some items on eBay and you want your ebay offering in your blog or perhaps you have an Amazon AStore and want to embed the AStore into a post in your blog.

Note: Embedding a webpage in an iFrame in your own blog of website is equivalent to copying that webpage into your own website or blog so it is good to ask permission of that webpage you want to embed. In the example below, I uses my own Amazon's Blogger's AStore Bookshop so there no copyright issue as it is my own webpage.

Exclusive, Integrate Facebook Comments Box For Blogger In Very Easy And Simple Steps – Fixed 2

Step 3. Codes To Add To Your Template.

you must add the following codes to your blogger template to ensure that the comments box will work for your blog in the right way.
and in this step we’ll add the following codes,

• xmlns attribute
• SDK script
• Open Graph protocol tags

• Adding the xmlns attribute :

please go to your blogger account again, and navigate to, layout >> edit html >> and check Expand Widget Templates
then find the following code,

Exclusive, Integrate Facebook Comments Box For Blogger In Very Easy And Simple Steps – Fixed 2

Step 3. Codes To Add To Your Template.

you must add the following codes to your blogger template to ensure that the comments box will work for your blog in the right way.
and in this step we’ll add the following codes,

• xmlns attribute
• SDK script
• Open Graph protocol tags

• Adding the xmlns attribute :

please go to your blogger account again, and navigate to, layout >> edit html >> and check Expand Widget Templates
then find the following code,

 
you’ll find it on the top of your code. second or third line, and after it add the following code, 
 
xmlns:fb='http://www.facebook.com/2008/fbml'
 
 you must type a space before it and after it,
here is an example. 
 
 xmlns:fb='http://www.facebook.com/2008/fbml'  expr:dir='data:blog..............2005/gml/expr'  >
  
Adding the SDK script Code :
 
search for 
 
 
and after it add the following code, 
 

 
 but please don’t forget to change YOUR   APP ID to your app id ( you got it in the previous step ).
 
Adding the Open Graph protocol tags:
 
copy the following code.
 












 
and change the colored text to the following,
Change MY-SITE-NAME with the one you want to appear when a user likes a page. (Gil likes Helping on Facebook)
 
Changehttp://google.com/…/blogger_logo.gif with your blog logo, or remove the all tag if you don’t want it.
 
Change YOUR-APP-ID with your application ID number.
 
Change YOUR-FACEBOOK-PROFILE-ID with your own facebook user profile ID.
 
after making this changes add the above code just before 
 
 
now we finished adding the facebook codes to your template, please don’t touch anything and continue to the next step.
See next post..

Exclusive, Integrate Facebook Comments Box For Blogger In Very Easy And Simple Steps – Fixed

Finally, this is the most waited feature for blogger users, and now it’s available for allblogtools.com visitors only, this is the first and the only tutorial around the web that tells you in really easy steps the integration of facebook comments box and blogger (blogspot) blogs.
now let’s do it, don’t worry, i know that must of you tried to add it to blogger blogs, with no result, but today you’ll see how to add it in really easy steps and it’s 100% working. but please be careful and pay attention for all the details.

This tutorial is updated.

Step 1. Disable Default Comments.

The first thing you should do it to disable blogger default comments. because you don’t want to have 2 comments forms.
go to your blogger account, navigate to settings >> comments
and next to comments field choose Hide, then scroll down and click Save Settings

Step 2. Generate your Facebook App ID.

now you should generate your own facebook app id, it’s really easy and one step process,
just go to this page, facebook developers

then click + Set Up New Application

enter your application name, ( you can type any name )

and check agree and click Create Application

then click on Connect tab (on the left tabs-list) or see the next image.

and fill the following info.
Connect URL : Enter your blog url and you must enter it with an ending dash. (for example: http://myblogname.blogspot.com/) .

Base Domain you must type blogspot.com

then click strong>agree and click Save Changes
on the next page facebook will generate you alot of info. you’ll need only one line, it’s App ID:
just copy it and keep any where, we’ll need it in the next steps. please see the following image to see where you’ll find your facebook App ID:.

To be continued...

Adding a new sidebar to a Blogger template

How to add a new sidebar to a Blogger template is one of the most common questions between the users of the platform for blogs from Google. Adding a second sidebar varies in complexity according to the design in question, so, while some require only a few lines of CSS modification, others will need a total refurbishment that may make it more convenient to change the design.

Broadly speaking the process is as follows:

1. Analyze the structure and style of the template.
2. Adding a new editable area, ie the area to add new gadgets.
3. Modify styles.

To follow this without issues this and any other tutorial that involves making changes in the structure of a blog or website is very advisable to know some html and CSS.
From.BTemplate tutor,

How to Use Classic Blogger Template (HTML) in New Blogger

I love this template and would like to use it on my blog.
only problem is, this error occurs when i try to save changes…

Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The element type “head” must be terminated by the matching end-tag “”.

could you help me rectify it?

If you got the same problem, please read How to Use Classic Blogger template in New Blogger

1. Login to New Blogger with your Google account.
2. On your Dashboard choose blog you want to edit, Click on Layout, you’ll go direct to Template tab where blog you want to Edit.
3. Choose the Template tab of your blog then click on Edit HTML.
4. Next scroll down to the end of your page and choose Revert to Classic Template.
5. Copy all the code of the template you wish and paste it into your blog.
6. Click on SAVE TEMPLATE and you are done!.

How to Use New Blogger Template

How to Use New Blogger Template (XML) in New Blogger

1. Download and Save the .zip file on your hard disk.
2. Extract the .zip file with Winzip or UltimateZIP
2. Go to Blogger Dashboard.

3. Klik on Layout link.
4. Next klik Edit HTML.
5. Browse the XML file you have saved and upload it.

6. Finish

Welcome

Dear all

this is my first Post blogging, let me know if there any trouble or error
iam newbie and will more explore about netting and SEo