Việc nhúng video từ youtube vào Blogspot theo Tôi nghĩ là một việc vô cùng đơn giản, hầu như các Blogger đều biết. Nhưng nếu các bạn thêm Video từ Youtube trực tiếp vào Blog mà không nhờ các đoạn CSS tạo hiệu ứng thì các Video bạn nhúng vào Blog sẽ vô cùng đơn điệu.
Đặc biệt là các Blog xem Tivi online, Blog Phim hay đơn thuần là các Blog lưu trữ video cá nhân mà được nhúng từ Youtube. Trong hướng dẫn này, tôi sử dụng một hình ảnh chứa khung Tivi để nhúng các đoạn Video từ Youtube. Khi độc giả truy cập vào Blog của bạn sẽ nghĩ rằng họ đang xem một chiếc Tivi ^^!
☼ Giờ bắt đầu thủ thuật nào.
Bước 1: Vào Blog => Mẫu => Chỉnh sửa HTML. Nhấn tổ hợp phím Ctrl + F và tìm đến thẻ </b:skin>. Sau đó dán đoạn mã Code sau ở phía trên thẻ </b:skin> và Lưu mẫu lại.
.BloggerSpice-video-Share{background:url(http://4.bp.blogspot.com/-17ioTkYMmoI/UlDrP5WMLGI/AAAAAAAAE6c/ey2exFn_Mbk/s1600/BS+Monitor.png) no-repeat top center;height:458px;width:580px;padding-top:38px;padding-left:72px;;margin-left:30px} Bạn nên tùy biến đoạn CSS này cho phù hợp với cấu trúc code trong Blog của bạn <Đặc biệt là cấu trúc ở phần hiển thị nội dung bài viết>
Bước 2: Nhúng (Chèn) Video từ Youtube vào trong bài viết bằng cú pháp dưới đây.
<div class="BloggerSpice-video-Share">
<iframe allowfullscreen="" frameborder="0" height="283" src="//www.youtube.com/embed/kHj7fqbNaQw?feature=player_embedded" width="511"></iframe>
</div>
☼ Tùy chỉnh:
· Đường link bôi màu xanh bạn thay bằng đường link video từ Youtube mà bạn muốn nhúng (Chèn)vào.
· Phần bôi màu đỏ là chiều cao và chiều rộng của đoạn Video từ Youtube khi bạn nhúng vào Blog.
· Việc tùy biến khung (hình ảnh chứa khung Tivi) chứa video bạn phải làm thủ công (Nghĩa là xác định trước chiều cao và chiều rộng của khung)…Tóm tại vì mỗi Template khác nhau có cấu trúc Code khác nhau. Vì lý do này đòi hỏi bạn phải có một ít kiến thức về tùy biến. Hơi khó hiểu đúng nào ^^!
Dưới đây là DEMO Tôi đã tùy biến với các kích thước nhau các bạn có thể tham khảo qua:
Chúc các bạn thành công !
0 nhận xét:
Đăng nhận xét