Open In App

Integrating Facebook Like, Comments and Share Plugin in Flask Project

Improve
Improve
Like Article
Like
Save
Share
Report

Flask is a Framework of Python that allows us to build up web-applications. It was developed by Armin Ronacher. Flask’s framework is more explicit than Django’s framework and is also easier to learn because it has less base code to implement a simple web-Application.  This article revolves around how to integrate Facebook comments plugin in flask application

Installation

pip install flask

How to integrate facebook comments in Flask ?

Create new file app.py

Python3




from flask import Flask,render_template
  
app = Flask(__name__)
  
@app.route("/")
def home():
    return render_template("index.html")
  
  
if __name__ == '__main__':
    app.run(debug=True)


Go to https://developers.facebook.com/docs/plugins/comments/, and Add the post link you are looking to add comments plugin for,

Click on get code

Create new directory templates inside that create new html file index.html

HTML




<!DOCTYPE html>
<html>
<head>
    <title></title>
    <div id="fb-root"></div>
<script async defer crossorigin="anonymous" 
        nonce="ihqHhvna"></script>
</head>
<body>
<h1>Welcome To GFG</h1>
<div class="fb-comments" data-href="http://127.0.0.1:5000/GFG" 
     data-width="" data-numposts="5"></div>
</body>
</html>


If we change the url the comments are also changed.

To see this lets create new file index1.html

index1.html

HTML




<!DOCTYPE html>
<html>
<head>
    <title></title>
    <div id="fb-root"></div>
<script async defer crossorigin="anonymous"
        nonce="ihqHhvna"></script>
</head>
<body>
<h1>Again Welcome To GFG</h1>
<div class="fb-comments" data-href="http://127.0.0.1:5000/GFG1" 
     data-width="" 
     data-numposts="5"></div>
</body>
</html>


app.py

Python3




from flask import Flask,render_template
  
app = Flask(__name__)
  
@app.route("/")
def index():
    return render_template("index.html")
  
  
@app.route("/home")
def home():
    return render_template("index1.html")
  
  
if __name__ == '__main__':
    app.run(debug=True)


To run this app open terminal or cmd

python app.py

Output :-

To add like and share field go to https://developers.facebook.com/docs/plugins/like-button, do the same process

Click on get code

Create new html file inside the templates directory 

HTML




<!DOCTYPE html>
<html>
<head>
    <title>GFG</title>
    <div id="fb-root"></div>
    <script async defer crossorigin="anonymous"
            nonce="4HOL61En"></script>
</head>
<body>
<h1>Like and Share</h1>
<div class="fb-like" data-href="http://127.0.0.1:5000/LIkeandShare" 
     data-width="" data-layout="button_count" data-action="like"
     data-size="large" data-share="true"></div>
</body>
</html>


Add new function to you function to your app.py

Python3




@app.route("/likeandshare")
def likeandshare():
    return render_template("Likeandshare.html")


Then again run app using command

python3 app.py

Output :-



Last Updated : 26 May, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads