Cafedev chia sẻ về cách load video của youtube trong html, thực ra nó rất dễ và đơn giản.
Nội dung chính
1. Các định dạng video
Bạn đã thấy rằng bạn có thể phải chuyển đổi video của mình sang các định dạng khác nhau để làm cho chúng phát trong tất cả các trình duyệt.
Chuyển đổi video sang các định dạng khác nhau có thể khó khăn và tốn thời gian.
Một giải pháp dễ dàng hơn là để YouTube phát video trong trang web của bạn.
2. YouTube Video Id
YouTube sẽ hiển thị một id (như tgbNymZ7vqYDJEBNDKL), khi bạn lưu (hoặc phát) video.
Bạn có thể sử dụng id này và tham chiếu video của mình bằng mã HTML.
3. Phát video YouTube bằng HTML
Để phát video của bạn trên một trang web, hãy làm như sau:
- Tải video lên YouTube
- Ghi lại id video
- Xác định phần tử iframe
- Để thuộc tính src trỏ đến URL video
- Sử dụng các thuộc tính chiều rộng và chiều cao để chỉ định kích thước của trình phát
- Thêm bất kỳ tham số nào khác vào URL (xem bên dưới)
<iframe width="420" height="315"
src="https://www.youtube.com/embed/60nIVKzylLQ">
</iframe> 4. Tự động phát YouTube
Bạn có thể để video của mình bắt đầu phát tự động khi người dùng truy cập trang đó bằng cách thêm một tham số đơn giản vào URL YouTube của bạn.
Lưu ý: Hãy cân nhắc cẩn thận khi quyết định tự động phát video của bạn. Tự động bắt đầu một video có thể gây khó chịu cho khách truy cập của bạn và cuối cùng gây ra nhiều tác hại hơn là tốt.
Giá trị 0 (mặc định): Video sẽ không tự động phát khi trình phát tải.
Giá trị 1: Video sẽ tự động phát khi trình phát tải.
<!--
Cafedev.vn - Kênh thông tin IT hàng đầu Việt Nam
@author cafedevn
Contact: cafedevn@gmail.com
Fanpage: https://www.facebook.com/cafedevn
Group: https://www.facebook.com/groups/cafedev.vn/
Instagram: https://instagram.com/cafedevn
Twitter: https://twitter.com/CafedeVn
Linkedin: https://www.linkedin.com/in/cafe-dev-407054199/
Pinterest: https://www.pinterest.com/cafedevvn/
YouTube: https://www.youtube.com/channel/UCE7zpY_SlHGEgo67pHxqIoA/
-->
<iframe width="420" height="315"
src="https://www.youtube.com/embed/60nIVKzylLQ?autoplay=1">
</iframe> 5. YouTube Playlist
Danh sách video được phân tách bằng dấu phẩy (ngoài URL gốc).
6. Vòng lặp video YouTube
Giá trị 0 (mặc định): Video sẽ chỉ phát một lần.
Giá trị 1: Video sẽ lặp (mãi mãi).
<iframe width="420" height="315"
src="https://www.youtube.com/embed/60nIVKzylLQ?playlist=tgbNymZ7vqY&loop=1">
</iframe>7. Điều khiển Video YouTube
Giá trị 0: Điều khiển trình phát không hiển thị.
Giá trị 1 (mặc định): Hiển thị điều khiển trình phát.
<iframe width="420" height="315"
src="https://www.youtube.com/embed/60nIVKzylLQ?controls=0">
</iframe> Nếu bạn thấy hay và hữu ích, bạn có thể tham gia các kênh sau của cafedev để nhận được nhiều hơn nữa:
Chào thân ái và quyết thắng!
