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> %}