How To Add Animated Flash Clock To Your Blogger Blog

Hi friends, today i'm gonna show you how to add animated flash clock gadget your blog. A clock gives a beautiful look to a website. A clock is a must for a personal homepage, forum, blog etc.Isn’t it exciting when you get a highly quality flash Clock absolutely Free? you can add this flash animated clock your blog easily. it's really faster and cool. all you have to do is follow the instructions given below.. let's go to work.and Congrats you!! I hope you like the clocks  Feel free to ask anything in the comment box below' we will meet again in next post.Thank you.

1.Login to your blogger Dashboard and go to Desing --> Page Elements.

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the one of code given below



1. Clicking Digital Clock 

<object><param name="movie" value="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-33.swf"><embed src="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-33.swf" width="150" height="150" wmode="transparent"> </embed></object>

2. Rotating Silver Clock

<object><param name="movie" value="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-11.swf"><embed src="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-11.swf" width="150" height="150" wmode="transparent"> </embed></object>

3. Black Outline Clock

<object><param name="movie" value="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-24.swf"><embed src="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-24.swf" width="150" height="150" wmode="transparent"> </embed></object>

4. Simple Clock

<object><param name="movie" value="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-23.swf">
<embed src="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-23.swf" width="150" height="150" wmode="transparent"> </embed></object>

5. White Clock

<embed src=http://flash-clocks.com/free-flash-clocks-blog-topics/free-flash-clock-175.swf width=200 height=200 wmode=transparent type=application/x-shockwave-flash></embed>

6. Black Clock

<embed src=http://flash-clocks.com/free-flash-clocks-blog-topics/free-flash-clock-179.swf width=200 height=200 wmode=transparent type=application/x-shockwave-flash></embed>

7. Clicking Out Digital Clock

<embed src=http://flash-clocks.com/free-flash-clocks-blog-topics/free-flash-clock-152.swf width=200 height=200 wmode=transparent type=application/x-shockwave-flash></embed>

8. 3D Clock

<embed src=http://flash-clocks.com/free-flash-clocks-blog-topics/free-flash-clock-169.swf width=200 height=200 wmode=transparent type=application/x-shockwave-flash></embed>

9. House Clock

<embed src=http://flash-clocks.com/free-flash-clocks-blog-topics/free-flash-clock-150.swf width=200 height=200 wmode=transparent type=application/x-shockwave-flash></embed>

10. Black Cool Clock

<embed src=http://flash-clocks.com/free-flash-clocks-blog-topics/free-flash-clock-165.swf width=200 height=200 wmode=transparent type=application/x-shockwave-flash></embed>

4. Now Click On Save 'JavaScript' You are done.


Special Thanks http://flash-clocks.com
Picture From http://www.2dayblog.com/2009/10/19/manual-digital-clock/

How To Add Page Popularity and Top popular pages widget

Hey! bloggers you know we have a popular post widget to find popular posts in our blog. but you know we have a gadget to find a popular posts in our website/blog. no. dont worry! today i'm explain you how to add popular pages finder gadget to blogger sidebar! this gadget similer to popular post. i hope you really like this gadget! if you like this gadgte please read following steps to know how to add this gadgte to your blog. and thank you for visitng my blog.we will meet again in next post..

1.Log in to your dashboard-->Design- -> Edit HTML

2.Click on "Expand Widget Templates

3.Scroll down to where you see this

Add Page Popularity Widget

Paste the below code just after
<p><data:post.body/></p>


<img expr:src='"http://foxrecord.appspot.com/rating?url=" + data:post.url + "&amp;title=" + data:post.title' />




Add Top popular pages widget

Paste the below code just after 

<p><data:post.body/></p>

<script src="http://foxrecord.com/scripts/gettop.js" type="text/javascript"></script>

4.Click on "Save Templates" and you are done.

How To Add Animate Scrolling Text on Your Browser Title Bar

Hi! how day! here is the another new javascript gadget.. " How to add animated scrolling text to browser title bar" i think this is very cool gadget.. so many visitors amazing see this gadget!!! please read the below information and add this gadget to your blog today... so this is very cool gadget to decorate your blog look.. try this today!! thanks!

