Nhúng videos từ Google Drive vào Website với Responsive

27

Việc nhúng video từ Google Drive vào Website là một trong những chủ đề được nhiều người tìm kiếm. Thực ra đây không phải vấn đề khó, vấn đề là làm thế nào để chúng ta sử dụng responsive cho video khi đăng tải lên website. Bởi vì nếu bạn chọn nhúng trực tiếp theo mã của Google thì không thể responsive trên website, thậm chí là không thể phóng toàn màn hình cho video của bạn trên website.

Bài viết này sẽ hướng dẫn chi tiết việc nhúng video từ google drive vào website với việc sử dụng responsive.

Trước hết, bạn cần chia sẻ video trên Google Drive với những thiết lập hình dưới đây (phần này đơn giản vì có quá nhiều chia sẻ trên Internet rồi. Chỉ là bạn cần nháy phải chuột vào video, chọn Chia sẻ, tiếp đó trong phần thiết lập bạn cần lựa chọn Bất kỳ ai có đường liên kết):

chia sẻ google driveTiếp đó, bạn chọn sao chép đường liên kết và dán vào đâu đó tạm thời. Chẳng hạn như đường link này:

https://drive.google.com/file/d/1vSzh3xof-rOnKVFlnN65307gxD4lZEX8/view?usp=sharing

Bước tiếp theo là bạn cần dán đoạn mã dưới đây vào website:

<div class="embed-responsive embed-responsive-16by9"><iframe class="embed-responsive-item" src="https://drive.google.com/file/d/Dán đoạn mã bôi đỏ vào đâyy/preview?autoplay=0" width="640" height="360" frameborder="0" allowfullscreen="allowfullscreen"><span data-mce-type="bookmark" style="display: inline-block; width: 0px; overflow: hidden; line-height: 0;" class="mce_SELRES_start"></span></iframe></div>

Phần bôi đỏ chính là phần mà bạn sẽ copy từ đường link từ Drive để dán vào đó. Ok, giờ bạn có thể hoàn toàn xem được video trên website từ Google Drive với định dạng hoàn toàn với responsive.

Chúc bạn thành công!