Creating Facebook Like Box and Responsive Comment |Technical Tips And Latest Tweaks

Creating Facebook Like Box and Responsive Comment

Facebook is a social medium that has a very large number of users. In Indonesia, only 47% of internet users have a facebook account. In addition to social media facebook also provides many tools for blog users. Among fasilita like facebook like box, facebook button, facebook comment.
Well for those of you facebook users and also put up facebook like box or facebook comment blog you might be interested in tips on this one. The tips that I give you this is how to make them become responsive. It is very suitable for users responsive template.
From the search results and I did the experiment I found two methods to make it responsive. That is by using CSS and jQuery way. Well for those of you who are interested can follow the following ways.

CSS method
Method by using CSS can be done by adding the following CSS code into your blogspot template:

Facebook Like Box

.fb-like-box, .fb-like-box span, .fb-like-box iframe[style] {
width: 100% !important;
}

Facebook Comment Box

.fb-comments, .fb-comments span, .fb-comments iframe[style] {
width: 100% !important;
}

 jQuery method
One method is somewhat more complicated because they have to use jQuery. So as to apply it at least your blog has been around jQuery libraries.
In general, if you create a facebook like and also facebook comment (HTML5) will be two boxes to copy the code.
The first code is the code javascriptnya or called by JavaScript SDK. This code should only be placed once. And encouraged placed after <body>. If no one form of code like this:

<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&appId=ID Aplikasi Facebook Anda";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

Technical Tips And Latest Tweaks

Monday, June 24, 2013