A Wonderful Branding Free Facebook Like Box

Friends, if you are looking for a professional branding-free Facebook-like box, you are reading this article at the right place. I present you with a fresh design of the Facebook Like Box with the CSS stacking effect. I promise you this widget will look awesome on your blog.

It is very simple to add this Facebook-like box to your blog. If you are thinking this will be difficult, then I want your attention. You are just two steps far away from this beautiful Facebook-like box widget. I assure your blog reader that you will know how you hide your Facebook branding.

Hiding Facebook-like box branding does not violate Facebook’s terms and conditions, so you are going to install the best Facebook-like box widget so far.

New Facebook Like Box Using CSS Stack Effect Installation Tutorial

1. Blogger Dashboard › Select a blog › Layout (Page Element) › Add an HTML/Javascript Gadget
2. Then paste any of the following widget codes in that and save this HTML/Javascript gadget

Note: You must change the “techprevue” with your page ID

In general condition, the Facebook page URL is as follows –

http://www.facebook.com/techprevue

But if you have a very new Facebook page, then it may be as follows –

http://www.facebook.com/pages/techprevue/365334223544209

Changing your Facebook page URL by copying it from your web browser’s address bar is highly recommended. :)

 

Style 1: Pure Design – For this widget, use the following code

<style>
.techprevue-fb-like-box-pure{width:280px;height:150px;border-radius:3px;position:relative;background:#FFF;padding:0px 10px 15px 0}.techprevue-fb-like-box-pure,.techprevue-fb-like-box-pure:before,.techprevue-fb-like-box-pure:after{background:#FFF;border:1px solid #0072C4}.techprevue-fb-like-box-pure:before,.techprevue-fb-like-box-pure:after{position:absolute;content:"";bottom:-3px;left:2px;right:2px;height:1px;border-top:none}.techprevue-fb-like-box-pure:after{left:4px;right:4px;bottom:-5px;box-shadow:0 0 2px #0072C4}
</style>
<div class="techprevue-fb-like-box-pure">
<div style="height:155px;overflow:hidden">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Ftechprevue&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23FFF&amp;stream=false&amp;header=false&amp;appId=421760957869477" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</div>
</div>

 

Style 2: India Design – For this widget, use the following code

<style>
.techprevue-fb-like-box-india{width:280px;height:150px;border-radius:3px;position:relative;background:#FFF8ED;padding:0px 10px 15px 0}.techprevue-fb-like-box-india,.techprevue-fb-like-box-india:before,.techprevue-fb-like-box-india:after{background:#FFF8ED;border:1px solid #68914F}.techprevue-fb-like-box-india:before,.techprevue-fb-like-box-india:after{position:absolute;content:"";bottom:-3px;left:2px;right:2px;height:1px;border-top:none}.techprevue-fb-like-box-india:after{left:4px;right:4px;bottom:-5px;box-shadow:0 0 2px #68914F}
</style>
<div class="techprevue-fb-like-box-india">
<div style="height:155px;overflow:hidden">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Ftechprevue&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23FFF8ED&amp;stream=false&amp;header=false&amp;appId=421760957869477" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</div>
</div>

 

Style 3: Shine Design – For this widget, use the following code

<style>
.techprevue-fb-like-box-shine{width:280px;height:150px;border-radius:3px;position:relative;background:#EDF4FF;padding:0px 10px 15px 0}.techprevue-fb-like-box-shine,.techprevue-fb-like-box-shine:before,.techprevue-fb-like-box-shine:after{background:#EDF4FF;border:1px solid #ABACB2}.techprevue-fb-like-box-shine:before,.techprevue-fb-like-box-shine:after{position:absolute;content:"";bottom:-3px;left:2px;right:2px;height:1px;border-top:none}.techprevue-fb-like-box-shine:after{left:4px;right:4px;bottom:-5px;box-shadow:0 0 2px #ABACB2}
</style>
<div class="techprevue-fb-like-box-shine">
<div style="height:155px;overflow:hidden">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Ftechprevue&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23EDF4FF&amp;stream=false&amp;header=false&amp;appId=421760957869477" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</div>
</div>

 

Style 4: Sliver Design – For this widget, use the following code

<style>
.techprevue-fb-like-box-silver{width:280px;height:150px;border-radius:3px;position:relative;background:#E6E8EF;padding:0px 10px 15px 0}.techprevue-fb-like-box-silver,.techprevue-fb-like-box-silver:before,.techprevue-fb-like-box-silver:after{background:#E6E8EF;border:1px solid #ABACB2}.techprevue-fb-like-box-silver:before,.techprevue-fb-like-box-silver:after{content:"";position:absolute;bottom:-3px;left:2px;right:2px;height:1px;border-top:none}.techprevue-fb-like-box-silver:after{left:4px;right:4px;bottom:-5px;box-shadow:0 0 2px #ABACB2}
</style>
<div class="techprevue-fb-like-box-silver">
<div style="height:155px;overflow:hidden">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Ftechprevue&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23E6E8EF&amp;stream=false&amp;header=false&amp;appId=421760957869477" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</div>
</div>

 

Style 5: Sky Design – For this widget, use the following code

<style>
.techprevue-fb-like-box-sky{width:280px;height:150px;border-radius:3px;position:relative;background:#EFF1F6;padding:0px 10px 15px 0}.techprevue-fb-like-box-sky,.techprevue-fb-like-box-sky:before,.techprevue-fb-like-box-sky:after{background:#EFF1F6;border:1px solid #A8B3CF}.techprevue-fb-like-box-sky:before,.techprevue-fb-like-box-sky:after{position:absolute;content:"";bottom:-3px;left:2px;right:2px;height:1px;border-top:none}.techprevue-fb-like-box-sky:after{left:4px;right:4px;bottom:-5px;box-shadow:0 0 2px #A8B3CF}
</style>
<div class="techprevue-fb-like-box-sky">
<div style="height:155px;overflow:hidden">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Ftechprevue&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23EFF1F6&amp;stream=false&amp;header=false&amp;appId=421760957869477" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</div>
</div>

 

Style 6: Pearl Design – For this widget, use the following code

<style>
.techprevue-fb-like-box-pearl{width:280px;height:150px;border-radius:3px;position:relative;background:#F2F2F2;padding:0px 10px 15px 0}.techprevue-fb-like-box-pearl,.techprevue-fb-like-box-pearl:before,.techprevue-fb-like-box-pearl:after{background:#F2F2F2;border:1px solid #CFCFCF}.techprevue-fb-like-box-pearl:before,.techprevue-fb-like-box-pearl:after{position:absolute;content:"";bottom:-3px;left:2px;right:2px;height:1px;border-top:none}.techprevue-fb-like-box-pearl:after{left:4px;right:4px;bottom:-5px;box-shadow:0 0 2px #CFCFCF}
</style>
<div class="techprevue-fb-like-box-pearl">
<div style="height:155px;overflow:hidden">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Ftechprevue&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23F2F2F2&amp;stream=false&amp;header=false&amp;appId=421760957869477" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</div>
</div>

Please review this widget with your comments.