1.Login to your blogger dashboard--> Desing- -> Edit HTML

2.Scroll down to where you see <head> tag

3.Copy below code and paste it just before the <head> tag

<script type='text/javascript'> 
//<![CDATA[
msg = "Type Your Text Hear";
msg = " .................................. " + msg;pos = 0;
function scrollMSG() {
document.title = msg.substring(pos, msg.length) + msg.substring(0, pos); pos++;
if (pos > msg.length) pos = 0
window.setTimeout("scrollMSG()",200);
}
scrollMSG();
//]]>
</script>

4.Now Click on "Save Templates" Now your Done

Picture from http://www.blogger.com

How To Add “Save Page as PDF” button to Blogger blog

Hey! here is the other important gadget for blogs. many blog reader download your useful post to his/her blog. so this is very hard work. but this gadget help you download posts using pdf file type. this gadget us provided us a site. site name is web2pdf.com this tool is very useful for blog readers. steps are below. i hope you really like this site and post. so add your comments here and share this post with your friends.we will meet again in next post,thank you!

1.First Sign up with Web2PDF

2.Now Configure your "Save Page as PDF" button and click "Generate the JavaScript" button.

3.Then a Javascript code will be generated. Copy This code.

Now follow these simple steps :

1.Log in to your dashboard--> Design -> Edit HTML

2. Click on "Expand Widget Templates"

3. Scroll down to where you see this: <data:post.body/> tag:


4. Immediately after above line, paste the code which you have generated at the Web2Pdf Online website. It's look like below code:


<!-- START: PDF Online Script -->
<script type="text/javascript">
var authorId = "XXXXXXXX-XXXX-XXXX-XXX-XXXXXXX";
var pageOrientation = "0";
var topMargin = "0.5";
var bottomMargin = "0.5";
var leftMargin = "0.5";
var rightMargin = "0.5";
</script>
<script type="text/javascript" src="http://web2.pdfonline.com/pdfonline/pdfonline.js">
</script>
<!-- END: PDF Online Script -->



5. Click on "Save Templates" and Refresh your site.

How to Add 125 by 125 Ad Banner For Blogger

Many bloggers add a ad system to his/her blog for get more traffic from websites. are you know how to do this or how to add like that ad system to blogger. in this tutorial i'm gonna show you how to add 125x125 ad banner system to blog. it's very cool gadget and has a very cool look. so please try this gadget to get more traffic from various country and various websites.. thanks for watching my tutorial. happy traffic for your blog.

1.Login to your blogger Dashboard and go to Desing --> Page Elements.

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the one of code given below and click save.

<div align="center">
<table bgcolor="#000000" border="0" cellpadding="2" cellspacing="6" width="265">
<tbody><tr>
<td><center><a href="YOUR ADS URL HEAR" rel="nofollow" target="_blank"><img alt="AD DESCRIPTION" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoJzu2VctNif-ROcwBwncuJtkBP1cT4B8sBuGmXQNGh1gQ4Ji4L8NQeRen9IWq1XYbItHys_oV45xZwboJGgT6lZ4gIJ4jrR8n_086rI5Orc_8ezeof_8tN9oDVoa5zqS9aPM-d18h88M/" border="0" height="125" width="125" /></a></center></td>
<td><center><a href="YOUR ADS URL HEAR" rel="nofollow" target="_blank"><img alt="AD DESCRIPTION" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoJzu2VctNif-ROcwBwncuJtkBP1cT4B8sBuGmXQNGh1gQ4Ji4L8NQeRen9IWq1XYbItHys_oV45xZwboJGgT6lZ4gIJ4jrR8n_086rI5Orc_8ezeof_8tN9oDVoa5zqS9aPM-d18h88M/" border="0" height="125" width="125" /></a></center></td>
</tr>
<tr>
<td><center><a href="YOUR ADS URL HEAR" rel="nofollow" target="_blank"><img alt="AD DESCRIPTION" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoJzu2VctNif-ROcwBwncuJtkBP1cT4B8sBuGmXQNGh1gQ4Ji4L8NQeRen9IWq1XYbItHys_oV45xZwboJGgT6lZ4gIJ4jrR8n_086rI5Orc_8ezeof_8tN9oDVoa5zqS9aPM-d18h88M/" border="0" height="125" width="125" /></a></center></td>
<td><center><a href="YOUR ADS URL HEAR" rel="nofollow" target="_blank"><img alt="AD DESCRIPTION" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoJzu2VctNif-ROcwBwncuJtkBP1cT4B8sBuGmXQNGh1gQ4Ji4L8NQeRen9IWq1XYbItHys_oV45xZwboJGgT6lZ4gIJ4jrR8n_086rI5Orc_8ezeof_8tN9oDVoa5zqS9aPM-d18h88M/" border="0" height="125" width="125" /></a></center></td>
</tr>
</tbody></table>
</div>

