<video> in Markdown

Question

Using <video> in my jekyll markdown is parsing as raw text, how can I get <video> to work?

<div class="row post-image-bg" markdown="1">
    <video width="99%" height="540" autoplay loop muted markdown="1">
        <source src="/images/posts/send-cancel.mp4" type="video/mp4" markdown="1" >
        <source src="/images/posts/send-cancel.webm" type="video/webm" markdown="1">
    </video>
</div>

Answer 1

Explanation

You have the markdown="1" attribute in every single element, which tells the markdown processor to parse the contents of the element.

Now the contents of the element are indented in a normal HTML style. However, MarkDown parses indentation as.. you guessed it: code blocks. What MarkDown sees is:

...
    <video ...>
    ...
    </video>
...

Note the four spaces before the video tags here. As with stackoverflow.com, these is MarkDown for code blocks.

Solutions

There are several fixes for this:

Turn off MarkDown processing locally

Change markdown="1" to markdown="0". Or just get rid of it. I'm not sure why you have that attribute everywhere.

Turn off MarkDown parsing for the file

Rename your file from .md to .html, or any other extension not specified as MarkDown by your _config.yml.

Prevent MarkDown from recognizing it as a code block

Unindent your HTML. I know it looks ugly, but it's the only way to stop MarkDown from recognizing it as "code".