Embedding Bluesky Links in Your Obsidian Digital Garden

Nov 29, 2024 2:21 PM
Dec 02, 2024 11:45 AM

How to automatically turn this:
www.dropbox.com
into this instead:
www.dropbox.com

and fully automatically!

Important

This guide extends the previous post about embedding #x posts → Embedding X (Twitter) Links in Your Obsidian Digital Garden. I recommend starting reading there for context.

Simple steps:

1. Get Your Bluesky Profile ID

Get embed code for any of your Bluesky posts, like showed here, and locate your profile ID from the url:
www.dropbox.com
In my case, the ID is tsdbhbquooofqxsg7ap2yvoe

2. Adjust Embed Template

Here is the Bluesky Embed template, replace <your profile id>, with the ID you copied in previous step:

<blockquote
  class="bluesky-embed"
  data-bluesky-uri="at://did:plc:<your profile id>/app.bsky.feed.post/$3"
  data-bluesky-cid="bafyreia3hfbpsogu7sgyej6fruewx7kxyzzbr2kvfbwkgfidvc3dhh6cse"
>
  <p lang="en">$1</p>
</blockquote>
<script async src="https://embed.bsky.app/static/embed.js" charset="utf-8"></script>

3. Open Digital Garden Filters Settings

Go to Obsidian Settings, and then into Digital Garden, after click on button: Manage Custom Filters
www.dropbox.com

4. Add Custom Filter

For the first input, use following regex pattern:
!\[(.*)\]\(https:\/\/bsky\.app\/profile\/([\w\.]+)\/post\/([\w]+)\), and for the second input, use the code/template created in step number 2. You should get to this:
www.dropbox.com
🎉 That's it.

Now, you can publish your notes and your bluesky embeds should work! (you may need to make any changes to the note, to be seen as modified for digital garden)

Note

This tutorial works only for embedding your own posts. Unfortunately, the BlueSky platform does not support embedding other posts since we are not able to automatically get their profile IDs.



This article was originally published on https://craftengineer.com/. It was written by a human and polished using grammar tools for clarity.

Follow me on X (Formally, Twitter) or Bluesky.