Note: Replace Your Ad URL , Your Ad DESCRIPTION , Your Ad BANNER URL

Now Your Done..

How To Add a Floating Back To Top Button for Blogger

H! Friends` today i'm gonna give you another cool trick for you.. it' is a  Floating Back To Top button. are you know what is the floating back to top button mean.. Once added the Button Will float down the page as the reader scrolls n reset at the foot of the page until needed. here we will use image back to top button.  you can change it picture anytime..please read the following steps in below.. i hope you like this widget!! thankyou..

1.Log in to your Dashboard--> Desing- -> Edit HTML

2.Click on "Expand Widget Templates"

3.Scroll down to where you see this

</body>

4.Copy below code and paste it just before the </body> tag

<a href='#' style='position: fixed; bottom:5px;Right:5px;' title='Back To Top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk6rHA0qJ4Hd9iUM2_pElcy3ie-_UJkCyHzsbTQLAipwS09dRBuZPNC_YAzhwq09gA18Ccqe2D1dahyOwYkP_3a8T8XOf5vn2k_w6xpYdLF7dotUkyAxPrDTNwjhForyuVrOc2fIyBejU/' style='border: none;'/></a>

Note: Change the name as you like, And Change the image as you like,

5. Now Save Template, You are Done

Picture from http://icons.mysitemyway.com/free-clipart-icons/1/blogger-logo-icon-id/125732/style-id/907/matte-white-square-icons/social-media-logos/

How To Add Recent Comments Widget For Blogger Blog

 How To Add Recent Comments Widget For Blogger Blog

Dear friends, today i'm gonna show you how to add recent comments widget to blogger. this widget similar to recent posts widget! this widget show you your blog recent comments in sidebar. i hope you like this cool widget. and please share this post with your friends..we will meet with next post...thank you.

1.Log in to your dashboard--> layout- ->Page Elements

2.Click on Add a Gadget. Select HTML/Javascript.

3.Select the whole code given below and paste it in the widget box you have just opened above.

<script style="text/javascript">
function showrecentcomments(json) {
var numcomments = 5;
var showcommentdate = true;
var showposttitle = true;
var numchars = 100;
for (var i = 0; i < numcomments; i++) {
var entry = json.feed.entry[i];
var alturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
alturl = alturl.replace("#", "#comment-");
var postlink = alturl.split("#");
postlink = postlink[0];
var linktext = postlink.split("/");
linktext = linktext[5];
linktext = linktext.split(".html");
linktext = linktext[0];
var posttitle = linktext.replace(/-/g," ");
posttitle = posttitle.link(postlink);
var commentdate = entry.published.$t;
var cdyear = commentdate.substring(0,4);
var cdmonth = commentdate.substring(5,7);
var cdday = commentdate.substring(8,10);
var monthnames = new Array();
monthnames[1] = "Jan";
monthnames[2] = "Feb";
monthnames[3] = "Mar";
monthnames[4] = "Apr";
monthnames[5] = "May";
monthnames[6] = "Jun";
monthnames[7] = "Jul";
monthnames[8] = "Aug";
monthnames[9] = "Sep";
monthnames[10] = "Oct";
monthnames[11] = "Nov";
monthnames[12] = "Dec";
if ("content" in entry) {
var comment = entry.content.$t;}
else
if ("summary" in entry) {
var comment = entry.summary.$t;}
else var comment = "";
var re = /<S[^>]*>/g;
comment = comment.replace(re, "");
document.write('<br/>');
if (showcommentdate == true) document.write('On ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday + ' ');
document.write('<a href="' + alturl + '">' + entry.author[0].name.$t + '</a> commented');
if (showposttitle == true) document.write(' on ' + posttitle);
document.write('<br/>');
if (comment.length < numchars) {
document.write('<i>');
document.write(comment);
document.write('</i>');}
else
{
document.write('<i>');
comment = comment.substring(0, numchars);
var quoteEnd = comment.lastIndexOf(" ");
comment = comment.substring(0, quoteEnd);
document.write(comment + '...<a href="' + alturl + '">(more)</a>');
document.write('</i>');}
document.write('<br/>');
}
document.write('<br/>');
}
</script>
<script src="http://YOURBLOG.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments">
</script>




Note : Replace "http://YOURBLOG.blogspot.com" with Your blogspot URL.


4. Now Click Save and Refresh Your site.

How To Add Top Commentators Widget for Blogger

Hi! dear visitors here is cool gadget! this post similer to how to add top blog authors widget. so this post explain you how to add top commenters widget to your blog sidebar. i think you really like this gadget! you can organize a sport on your blog using this gadget! so you like add this top commentators eidget for your blogge, please follow the simple steps below to do it and share this post with your friends using social bookmarking! Thank you.

1.Log in to your dashboard--> Design- ->Page Elements

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the code given below and click save.

<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ol>');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
if(obj.value.items[i].link == "")
var item ="<li>" + obj.value.items[i].title + "</li>";
else
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ol>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=2f414149ab66e0892a6a179016f93019&url=http%3A%2F%2Fyourblog.blogspot.com&num=10&filter=" type="text/javascript"></script>



Note : Remember to replace yourblog with your blog name.Do not include http://

You are done.

Picture From: http://www.online-money-maker.org/backlink-heaven-with-top-commentators-plug-in.html

How To Add Total Posts And Comments Widget For Blogger

How To Add Total Posts And Comments Widget For Blogger

Every bloggers like to know how many comments in their blogs.. but it's very hard to count comments. so today i'm gonna give you  cool total comments & total posts reader to your blog. You can use this widget to promote your blog in other blogs too. Simply follow the steps given below. it’s too easy to add it and it takes less than 1 minute, i hope you like this gadget! read below steps to add this gadget!!!..

1.Login to your blogger Dashboard and go to Desing --> Page Elements.

2.Click on 'Add a Gadget' on the sidebar.

3.Copy and past below code to your javascript.

<script style="text/javascript"> 
function totalPosts(json) { 
document.write('Total Posts: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>'); 
} 
function totalComments(json) { 
document.write('Total Comments: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>'); 
} 
</script> 
<script src=" /feeds/posts/default?alt=json-in-script&callback=totalPosts"></script> 
<script src=" /feeds/comments/default?alt=json-in-script&callback=totalComments"></script>

4.Now Click on "Save Java Script" You are done..

How To Add Blogger New Future "Follow by Email" Gadget to Blogger

How To Add Blogger New Future "Follow by Email" Gadget to Blogger



1.Login to your blogger dashboard and go to Desing --&-- Page Elements.

2.Click on 'Add a Gadget' on the sidebar.

3.Select "Follow by Email" (New).

4.Now Add it..

Here Result..

Now You are done...

How To Add The Facebook Like Or Recommend Button For Blogger / Below Every Post

fHi `friends Facebook has come up with a new set of Social plugins which enable you to provide engaging social experiences to your users with just a line of HTML. The Facebook Like Button is One of them.so if you like to add this new Facebook  like button to your blog..please follow step by step below to do it.

