Add Static Facebook Pop Out Like Box with Smooth Jquery Hover Effect alphatre 301+more

Po ... Add Static Facebook Pop Out Like Box with Smooth Jquery Hover Effect 35 comments In this tutorial i will show you how to add a cool floating Facebook like widget for Blogger that slides to the left on mouseover. Demo: You can see a static facebook badge at the right side of this blog Adding Static Facebook Like widget on blogger Just follow the steps: 1. Log in to your Blogger Dashboard, go to Design >> Edit HTML 2. Check the "Expand Widget Templates" box 3. Search (CTRL + F) for this tag: 4. Add the following code just before/abovetag: 5. Save the Template. 6. Now go to Design >> Page Elements >> Add a new Gadget >> Choose HTML/JavaScript and in the HTML box, paste the code below:

7. ReplaceYOUR-FACEBOOK-PAGEtext above with the URL of your facebook fan page. Also replace the:symbol in your URL with%3Aand/with%2F For example, my facebook fan page is: http://www.facebook.com/pages /Helplogger/120574614736021 After replacing the characters above, your facebook fan page should look like this: http%3A%2F%2F www.facebook.com%2Fpages%2FHelplogger%2F120574614736021 Other settings (optional): - to change the width and height of the facebook box, change the bolded values (250) - to change the background color of the facebook fan box, replace#FFFFFFwith the hex code of your color (you can choose it from here) - if you want to change the color of the facebook badge (facebook button) replace this code#3B5998 with your own. 8. Now you can save your widget. Enjoy! Credit goes to Harish (way2blogging) Like 28 Random Posts Google Translate Widget with Flags For Blogger28/04/2012 - 22 Comments Awesome Slide Open Heart Bookmarking Gadget For Blogger09/03/2012 - 7 Comments Recent Posts Widget with Thumbnails for Blogger/Blogspot04/05/2012 - 135 Comments Related Posts: Add Facebook Like Button Below Post... How to add Facebook Like/Fan Box to... Share blog posts in social medias u... Add A CSS Animated Share Button on ... jQuery Sliding Panel with Expanding... 35 comments: Md. Shamim 4/27/2012 not working in IE 6 & 7 Reply Replies Admin 4/27/2012 It works with my IE 9. Please verify if you have added the jQuery plugin from step 4. Arun attuvassery 4/27/2012 hai my facebook plugin working only on home page. plzz help me. monu.arun0@ gmail.com www.teckblazer.blogs pot.com nice plugin .. Reply Replies Admin 4/27/2012 Search for this in your template (expand widget templates first): This should be removed (also the closing taglocated immediately after) humza ashraf 11/17/2012 how to delete this wigdet VUM-ZERO 5/15/2012 this is a definite like, love it Reply hemanth kumar 6/09/2012 asking href error Reply Syn citii 6/17/2012 works like a charm Reply jrwills 8/08/2012 I especially like that I could change the color of the tab to match the dark blue on my site rather than using an image. I was also able to figure out to make style #fbplikebox {margin-top: to push it down past my header. Perfect! Thank you for sharing. Reply Replies Admin 8/09/2012 You're welcome! Mandip Koirala 11/15/2013 It showed Ads instead of likes. Please help! Alwayne Brown 8/17/2012 I tried this on my blog here >>> the incompleteid10t.blogs pot.com. instead of showing the facebook page however, it showed the top left corner of the blog on the roll out Reply Alwayne Brown 8/17/2012 Never mind i figured out what i did wrong (Y) Working correctly now :) Reply renaldazwari 9/01/2012 really love it... but this javascript make my slider and my Jquery dropdown menu didn't work... :( Reply Mathew Rzor 9/16/2012 THX A BILLION!!!!!!!!11 Reply Femi Olanipekun 9/18/2012 i love it thanks alot..works well on my blog Reply Francisco 9/18/2012 Thanks for the tutorial is easy to understand and very useful Reply Busana Muslim Nusantara 9/29/2012 how to make it always on top? the slide just appeared behind my sidebar blocks... Reply Nikhil Raj 10/03/2012 hii....i have inserted the codes but still it is not working on my blog...please help me .... Reply Replies Aamir Naseer 1/11/2013 I have solve the probelm thanks for post Abdul Basit 10/18/2012 this is superb. its really work. i wasted 5 hours on searching it but i finally find your blog. it works you can view my site for demo http: thekhyber.blogspot.c om where is the google + button Reply Arnab R 10/21/2012 Great.. Reply Rasel Iqbal 10/21/2012 its not working completely in my blog......picture template. i can see that at right side of my blog but not complete. just showing facebook.........please do something Reply Bilal Akbar Roy 12/12/2012 Thxs dear Reply Roshan Jaswal Vikshipt 12/14/2012 Thanks for nice widget. Reply Craig 12/27/2012 nice one thanks :) works great Reply Bikash 1/06/2013 can you Please tell me the way to add this widget on my blog. but not as facebook page as facebook people. Reply Aamir Naseer 1/11/2013 How to Remove duble faces in this Please tell me fast! Reply Amit Mali 1/11/2013 it showing the box but not showing fb pge it showing my blog in that frame.. i done perfect as u suggested in description replaced the Facebook page url my page is facebook.com/weezy techstuff Reply Replies rowena fairhaired 3/07/2013 Yes, it really works but i did not replace the symbol [ : ] and the [ // ] with what has been said in the last step. I used the original facebook fan page url. Plese try to visit my blog at al lmeetmoneymaker.blogsp ot.com to see Amit Mali 1/11/2013 wotrked/ Reply Tocha 3/04/2013 Excellent tutorial. Thank you! Purple Facebook button looks great :D Reply Tocha 3/04/2013 I would like to add that it also works on my website. Whoop! Whoop! Reply Anayo Nwokeke 4/05/2013 WOW! WORKS LIKE MAGIC, THANKS ADMIN. Reply Raymond Tucker 4/14/2013 I did not work for me can anyone help Reply