Embeds that work in email? I can fake it!

Using Ghost
1

I’ve got a collection of copy-pasteable cards that solve client newsroom problems/wants in the area of Spotify embeds, PDFs (including being able to flip through on web), instagram embeds, Datawrapper, little author profile cards, small images with caption beside them. And probably some more things, by the time you read this.

Yes, they work in email and on ActivityPub. Well, or anyway, they include a fallback card that DOES work, and brings your reader to your site to see the whole thing. :slight_smile:

Nominations for other problem embeds welcome!

6 Likes
2

Tried it with a Spotify track. Small thing: the color fields only change the email bar, which makes sense since the web player is Spotify’s own iframe, but I did a double take. A label saying “email card” would help.

Nominations: Bandcamp and SoundCloud. Both are plain iframes, so in email you get nothing, and music newsletters use them all the time. Mixcloud too.

2 Likes
3

Holy shit. That Bluesky email embed looks amazing, and the embed process is so seamless. Congrats on an amazing job!

I’m currently in the process of slowly working my way through updating my measly MSMEs (Manual Social Media Embeds 4 Ghost) to v2, to make the “embed” process a bit easier and to get rid of a few bugs. I’d been thinking to myself for a while now that “perhaps I’ll one day approach Cathy and see if she’d be interested in automating these in some way”, then I saw your email-friendly embeds. Wow.

In short, the main difference between yours and mine is that all files are hosted locally in my version. Which is, as the first word of the embed setup explains, done fully manually. Secondly, as my primary concern isn’t about email, and as I don’t want to make the process too cumbersome, there’s only one HTML card on my version, which doesn’t utilize <table>s but rather <div>s and <span>s with some inline CSS to make things passable in emails (which will probably somewhat break in Outlook and possibly other email clients, but which I haven’t tested and don’t intend to).

Personally I still like what I’ve got as part of what I was after was to localize everything, obviating (1) the embeds temporarily disappearing due to possible platform outages, (2) the embeds disappearing due to possible deletion of the post by the writer, (3) the embeds disappearing due to possible deletion of the user account (and by extension of the post) by the writer or platform, and (not to get too tinfoil hat-ish) the possible blockage of loading embeds on one’s site from the platform itself (supposing that’d even be possible).

All in all, I’m definitely going to stick with what I’ve got, partially because the vast majority of the embeds I personally embed are from that hell-site which shan’t be named (as well as from that Mastodon fork by the orange guy), which your setup doesn’t support (justifiably so, one might say).

Anyway, while I may still approach you one day about what I mentioned above, congrats again on an amazing job.

p.s. I’m stunned that you were able to make the email embeds look “perfect” in the editor. Mine look completely wonky, which I cleaned up by applying styling for the MSMEs to the editor via uBlock Origin, of which I was thinking about investigating whether it could all be moved over to Stylus (as that’d be cross-platform compatible). But yours work as is. Double wow.

1 Like
4

Awww. Thanks! Yeah, I’ve been really excited about having discovered that (at least in Chrome), I can load content into the clipboard that pastes as actual Ghost cards.

Interestingly, perhaps, to make most of the “embeds” work in email, I do move the data onto your site. I load the image on your Ghost site, grab the text, etc. And it wouldn’t actually be all that hard to use the email form on web. That wasn’t quite what I was thinking when I set it up, but I accidentally ended up pretty close to having a self-hosted/archival copy of toots etc anyway! Maybe it should be an option?

I hadn’t looked at the X embed, because I assumed that Ghost had pretty good email rendering of it. (And you’re right, I am not all that interested in X.) But I just tried it, and ewww… the email version is pretty poor. So maybe I do need an X option. Assuming they don’t block me from getting the data, which is very possible.

Food for thought. :thinking: I’ll have to have a snoop through your repo and see if that’ll be a good jump start for some of the other socials, too… :eyes: I’ve also got a request for Bandcamp to look at, at some point.

1 Like
5

I only tried it in Firefox, where it worked just fine.

Nah, I wouldn’t suggest doing so just yet. That’s the poorly structured v1, with bugs. I’ll see if I can get v2 completed for early-October.

6

Yo, this is awesome! I’d love to request more audio players (Bandcamp, Apple Music, Mixcloud, SoundCloud, etc)!

1 Like
7

Update: Now with LinkedIn, Flourish, PDFs, and several alternate layouts (i.e. author card, wrapped headshot) that aren’t really embeds but ended up there anyway. Bandcamp and SoundCloud are up next.

I redefined the project to be a FOUR surfaces issue, so now I’m writing to apple news format also for the publishers using my integration. :)