How To Add The Facebook Like Or Recommend Button For Blogger / Below Every Post

1. You first generate the facebook code using the options below

Demo:

Button Type                    Standard Button CountBox Count

Text on the Like Button   Like Recommend

Color Scheme                 Light Dark

Font                                arial lucida+grandesegoe+ui tahoma trebuchet+ms verdana

Float                               Left Right None

Location                         Below the Post Content Above the Post Content

Display                           On Post pages only EverywhereEverywhere other than Static Pages

<b:if cond='data:blog.pageType == &quot;item&quot;'><div><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/></div> 
</b:if>

2. Now you Copy the Above code.

3.Log in to your dashboard--> Desing- -> Edit HTML

4.Click on "Expand Widget Templates"

5.Scroll down to where you see <data:post.body/>  tag.

6. Now immediately after that place the copied code.

7.Now save your template and you are done.

Cheers.!


Source

How To Add New Mouse Cursor to Your Blogger

How To Add New Mouse Cursor to Your Blogger



1.Log in to your Dashboard--> Design- -> Edit HTML

2.Click on "Expand Widget Templates"

3.Scroll down to where you see this </head> tag

4.Copy below code and paste it just before the </head> tag

<style type="text/css">body, a, a:hover {cursor: url(http://bloggertrickandtoolz.googlecode.com/files/www.bloggertricksandtoolz.com-newcur.cur), progress;}</style>

5.Save Your Template and you are done..

Cheers..

Special Thanks

How To Add JavaScript Popup windows to Blogger

1.Login to your Bogger Dashboard and go to Design >> & Page Elements.

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the one of code given below

<script type="text/javascript">
<!--
function myPopup2() {
window.open( "YOUR URL HERE", "myWindow", 
"status = 1, height = 300, width = 300, resizable = 0" )
}
//-->
</script>
</head>
<body>
<form>
<input type="button" onClick="myPopup2()" value="POP2!">
</form>
<p onClick="myPopup2()">Click This</p>

Note: Replace YOUR URL HERE with your pop up windows link

4. Now Click on Save "Html Java Script" and You are done..

How To Add JavaScript Popup windows V2 to Blogger

How To Add JavaScript Popup windows V2 to Blogger

1.Login to your Bogger Dashboard and go to Design >> & Page Elements.

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the one of code given below

<script type="text/javascript">
<!--
function myPopup2() {
window.open( "YOUR URL HERE", "myWindow", 
"status = 1, height = 300, width = 300, resizable = 0" )
}
//-->
</script>
</head>
<body>
<form>
<input type="button" onClick="myPopup2()" value="POP2!">
</form>
<p onClick="myPopup2()">Click this</p>

Note: Replace YOUR URL HERE with your pop up windows link

4. Now Click on Save "Html Java Script" and You are done..

How To Add Cool Time Clock Javascript to Blogger

How To Add Cool Time Clock Javascript to Blogger

1.Login to your Bogger Dashboard and go to Design >> & Page Elements.

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the one of code given below

<script type="text/javascript">
<!--
var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()
if (minutes < 10){
minutes = "0" + minutes
}
document.write(hours + ":" + minutes + " ")
if(hours > 11){
document.write("PM")
} else {
document.write("AM")
}
//-->
</script>

4. Now Click on Save "Html Java Script" and You are done..

How To Add Hide TextArea Scrollbox to Blogger

How To Add Hide TextArea Scrollbox to Blogger

1.Login to your Bogger Dashboard and go to Design >> & Page Elements.

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the one of code given below

<textarea rows="20" cols="40" style="overflow:hidden;">
Hello This is Hide TextArea Scrollbox 
</textarea>
<p style="font-family:verdana,arial,sans-serif;font-size:10px;"></p>

Note: Replace Hello This is Html Color Scroll Box with your text or anything.

4. Now Click on Save "Html Java Script" and You are done..

Cheers

How To Add Google Pageran Checker With Buttons

How To Add Google Pageran Checker With Buttons

1.Login to your dashboard--> Desing- ->Page Elements

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the code given below and click save.

<script src="http://www.mypagerank.net/services/pagerankbutton/servicepr_js.php"></script>

Now you are done.

How To Add Google Bot Last Visit Checker to Blogger

How To Add Google Bot Last Visit Checker to Blogger

1.Login to your dashboard--> Desing- ->Page Elements

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the code given below and click save.

<script src="http://www.mypagerank.net/services/gbla/servicegbla_js.php">

Now you are done.