Saturday, August 22, 2015

Nhúng video Facebook responsive vào website

Chào các bạn, hôm trước mình có bài hướng dẫn nhúng video Facebook vào website, tuy nhiên vẫn chưa thỏa mãn được yêu cầu của một số bạn. Tính năng responsive đúng là rất quan trọng, do vậy hôm nay mình xin hướng dẫn cách nhúng video Facebook responsive vào website một cách dễ dàng nhất.
Xem code nhúng video Facebook vào web
Nhúng video Facebook responsive vào website
Ok, đầu tiên bạn cần thêm đoạn code này vào trong phần Header của trang
.video-container { position: relative;} .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
Sau đó cứ mỗi lần bạn nhúng video Facebook vào website thì bạn sử dụng đoạn code này
<div class="video-container">
Chèn code nhúng video vào đây
</div>
Nó sẽ có dạng như thế này
<div class="video-container">
<div class="fb-video" data-href="https://www.facebook.com/facebook/videos/945992622124637/" data-width="500"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/facebook/videos/945992622124637/"><a href="https://www.facebook.com/facebook/videos/945992622124637/">How to Share With Just Friends</a><p>How to share with just friends.</p>Posted by <a href="https://www.facebook.com/facebook">Facebook</a> on 5 Tháng 12 2014</blockquote></div></div>
</div>
Như vậy là xong. Bạn có thể test thử. Còn dưới đây là ví dụ của mình
How to Share With Just Friends
How to share with just friends.
Posted by Facebook on 5 Tháng 12 2014