This is my current workflow for dealing with YouTube embeds in my Obsidian pages. It makes embedded videos responsive (so they resize to the width of page). By using a Template, all that’s required is to copy the YouTube video ID from the URL and paste it in once the template has been applied.
Once the snippet is installed, all that’s happening is we are wrapping <div class="videoWrapper"> … </div> around the stock embed code, so it’s possible it could work for many platforms.
@Neigh: OK, great, I had already copied the code and was about to paste it in Obs when it hit me that you only mentioned YT. Anyway, thanks for clearing that up.
@Neigh: 1st of all thanks for the the code and template. I just embedded a video, and noticed that in Preview the bit after PASTE ID", i.e. starting from frameborder=“0” was visible as text, i.e. it was not part of the video embed code.
I deleted it, and the video still works, so to me it seems that bit from frameborder on is superfluous. Now, your expertise is waaaaay above my modest knowledge, so I cannot believe you would have added extraneous stuff, so please help me understand.
Okay so that embed code comes from the “share” -> “embed” dialog on a YouTube video. So that superfluous stuff is from YouTube and yes it can be purged if preferred. I like the way it looks borderless, and definitely want to be able to go fullscreen … so a simplified template could be more like this:
Sure thing Maybe add a comment to the CSS instructing users to wrap their embed code in <div class="videoWrapper"> … </div> Otherwise the snippet will do nothing