How to Embed Tweets on Streamlit Web Application

Embedding tweets from Twitter within our web application can be both visually aesthetic and informative for our audiences. Here's only few lines of python codes to achieve this goal.

👨🏾‍💻 GitHub ⭐️| 🐦 Twitter | 📹 YouTube | ☕️ BuyMeaCoffee | Ko-fi💜

Probably, you have already noticed, that Notion has it's unique feature of embedding any type of content or service with url. One of them is embedding tweets. How about implementing this similar feature in your Streamlit Web Application ?

1. Twitter's oEmbed API

Twitter has provided the developers with ample oppurtunity to play around with it's API features, popularly known as Twitter Developer Platform. Among the several avaialable APIs, we will use the oEmbed API for embedding our tweet in our Streamlit Web Application.

Using the API

• Resource URL — https://publish.twitter.com/oembed
• Response format — JSON
• Further arguments (refer to oEmbed Guides)

2. Streamlit Components API

Using the above streamlit syntax, we can easily display a HTML string within an iframe. Also, refer to the official Streamlit Docs page for detailed information about the usage.

Now, let's try to implement both of the above mentioned aspects together.

3. The Implementation

• Importing the packages.

import streamlit as st 
import streamlit.components.v1 as components
import requests

• We write a function, which will return a json response on our request made to the API. And also, we will use a simple streamlit syntax as user input for the tweet URL (st.text_input)

• The output of the above lines of codes , looks like this.

• However, we need the "html" block of the json output. Therefore, we need this line of code,

# We comment --> res = response.json()

res = response.json()["html"] 

• Now, in order to display the tweet, we will add an extra streamlit syntax .

# Also we will, comment --> st.write(res)

components.html(res,height= 700)

AND WE ARE DONE!! We have successfully embedded our tweet .

For more reference, you can also view my Youtube video —

👨🏾‍💻 GitHub ⭐️| 🐦 Twitter | 📹 YouTube | ☕️ BuyMeaCoffee | Ko-fi💜