Mastodon: Embed posts in external websites

[thomaskuntzz]

Would be nice to have twitter-like embedding of posts :slightly_smiling_face:

See this: https://mastodon.social/users/prashere/updates/619788

[gregjw]

Definitely needed.

[fenwick67]

To clarify, you can embed a toot using the embed url, but you can't embed a timeline.

I have tried accessing the timeline atom feed via a browser but that fails because of CORS restrictions. For now you can use rss2json.com to make a request for the Atom feed, then parse that in js instead (I wrote a POC here ). That's the easiest type of solution I see right now for embedding timelines, but I don't recommend it.

[yookoala]

I think the notion for this issue is to provide an easy way for users to embed their post in another site.

Which requires:

• [ ] Standard Script: Provides a standard HTML / JS snippet to embed an embed url as an iframe. It needs to:
  
  
  
  • [ ] Support responsive layout by default.
  
  
  • [ ] Dynamically scale the iframe with the post content by default.
  
  
  • [ ] May have a manual set width and height.
  
  
• [ ] Mastodon UI: Provides a button / menu in the UI to copy the embed code
  
  
  
  • [ ] A menu button on post for sharing. Shows embed code on click.
  
  
  • [ ] Have advanced options for customize the embed code (e.g. fixed width, fixed height).
  
  

[thomaskuntzz]

@yookoala EXACTLY! 👍

[fenwick67]

For now I have built my own service for embedding timelines in blogs et cetera. It fetches the atom feed and renders the HTML server-side. It works okay but the atom feeds take a second or two to fetch.

https://github.com/fenwick67/mastofeed

[Letiteuf55]

Hi, how can i find the embed url of one of my Toot ?

[Gargron]

1.6.0 will have an "Embed" option in dropdowns in web UI with a modal that gives you the code. Mind you, Mastodon has supported OEmbed for a great number of versions already.

[thomaskuntzz]

Cool, and where can we find more about how OEmbed works in Mastodon? 🙂

[MadcapJake]

Is there a way to also embed replies to the toot?

[MadcapJake]

The best I can find is the context API entity. I think I could wire this into a Hugo shortcode for my blog to use as a comment system!

{{< mastodoncomments mid="12345678" >}}