 |
| Nhúng một video lên blog giúp cho blog sinh động và lôi cuốn |
1. Chèn video mặc định
Để embed video, các bạn chỉ việc vào công cụ share của youtub, sau đó chọn embed và chép hết đoạn code để chèn lên website của các bạn thôiCode của một đoạn embed video youtub có dạng như sau
<iframe width="640" height="360" src="//www.youtube.com/embed/9DWqSXJ6zDg" frameborder="0" allowfullscreen></iframe>
Các bạn có thể căn chỉnh một chút cho đẹp như chiều cao, chiều rộng rồi chèn thôi. Riêng mình thường để width="100%" giúp cho video luôn luôn căn chỉnh được chiều rộng của bài đăng và có sự response chuẩn trên các thiết bị khác nhau
 |
| Cách nhúng một video cơ bản trên youtube |
 |
| Chèn code ở khung soạn thảo html |
2. Code nâng cao
Tuy nhiên ngoài phần code mặc định như nêu trên, các bạn cũng có thể sư dụng thêm một đoạn code tùy chỉnh nâng cao giúp cho phần cài đặt hiển thị video sinh động hơn. Mình sẽ sử dụng đoạn code như bên dưới
<iframe allowfullscreen="" frameborder="0" height="360" src="//www.youtube.com/embed/9DWqSXJ6zDg?start=10&rel=0&autoplay=1&loop=1&playlist=9DWqSXJ6zDg" width="640"></iframe>
Giải thích các tham số:
- start=10: bỏ qua 10 giây đầu tiên của Video. Nếu muốn bỏ qua nhiều/ít hơn thì chỉ cần thế số 10 thành số giây bạn muốn.
- &rel=0: Không xuất hiện các Video khác khi kết thúc xem Video hiện tại
- &autoplay=1: Tự động chạy Video
- &loop=1&playlist=Mã Video: Tự động phát lại (replay) sau khi chạy xong
Ngoài ra mình còn sử dụng một đoạn code nâng cao khác nhưng lại khá phù hợp với mình trông đó có thể ẩn được link out trỏ ra video gốc trên youtube và có thể xem ở chế độ mở rộng full- screen được. Tuy nhiên có một nhược điểm nhỏ là ở phần cuối video lại xuất hiện một danh sách các video tham khảo. Mình nghĩ điều này cũng không có gì to tát hết
<iframe allow="autoplay; encrypted-media" allowfullscreen="" frameborder="0" height="415" rel="0&autoplay=1&loop=1" src="https://www.youtube.com/embed/nHAwxMn5UR0?modestbranding=1" width="100%"></iframe>
 |
| Danh sách các video tham khảo khi kết thúc video |