I have already shared many Facebook Widgets for blogger. Today i will share a stylish facebook fanpage like widget that appears below all posts in blogger. Facebook is the best way to get more and more readers to your blog and i feel that official facebook recommendations barwidget is another great widget that will surely boost up your visitor time on your site. But this facebook fanpage will help your visitors receive notifications about your blog’s new content right onto their facebook wall.
How To Add Stylish Facebook Fan Page Like Box For Blogger
2. Tick Expand Widget box and using Ctrl + F find this code
Like Us…Receive updates on your Facebook wall!!!!
Remember to Replace infozguide with your facebook fanpage username.
4. Now again using Ctrl + F , find ]]> and paste the below code above it
#InfozGuide-fb { -moz-border-radius: 10px 10px 10px 10px; -webkit-border-radius: 10px 10px 10px 10px; -goog-ms-border-radius: 10px 10px 10px 10px; border-radius: 10px; box-shadow: 5px 5px 5px #CCCCCC; background: none repeat scroll 0 0 transparent; border: 1px solid #D3D3D3; padding:10px; margin-top:25px; -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; width:560px; } # InfozGuide-fb:hover{ background: none repeat scroll 0 0 #FFF; -moz-box-shadow: 1px 1px 2px #CCC inset; -webkit-box-shadow: 1px 1px 2px #CCC inset; } # InfozGuide-fb td{ padding:3px 0; }
5. Save your template and you are done.
Thanks u.. I will try ;)
You are welcome. :)
Gurwinder Singh recently posted…An Update
Hi, thanks for the steps. But I am facing this problem while using likebox on my blog… it never appears in the sidebar. I tried the steps you have given but it did not work either. Can You please help me? http://www.shoppingstylenus.com shoppingstyleandus@gmail.com
It won’t appear in sidebar in any way as it is for displaying below blog posts.
However it can be added to your below header or at bottom , all you need to do is remove conditional tag i.e and . Rest follow the same steps and you can adjust the width by changing width attribute in 3rd point as per your requirement.
And you dont need to add this code below , instead add it in HTML/javascript widget from Layout Tab of your blog. And the 4th point is to be followed as it is written. Hope it helps :)
Gurwinder Singh recently posted…A Few Job Search Mistakes You Should Avoid
i tried this but it does not work :-(
Why what happened? What problem are you facing?
I think is more than 1 time in your blogger template and you are pasting code after wrong tag. Try to put this code after each tag one by one and i hope it will surely work :)
Gurwinder Singh recently posted…How To Get Old Start Menu In Windows 8
Thanks Gurwinder.
You are welcome buddy.
Gurwinder Singh recently posted…What is 2012? Is The World Going To End In December 2012?
Friend, you did a great job by providing this great tips to the bloggers. This facebook like box is looking awesome than the default like box. You change the way of blogging. Great Job Gurwinder Paji.. :)
Ankit recently posted…Stylish Facebook Like Box Without Border
You are most welcome Ankit, keep visiting for more updates :)
Gurwinder Singh recently posted…Gmail Offline Access (Browser Extension)