One notable feature of the social media platform formerly recognized as Twitter is the capability to integrate your post timeline into a static webpage or blog. In light of the recent user exodus from Twitter to the Fediverse, individuals who had previously embedded their Twitter posts into their blogs found themselves in search of an analogous feature. I was among those seeking a comparable solution.
After some searching on the internet, I stumbled upon a GitLab project 'Mastodon timeline feed widget'. This project is free and open-source and employs JavaScript to make API calls to Mastodon. The script is designed to dynamically generate a post timeline within a web browser and comes bundled with accompanying CSS code to format the resulting widget elegantly.
Free to customize
I operate an Android phone, and my client of choice for the Fediverse is Fedilab. When a user shares an article to Mastodon via this client, Fedilab automatically inserts a markdown '>' symbol into the article's subtitle. Interestingly, Fedilab also converts this markdown symbol into HTML blockquote elements, a functionality not supported by Mastodon's 4.1 web server and user experience (UX).
FOSS flexibility
Eager to bring this same user experience to my webpage, I
forked
the original project in early 2023 and developed a
markdownToHTML() method. This function parses the post's HTML
content, identifies blocks prefixed with the '>' symbol, and encapsulates
them with HTML blockquote tags. Subsequently, this enhancement was integrated
into the upstream GitLab project.
See it in action
You can see the widget in action here on my personal blog, and at Support Roaring Rock Park's website.