fancybox facebook comment

HTML

<script src="http://mundonimona.com/fancybox/source/jquery.fancybox.pack.js"></script>
<link rel="stylesheet" href="http://mundonimona.com/fancybox/source/jquery.fancybox.css">
<body>
    
    <script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : '',
      xfbml      : true,
      version    : 'v2.3'
    });
  };

  (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/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>

<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/sdk.js#xfbml=1&version=v2.3&appId=1595393410732302";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
    
    
<gallery id="gallery">
    <image_container>
        <a href="http://mundonimona.com/images/diving/canon-s95-intova-iss-2000/anilao-batangas-its-a-macro-world/anilao-blenny-3.jpg" class="fancybox" rel="anilao" title="Anilao Blenny 3"><img src="http://mundonimona.com/images/diving/canon-s95-intova-iss-2000/anilao-batangas-its-a-macro-world/thumb/anilao-blenny-3.jpg" alt="Anilao Blenny 3"/>
<h4> Anilao Blenny 3 </h4></a>
    
    </image_container>
    
    <image_container>
		<a href="http://mundonimona.com/images/diving/canon-s95-intova-iss-2000/anilao-batangas-its-a-macro-world/anilao-blenny.jpg" class="fancybox" rel="anilao" title="Anilao Blenny"><img src="http://mundonimona.com/images/diving/canon-s95-intova-iss-2000/anilao-batangas-its-a-macro-world/thumb/anilao-blenny.jpg" alt="Anilao Blenny"/>
		<h4> Anilao Blenny </h4></a>
	</image_container>
    
    
</gallery>
</body>

CSS

gallery {
display: block;
width: 650px;
margin-top: 30px;
}

image_container {
display: block;
width: 200px;
height: 180px;
float: left;
text-align: center;
margin-bottom: 20px;
}

image_container img {
width: 160px;
box-shadow: 7px 5px 7px #666;
border: 4px outset #555;
margin-bottom: 4px;
}

image_container h4 {
font-size: 14px;
width: 160px;
margin: auto;
}

image_container a {
text-decoration: none;
color: #000;

}

JavaScript

$(".fancybox").fancybox({
    fitToView: false,
    maxWidth: "85%",
    beforeShow: function () {
        if (this.title) {
		currentHref = this.href;
		
        this.title += '<br /> <br/>'; // Line break after title

				
		this.title += '<div class="fb-like" style="margin:0; padding:0" data-href="' + currentHref + '" data-width="400" data-layout="standard" data-action="like" data-show-faces="false" data-share="false"></div>';
		
		this.title += '<br />'; // Line break after title
		
		this.title += '<div class="fb-comments" data-href="http://mundonimona.com/' + currentHref + '" data-num-posts="2" data-width="400"></div>';
        }
    },
    afterShow: function () {
        FB.XFBML.parse();
   
        
    },
    helpers: {
        title: {
            type: 'inside'
        }
    }
});