Add Customize Google +1 Button in Blogger

We have the Google+1 Button Widget in blogger , but with this tricks that helps you to change the standard of Google +1 Button to be smaller , bigger that depends on you.

Google +1 Button in Blogger

Here is the instruction how to install it :

Step 1 : Blogger Dashboard -> Template -> Edit HTML
Step 2 : Search for this code

</head>

Step 3 : Paste this code below above </head>

<script type="text/javascript" src="http://apis.google.com/js/plusone.js"> {lang: 'en-US'} </script>
Step 4 : Click on " Expand Widget Templates " and search for this code :

<data:post.body>

Step 5 : Paste the code below above it 

<div style='float:left'>
<g:plusone size="standard" expr:href="data:post.url"/>
</div>
  • You can display it to "left" and "right" by adjusting left
  • You can change standard to medium, small or tall. Choose the size that may blend your template.
Tall, small, Medium Respectively:
imageimage
image
Step 6 : Save it and enjoy your template

Recent Comments Widget For Blogger

There are many tricks to add the recent comments widget for blogger, today i would like to show you the easy way to do it without any adding HTML code in your template.

Here is the instruction to install the recent comments widget:

Step 1 : Blogger Dashboard -> Layout -> Add a Widget -> Feed

Recent Comments Widget For Blogger

Step 2 : Add your feed URL to this Feed like the link below

 http://YOURSITE.blogspot.com/feeds/comments/default

Recent Comments Widget For Blogger
  
Step 3 : Click " Continue "

Recent Comments Widget For Blogger

Step 4 : Change the title of the widget such as " Lastest Comments or Recent Comments " .

That blogger tutorials is very easy to set up and hope you like this tips. 

Adding Random Banner Widget in Blogger


Random banner widget is the best way to promote your blog content or to promote your advertisements on your blog.....every time your visitor will see a random banner of your post/advert on your blog.....


Now you just follow these blogger tutorials to set it up:

Step 1 : Blogger Dashboard go to " Layout " and " Add a widget "
Step 2 : Select " HTML/Javascript"
Step 3 : Paste these code below in this widget 

<script language="JavaScript"> 
images = new Array(3);
images[0] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-1' border='0' height='60px' width='468px' ></a>";
images[1] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-2' border='0' height='60px' width='468px' ></a>";
images[2] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-3' border='0' height='60px' width='468px' ></a>";
index = Math.floor(Math.random() * images.length); 
document.write(images[index]); 
</script>


Now Change URL OF ADVERTISER with your links and  URL OF BANNER’S IMAGE-1/2/3 with your images.
You can also change height and width of pics by chaning  height='60px' width='468px' . 
You can also add more banners by changing the script 



Blogger Tutorials from Hardeep Asrani ( http://widcraft.blogspot.com )

How to Add a Comment Counter to Disqus in Blogger ?

If you prefer not to use Blogger’s default commenting system you can use another commenting platform instead such as Disqus. Although it ranks as one of the popular ones out there, it still has its own shortcomings, one of which is the lack of a counter.

Many Disqus users admit that one the things they wish they had is the counter, which helps them keep track of the number of comments.
How to Add a Comment Counter to Disqus in Blogger

Fortunately, there’s a hack to fix this and Hammad Baig ( admin of Techtutshub ) was nice enough to share and post a quick short tutorial on how you can add a counter to your Disqus comments.

Follow the instructions below and be sure to back up your template to be on the safe side.

Step 1 : From your Blogger dashboard go to ‘Template’
Step 2 : Then  ‘Edit HTML’ Click on the ‘Expand Widget Templates’ box to put a check mark in it
Step 3 : Search for this line of code inside your template by pressing ‘Ctrl+F’

<div class='post-header-line-1'/>
 
Step 4 :  Copy/paste this below and immediately after it

<!-- Disqus Comment Count Start-->
<a class='dsq-comment-count comment-link commentslink' 
expr:href='data:post.url + &quot;#disqus_thread&quot;'/> 
<!--Disqus Comment Count End-->
  
Step 5. Save your template and that’s it!

Now you should have the number of comments displayed just below the post’s title, right next to the date.

Via Allblogtools