Integrating Facebook Like, Comments and Share Plugin in Flask Project
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
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
<!DOCTYPE html>
<html>
<head>
<title></title>
<div id="fb-root"></div>
<script async defer crossorigin="anonymous"
src="https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v9.0"
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
<!DOCTYPE html>
<html>
<head>
<title></title>
<div id="fb-root"></div>
<script async defer crossorigin="anonymous"
src="https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v9.0"
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
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
<!DOCTYPE html>
<html>
<head>
<title>GFG</title>
<div id="fb-root"></div>
<script async defer crossorigin="anonymous"
src="https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v9.0"
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
@app.route("/likeandshare")
def likeandshare():
return render_template("Likeandshare.html")
Then again run app using command
python3 app.py
Output :-
