Embed mp4 video in Mkdocs¶

ffmpeg¶

Install on Mac¶

% cd ~
% brew install ffmpeg

Copmress video into mp4¶

Ref. cheatsheet

HTML5 MP4 ffmpeg encoding  

variable bit rate 1080p MP3:  
% ffmpeg -i input_video -vcodec libx264 -crf 25 -preset medium -vf scale=-2:1080 -acodec libmp3lame -q:a 4 -ar 48000 -ac 2 output_video1.mp4

fixed bit rate 1080p MP2:  
% ffmpeg -i output_video1.mp4 -vcodec libx264 -b:v 1000k -vf scale=-2:1080 -acodec mp2 -b:a 256k -ar 48000 -ac 2 output_video.mp4

Embed video.mp4 with html tag¶

file structure¶

docs/
    assignment/
        week0.md
    images/
        image.jpg
        video.mp4

image.jpg¶

![](../images/image.jpg){width=400}

video.mp4¶

Attention

image.jpg
../images/image.jpg

video.MP4
../../images/video.mp4
(extra ” ../ ” is required in html tag)

<video width="400"  controls>
  <source src="../../images/video.mp4" type="video/mp4">
</video>

Last update: April 11, 2022