HOW TO ADD FACEBOOK COMMENT BOX FOR BLOGGER

Not all folks include a Google or web logger account during which they\'re going to use to discuss your blog. that\'s why some folks use a third party comment plug ins similar to Disqus and Intense discussion. However really folks area unit too lazy to discuss those commenting platform and that i am one in every of those. But, if you have got facebook comment box on your web log, possibilities of comments from your audience can increase as a result of virtually most are on facebook.

ADVANTAGE OF FACEBOOK COMMENT BOX

• More convenient for guests. most of the people whereas water sport the online has their facebook account opened, having this comment box won\'t trouble them sign language up or getting into captcha\'s symbols after they wish to comment.

• It boosts traffic. guests has the choice to post their comments on their profile and once somebody on their profile liked  it, it\'ll seem additionally on their profile page then on.

• Threaded comments. Some blogs has no rib comments on their default blogger comment box. Mistreatment this plug-in can increase spoken language from your daily guests.

• No spam comments.

If you would like to cover your default comment box follow this

1. Login to your blogger account.
2. Than dashboard >>> Template >>> Edit HTML.
3. Don't forget to backup your template first.
4. Check the Expand Widget Templates box.
5. Now find out [ Click (Ctrl and F) Search for ] below code.

<data:post.body/>

(some templates has more than 1 of this if you are using "read more").

6. Copy and paste the code below under the code. If you have 2 of these tags place it on the second of the same code.


<b:if cond='data:blog.pageType == "item"'> <p align='left'> <a href='http://imomniscient.blogspot.com/2012/12/how-to-add-facebook-comment-box-for.html' target='new'><img alt='' class='icon-action' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIe7mvkG_f6CaJvDc91UiNDaLf-NmlqrczqHubOlwngwQ1GsDm4sarA6Jr-IPIODU4LcvIXNKJUF-BuyymrOBK61ZD__NeUU-9aM51lkgM01W_q0s7cF6VyMCwePW4kRLLpUA4-_vHRPA/'/></a></p> <div id='fb-root'/> <script> window.fbAsyncInit = function() { FB.init({appId: '149973631711831', status: true, cookie: true, xfbml: true}); }; (function() { var e = document.createElement('script'); e.async = true; e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js'; e.async = true; document.getElementById('fb-root').appendChild(e); }()); </script> <fb:comments/> </b:if>


7. Save template!

Now check on your web log and you may see a facebook comment box slightly below every of your posts. If you cannot see a comment box then your facebook account should are logged out, strive work in and see your facebook comment box, it'll currently seem.

Enjoy!

read more

Greate Flash Clock Widgets for Blogger / Blogspot

Flash clock Widgets for Blogs are simple and easy to use. Some Clocks with Preview

<object width="150" height="150">
<param name="movie" value="http://www.csalim.com/clocks/226655.swf">
<embed src="http://www.csalim.com/clocks/226655.swf" width="200" height="200">
</embed>
</object>

<object width="150" height="150">
<param name="movie" value="http://www.csalim.com/clocks/985396.swf">
<embed src="http://www.csalim.com/clocks/985396.swf" width="200" height="200">
</embed>
</object>

<object width="150" height="150">
<param name="movie" value="http://www.csalim.com/clocks/189466.swf">
<embed src="http://www.csalim.com/clocks/189466.swf" width="200" height="200">
</embed>
</object>

<object width="150" height="150">
<param name="movie" value="http://www.csalim.com/clocks/633993.swf">
<embed src="http://www.csalim.com/clocks/633993.swf" width="200" height="200">
</embed>
</object>

<object width="150" height="150">
<param name="movie" value="http://www.csalim.com/clocks/118647.swf">
<embed src="http://www.csalim.com/clocks/118647.swf" width="200" height="200">
</embed>
</object>

<object width="150" height="150">
<param name="movie" value="http://www.csalim.com/clocks/301788.swf">
<embed src="http://www.csalim.com/clocks/301788.swf" width="200" height="200">
</embed>
</object>

<object width="150" height="150">
<param name="movie" value="http://www.csalim.com/clocks/945910.swf">
<embed src="http://www.csalim.com/clocks/945910.swf" width="200" height="200">
</embed>
</object>

<object width="150" height="150">
<param name="movie" value="http://www.csalim.com/clocks/267241.swf">
<embed src="http://www.csalim.com/clocks/267241.swf" width="200" height="200">
</embed>
</object>

