Is it possible to embed Youtube/Vimeo videos in Markdown using a C# Markdown library

C# Problem Overview

I'm writing a web app in .NET MVC4 and would like to use Markdown. I understand there are a few open source C# Markdown libraries, but I haven't found one that obviously supports embedding youtube or Vimeo videos inside Markdown text.

Does anyone know if it's possible?

C# Solutions

Solution 1 - C#

The Solution using Standard Markdown ( not iFrame! )

Using an iframe is not the "obvious" solution... especially if the Markdown parser (or publishing platform) you are using does not support inlining content from a different website ... Instead you can "fake it" by including a valid linked-image in your Markdown file, using this format:

[![IMAGE ALT TEXT](http://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg)](http://www.youtube.com/watch?v=YOUTUBE_VIDEO_ID_HERE "Video Title")

Explanation of the Markdown

If this markdown snippet looks complicated, break it down into two parts:

an image
![image alt text](http//example.io/link-to-image)
wrapped in a link
[link text](http//example.io/my-link "link title")

Example using Valid Markdown and YouTube Thumbnail:

[](https://www.youtube.com/watch?v=StTqXEQ2l-Y "Everything Is AWESOME")

We are sourcing the thumbnail image directly from YouTube and linking to the actual video, so when the person clicks the image/thumbnail they will be taken to the video.

Code:

[![Everything Is AWESOME](https://img.youtube.com/vi/StTqXEQ2l-Y/0.jpg)](https://www.youtube.com/watch?v=StTqXEQ2l-Y "Everything Is AWESOME")

OR If you want to give readers a visual cue that the image/thumbnail is actually a playable video, take your own screenshot of the video in YouTube and use that as the thumbnail instead.

Example using Screenshot with Video Controls as Visual Cue:

[](https://youtu.be/StTqXEQ2l-Y?t=35s "Everything Is AWESOME")

Code:

[![Everything Is AWESOME](http://i.imgur.com/Ot5DWAW.png)](https://youtu.be/StTqXEQ2l-Y?t=35s "Everything Is AWESOME")

## Clear Advantages

While this requires a couple of extra steps (a) taking the screenshot of the video and (b) uploading it so you can use the image as your thumbnail it does have 3 clear advantages:

The person reading your markdown (or resulting html page) has a visual cue telling them they can watch the video (video controls encourage clicking)
You can chose a specific frame in the video to use as the thumbnail (thus making your content more engaging)
You can link to a specific time in the video from which play will start when the linked-image is clicked. (in our case from 35 seconds)

Taking a screenshot takes a few seconds and there are keyboard shortcuts for each OS which copy the screenshot to your clipboard which means you can paste it for even faster upload.

Not Only `C#`

And since this is 100% Standard markdown, it works everywhere (not just for the C# parser!) ... try it on GitHub, Redit or Ghost!

Vimeo

This approach also works with Vimeo videos

Example

[ Little red ridning hood ](https://vimeo.com/3514904 "Little red riding hood - Click to Watch!")

Code

[![Little red ridning hood](http://i.imgur.com/7YTMFQp.png)](https://vimeo.com/3514904 "Little red riding hood - Click to Watch!")

Notes:

How to take screenshot: http://www.take-a-screenshot.org/ (all platforms!)
Upload Thumbnail Image: Once you've taken your screenshot you can drag-and-drop it into imgur.com to upload and immediately use it as your thumbnail; couldn't be easier!
YouTube thumbnail info: https://stackoverflow.com/questions/2068344/how-do-i-get-a-youtube-video-thumbnail-from-the-youtube-api
Markdown format borrowed/modified/expanded from: https://stackoverflow.com/questions/11804820/embed-a-you-tube-video

Solution 2 - C#

You can use inline HTML to embed your video.

# this is a *markdown* document

<iframe  title="YouTube video player" width="480" height="390" src="http://www.youtube.com/watch?v=TheVideoID?autoplay=1" frameborder="0" allowfullscreen></iframe>
 
with a **youtube** video embedded

Solution 3 - C#

<iframe width="560" height="315" src="https://www.youtube.com/embed/-mUJnKI3ipI" frameborder="0" allowfullscreen></iframe>

Solution 4 - C#

Markdown won't let you embed videos, Basically the answers posted here are explaining to have a image link, which is clearly not what an embed means. So the answer to whether you can embed a video or not is "NO You can't".

Solution 5 - C#

You should be able to use the HTML5 <video> element. Someone tell me if this doesn't work.

(Just spotted this, many years late :-) , as I want to add video support to my md2pptx Markdown to PowerPoint open source tool.)

Solution 6 - C#

What about the syntax for embedding image, applied to other media?

![MyImage](https://example.com/image.png)

Oembed is interesting to make embedding easier: users just have to paste the URL instead of an iframe code. For video, it could be

![MyVideo](http://www.youtube.com/watch?v=TheVideoID)

Content Type	Original Author	Original Content on Stackoverflow
Question	Matt	View Question on Stackoverflow
Solution 1 - C#	nelsonic	View Answer on Stackoverflow
Solution 2 - C#	sloth	View Answer on Stackoverflow
Solution 3 - C#	johnnymire	View Answer on Stackoverflow
Solution 4 - C#	Darwin	View Answer on Stackoverflow
Solution 5 - C#	Martin Packer	View Answer on Stackoverflow
Solution 6 - C#	Romain	View Answer on Stackoverflow

Is it possible to embed Youtube/Vimeo videos in Markdown using a C# Markdown library

C# Problem Overview

C# Solutions

Solution 1 - C#

The Solution using Standard Markdown ( not iFrame! )

Explanation of the Markdown

Example using Valid Markdown and YouTube Thumbnail:

Code:

Example using Screenshot with Video Controls as Visual Cue:

Code:

Not Only `C#`

Vimeo

Example

Code

Notes:

Solution 2 - C#

Solution 3 - C#

Solution 4 - C#

Solution 5 - C#

Solution 6 - C#

Testing in-app billing: "The publisher cannot purchase this item"

Is it possible to emulate orientation in a browser?

Attributions

C# Problem Overview

C# Solutions

Solution 1 - C#

The Solution using Standard Markdown ( not iFrame! )

Explanation of the Markdown

Example using Valid Markdown and YouTube Thumbnail:

Code:

Example using Screenshot with Video Controls as Visual Cue:

Code:

Not Only C#

Vimeo

Example

Code

Notes:

Solution 2 - C#

Solution 3 - C#

Solution 4 - C#

Solution 5 - C#

Solution 6 - C#

Testing in-app billing: "The publisher cannot purchase this item"

Is it possible to emulate orientation in a browser?

Attributions

Not Only `C#`