NECTES Global Media Technology Website.

Add Facebook Like Box Style For your Blog in Blogger

0 78
In this  post  im    gonna   explain  how  to  add new
style facebook like box  for  your  blog.  This is just
widget.  you can  add  it  to  your blog easily. I think
it will  helps to  make  your  blog  attractive.

1. Log in to blogger  Layout.

2. Click Add Gadget and select ‘HTML/Javascript



3.Now Paste Below code.

<style>.blogtrixfb {
width: 280px;
height: 150px;
border-radius: 3px;
position: relative;
background-color:#f4f4f4;
padding:5px 10px 15px 0;
}
.blogtrixfb, .blogtrixfb:before, .blogtrixfb:after {
background: #f4f4f4;
border: 1px solid #ccc;
}
.blogtrixfb:before, .blogtrixfb:after {
content: "";
position: absolute;
bottom: -3px;
left: 2px;
right: 2px;
height: 1px;
border-top: none;
}
.blogtrixfb:after {
left: 4px;
right: 4px;
bottom: -5px;
box-shadow: 0 0 2px #ccc;
}
</style>
<div class="blogtrixfb">
<div style="height:155px;overflow:hidden">
<fb:like-box href="https://www.facebook.com/nobleexploits" data-width="300" data-height="250" data-show-faces="true" data-border-color="#f4f4f4" data-stream="false" data-header="false" class=" fb_iframe_widget "><span><iframe id="f5741c08" name="fdd6ca2ec" scrolling="no" style="border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; border-image: initial; overflow-x: hidden; overflow-y: hidden; height: 250px; width: 300px; " class="fb_ltr" src="http://www.facebook.com/plugins/likebox.php?border_color=%23f4f4f4&amp;channel=https%3A%2F%2Fs-static.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%23cb%3Df2babfba84%26origin%3Dhttp%253A%252F%252Fwww.bloggertrix.com%252Ff1ae6f85bc%26relation%3Dparent.parent%26transport%3Dpostmessage&amp;colorscheme=light&amp;header=false&amp;height=300&amp;href=https%3A%2F%2Fwww.facebook.com%2Fbloggertrix&amp;locale=en_US&amp;sdk=joey&amp;show_faces=true&amp;stream=false&amp;width=300"></iframe></span></fb:like-box>
</div>
</div>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

After paste above code
* Replace nobleexploits with your Facebook username

4. Now save your HTML/Javascript’.

    You are done…