Soundcloud Tip: Thumbnails

One of the lesser-known features of steemit is the ability to embed Soundcloud clips. This is great for artists, but it's also nice since YouTube is overkill if all you want is to embed audio.

It's been documented before. Here's exactly how to go about it according to @stealthtrader.

As mentioned in that post, embed is achieved using a whitelisted iframe tag. To embed it, you must use the iframe tag provided by Soundcloud. E.g.:

<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/286349568&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>

Obviously, unlike YouTube, you do not use the Soundcloud URL. And unlike YouTube, steemit.com does not automatically create a thumbnail for the post.

I'm a little OCD about this kind of thing, so I found a way to make this happen anyway. Just place the img tag you want inside the iframe container. It won't typically render the image in the post, but steemit.com will pick it up and use it for the thunmbnail. E.g.:

<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/286349568&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true">
  <img src="http://seinfeldism.com/images/i-dont-want-to-be-a-pirate.jpg" width="1" height="1" />
</iframe>

I don't think it really matters if you make it a 1x1 image, but that's what I do.