Discovered How to Embed Responsive Video in Blog-post

Hey Folks!, So Today I Discovered how to make Embed video responsive in hexo blog posts. A few days ago, I survived on image redirect to add a youtube video in my blog post because embedding a youtube video makes the video size fixed and makes it too big or too small window for mobile or laptop.

How do I come to know about this?

I was scrolling on the hexo plug-in website for changing code themes in blog posts, and I read Hexo-tag-Video. I was so curious to know what does this plugin does, So I clicked on the link. It redirected me to Github Repo for the same, but the readme includes Chinese(assumption) character's in it. On my first look at the readme, I thought of giving up but somehow tried to use it, and it worked like a charm!!.

How to use Hexo-Tag-Video?

Installation:

Run the following command in the root directory of hexo:

npm install hexo-tag-video --save

Usage:

This is the simplest task. All you need is to copy the embedded code of your video and paste it into this syntax.

{% video Your-EmbedCode-Here %}

Here is how I added Video Tutorials for this post,

Code:

{% video <iframe width="640" height="360" src="https://www.youtube.com/embed/W9eCBFF79MM" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe> %}

Output: