How to Integrate Facebook Comments Plugin

Submitted by nurhodelta_17 on Monday, April 16, 2018 - 22:37.

Step 1:

Go to Facebook Developer Page for comments plugin.

Step 2:

Follow the step by step tutorial and input necessary field for the Comments Plugin Code Generator.

Step 3:

Fill up the form and click Get Code button. facebook comment plugin generator

Step 4:

Take note of the codes given by the generator and the steps on how to integrate them to your app.

Example

This is the example integration of the codes given by the generator.

<!DOCTYPE html>
<html>
<head>
        <meta charset="utf-8">
        <title>How to Integrate Facebook Comments Plugin</title>
        <link rel="stylesheet" type="text/css" href="bootstrap4/css/bootstrap.min.css">
</head>
<body>
<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 = 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.12';
        fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
 
<div class="container">
        <h1 class="text-center" style="margin-top:30px;">How to Integrate Facebook Comments Plugin</h1>
        <hr>
        <div class="row justify-content-center">
                <div class="col-sm-6">
                        <div class="fb-comments" data-href="http://localhost/facebook_comment/index.html" data-numposts="10"></div>
                </div>
        </div>
</div>
</body>
</html>

That ends this tutorial. Happy Coding :)

Add new comment

126 views