<object width="150" height="150">
<param name="movie" value="http://www.csalim.com/clocks/119643.swf">
<embed src="http://www.csalim.com/clocks/119643.swf" width="200" height="200">
</embed>
</object>

<object width="150" height="150">
<param name="movie" value="http://www.csalim.com/clocks/548744.swf">
<embed src="http://www.csalim.com/clocks/548744.swf" width="200" height="200">
</embed>
</object>

<object width="150" height="150">
<param name="movie" value="http://www.csalim.com/clocks/143361.swf">
<embed src="http://www.csalim.com/clocks/143361.swf" width="200" height="200">
</embed>
</object>

<object width="150" height="150">
<param name="movie" value="http://www.csalim.com/clocks/205420.swf">
<embed src="http://www.csalim.com/clocks/205420.swf" width="200" height="200">
</embed>
</object>

Adding Clocks to blogger:
First Sign in to your blog and go to

1. Layout > Page Elements > "Add Gadget" where you want.
2. Select  HTML/JavaScript
3. Paste Above clock code in pop up window.
4. Save and Check your Blog.

read more

Honehone Clock [Clock Parts Blog]

Watch announced the 17 children assigned Osaka, Honehone clock. The clock that is rather shy figure fine character like Mr. honehone.
Only one direction so that not only made animation 1 → 2 → 3 · · · 9 → 0, when it comes to 00 seconds from 59 seconds, and when the attraction is at 00 to 24 hours.

Once a small, well, I have a cute blog and I think parts.

Adding This widget :

Now Go to your Dashboard >> Design >> 
And on your page elements page, click on Add A Gadget any where on the screen,
And choose ” HTML / JavaScript ” , Leave the title empty, ant at the content area, paste the following code,

<script charset="Shift_JIS" src="http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_tr.js"></script>

<script charset="Shift_JIS" src="http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_wh.js"></script> 

Hours, minutes, and expanding universal feature of seconds to roll over? Month.

read more

Make Rainbow Color Link For Blog

Many ways are made by every blogger to make their blogs look pretty impressed, unique and various . Among the modifications to existing templates,Want to make a link on your blog and rainbow-colored flashes when touched by a pointer? It is very easy .Easy anyway, follow these steps:

•  In the circumstances loggin,
• Log in menu templates,
• Click on Edit HTML,
• Find <head> code,(control + F)

Then copy and paste the following code just below the last code:

<script language='javascript' src='http://sites.google.com/site/amatullah83/js-indahnyaberbagi/LinkPelangi.js'/>

 Save Template.and Good luck.

read more

Zoom In/Out Images On Mouse Hover With Single Image

 

There are many tutorials online which show users how to achieve a hover effect on their buttons and other images using mouse hover and they often instruct to use a second, larger image.  Another method used is using jQuery to enlarge the size of the image. But with a little bit of trickery, this can be done solely using Css3 and normal html.

Note : This trick is best viewed in the latest version of any browser other than IE.
This tutorial has been split into two parts:

1. CSS implementation
2. HTML Implementation

CSS implementation:

1. Go To Blogger > Design > Edit HTML
2. and search for

]]></b:skin>

3. Now right above it, paste this code:

/*------- MBT ZOOM-OUT ZOOM-IN -------*/

.mbtzoom {
padding:5px;
position:fixed;
bottom: 35px;
right:10px;
cursor: pointer;
text-decoration: none;
border: 0px solid transparent;
-moz-transition: all 0.3s ease-out; 
-o-transition: all 0.3s ease-out; 
-webkit-transition: all 0.3s ease-out; 
-ms-transition: all 0.3s ease-out; 
transition: all 0.3s ease-out; 
}

.mbtzoom:hover  {
  zoom: 2;
  text-enlarge: 2;
  -moz-transform: scale(2);
  -o-transform: scale(2);
  transform: scale(2);
} 

Same procedure as the other option, edit the values to your picture, and change the zoom to how big you want the picture after the transition.

HTML Implementation:

Now whenever you wish to apply the zoom effect to any image you want simply use this code,

<a href="URL OF PAGE" class="mbtzoom"><img  width="60px" height="60px" src="IMAGE LINK" alt="back to top"  /></a>

• Replace URL OF PAGE with the page link. On clicking the image the user will be taken to that page
• Replace IMAGE LINK with the link of the picture
• Make sure to Keep width and height equal to half the size of original image. For example if the image size is 100px by 100px then set width="50px" and height="50px"

That’s it! Your image should be zooming/enlarging beautifully on your blog/website!

DEMO

As a DEMO simply paste this code on MBT HTML Editor

read more