Chèn Video từ Youtube vào Blogspot trong khung Laptop có chức năng Responsive

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.

.tb_outer_wrap {
    width: 100%;
    max-width: 650px;
    margin: 15px auto;
}
.tb_video_wrap_macbook {
    position: relative;
    padding-bottom: 43%;
    padding-top: 0;
    height: 0;
    overflow: hidden;
    -webkit-border-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoTMiL9dJk5izlpotgwu29VgFd0YsGWQolSM_HM5OARkn_auN1SRE0OOXZaGvRc173IGykm1fG855U_fVPavr0ofnb25Vw3g9KNG73maYhRKuP5QA2KBplVkYTbfn5h_zDauLILtSkS2M/s1600/macbook+laptop+frame.png') 50 233 112 228 stretch stretch;
    -moz-border-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoTMiL9dJk5izlpotgwu29VgFd0YsGWQolSM_HM5OARkn_auN1SRE0OOXZaGvRc173IGykm1fG855U_fVPavr0ofnb25Vw3g9KNG73maYhRKuP5QA2KBplVkYTbfn5h_zDauLILtSkS2M/s1600/macbook+laptop+frame.png') 50 233 112 228 stretch stretch;
    -o-border-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoTMiL9dJk5izlpotgwu29VgFd0YsGWQolSM_HM5OARkn_auN1SRE0OOXZaGvRc173IGykm1fG855U_fVPavr0ofnb25Vw3g9KNG73maYhRKuP5QA2KBplVkYTbfn5h_zDauLILtSkS2M/s1600/macbook+laptop+frame.png') 50 233 112 228 stretch stretch;
    border-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoTMiL9dJk5izlpotgwu29VgFd0YsGWQolSM_HM5OARkn_auN1SRE0OOXZaGvRc173IGykm1fG855U_fVPavr0ofnb25Vw3g9KNG73maYhRKuP5QA2KBplVkYTbfn5h_zDauLILtSkS2M/s1600/macbook+laptop+frame.png') 50 233 112 228 stretch stretch;
    border-color: rgba(0, 0, 0, 0);
    border-width: 27px 76px 55px 76px;
    border-style: inset;
}
.tb_video_wrap_macbook iframe, .tb_video_wrap_macbook object, .tb_video_wrap_macbook embed {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #ddd;
}
@media (max-width: 500px) {
.tb_video_wrap_macbook {
    border-width: 20px 62px 40px 62px;
}
@media all and (max-width: 400px) {
.tb_video_wrap_macbook {
    border: none !important;
}
}  

Bước 2: Nhúng Video từ Youtube vào trong bài viết bằng cú pháp dưới đây:

<div class="tb_outer_wrap">
 <div class="tb_video_wrap_macbook">
<iframe width="560" height="315" src="https://www.youtube.com/embed/6bnUdWKrfd4?rel=0&amp;theme=dark&amp;controls=1&amp;showinfo=0&amp;autohide=0" frameborder="0" allowfullscreen=""></iframe>
 </div>
</div>  

Dưới đây là kết quả xem trước cho các bạn khó tính:

☼ Tùy chỉnh:

·        Thay phần tô màu vàng thành ID Video của bạn.

·        Các Bạn có thể thay đổi khung khác nhưng phải tùy chỉnh lại kích thước chiều cao và chiều rộng (Giống như khung hình Mình đã đưa ra ở trên).