Mastodon Embed Examples

Testing various ways to embed Mastodon content.

Introduction

This is a simple project for testing embeds of content from Mastodon using different tools and methods. The goal is to provide clear, isolated examples.

📝 Read more background on DEV: The Fediverse is an Opportunity for Developers.

Mastodon Post Embeds

Embedding single posts is straightforward using Mastodon's API (it supports oEmbed, and there is an option to get embed code on the default web UI).

Single Post (Standard Embed/oEmbed) - Uses the common blockquote embed.
Single Post (API Data) - Fetches raw JSON data via JavaScript.
Single Post (PyScript + oEmbed) - Fetches oEmbed data via PyScript.

Mastodon Timeline Embeds

Embedding timelines requires external services or client-side libraries, as Mastodon doesn't offer a built-in timeline embed.

Timeline via RSS feed - Uses an RSS feed to display content (limitations apply).
Timeline via Emfed (JS) - Uses the Emfed library.
Timeline via Mastofeed (iframe) - Uses the Mastofeed service.
Timeline via MEFT (JS) - Uses the mastodon-embed-feed-timeline library.
Timeline via PyScript + Mastodon.py - Uses PyScript & Mastodon.py (requires authentication).

Other Notes

Some examples include a Fediverse sharing button.

The code for these examples is available on GitHub.

You can remix this project on Glitch:

Find Me on the Fediverse

Say hello 👋🏻: