Thêm hình nền cho video youtube ver 2
- Nhận đường liên kết
- Ứng dụng khác
Được đăng bởi TrollVL, 10/4/14.
T
Nguồn: TrollVL.Com
T
rước đây mình có giới thiệu đến độc giả của TrollVL một cách thêm hình nền cho video từ youtube tại bài viết này. Tuy nhiên cách này khác là phức tạp và dài dòng, vì thế hôm nay mình sẽ hướng dẫn các bạn một cách mới ngắn gọn hơn, cụ thể là bạn chỉ việc dán CSS và JS vào template một lần duy nhấtCSS
Các bạn thêm đoạn CSS sau đây vào template:Bạn có thể thay link hình ảnh màu đỏ bằng 1 trong số link dưới đây:Code:.youtube-tvl {background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjA8_oVORhsputPe6qv_Zpp8dHBp75vwIIEDY9fkxEiwzCT7iVSIthJ6OqsukmYZmA3m9x5CRGfqKFuqPrto9ifq-TQXBy6UvswOwikKP9A2sTXsDuGhrZNaRaFKdxvR_KYtVNP42qQTL_B/s1600/troll-frame.png') no-repeat scroll left top transparent; height: 364px; margin: 0px auto; padding: 19px 0px 0px 22px; text-align: left; width: 532px}
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjA8_oVORhsputPe6qv_Zpp8dHBp75vwIIEDY9fkxEiwzCT7iVSIthJ6OqsukmYZmA3m9x5CRGfqKFuqPrto9ifq-TQXBy6UvswOwikKP9A2sTXsDuGhrZNaRaFKdxvR_KYtVNP42qQTL_B/s1600/troll-frame.png
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGX0GtmqKomEAtpDuOGayXiGPdHHb6peNKKzBTM0N25KMKxu8H7RKZ4PrA41NkscrRwJCNyNZ6_8c_j0cZdSQDj-nz3aBdtCOYjsQhoe7yGWik79SPyV3NUPINxAQXvG7rM2ElEVcDjhsy/s1600/frametvl1.png
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcS2_n7KXKZz-04Vpd25yFPdbRF4FLGdqs1bPtqqXjHQE3olw6Kc4-BGucye_JDHOyoc-tWb9RO2YjajQvxLaAxkvvWpbDalv_Q9vDlkFHL4VCHQQCbrYVntc4JRbR0l5LuObUGQ__DzWY/s1600/frametvl3.png
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVKawxbSSJnXq3nEsryxdq8alVVYYYW4KyDnsucycVCuJgTvCEgsYaykVBY2z0-gbgxpkJ32IoGhLwqM1ewX7-KgaaeN2f_BSTKzG5xUbbtzg524XeDjcrcuHgAVcVorExnRTiDTiwUUY8/s1600/frametvl2.png
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhA5YR7bqkAT8cQAqpafmadnVEmXjEv_61rvRlM3pW1aUotrDRsX6LjRCfh8hGCuc2cW48aRZ7J8-izm8h2V_PWZh_4WMEAqlLf-hiVNUeOZXWmxa5Ej4DxDNQBeO95vpB84hMttyGqghQt/s1600/frametvl4.png
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz-xemFQOekPBMGtVKnD_sl8eJTYt-EO2D46wkPE4-NlAD6PzlxIB85l5OtGKiBc95eXX08EXkA4QzwNK71-6hA79hF98ZE5jpGI8obHFUibckR5Ji9l6lUe6qMJCmb5uywRaZljy54OjK/s1600/tvl-frame.png
Javascript
Chèn đoạn JS bên dưới vào trước thẻ đóng </body> sau đó lưu lạiThực hiện khi viết bàiCode:<script type='text/javascript'> //<![CDATA[ var _0xaa5c=["\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x79\x6F\x75\x74\x75\x62\x65\x2D\x74\x76\x6C\x22\x3E\x3C\x69\x66\x72\x61\x6D\x65\x20\x77\x69\x64\x74\x68\x3D\x22\x35\x30\x30\x22\x20\x68\x65\x69\x67\x68\x74\x3D\x22\x33\x30\x30\x22\x20\x73\x72\x63\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x77\x77\x77\x2E\x79\x6F\x75\x74\x75\x62\x65\x2E\x63\x6F\x6D\x2F\x65\x6D\x62\x65\x64\x2F\x24\x31\x22\x20\x66\x72\x61\x6D\x65\x62\x6F\x72\x64\x65\x72\x3D\x22\x30\x22\x20\x61\x6C\x6C\x6F\x77\x66\x75\x6C\x6C\x73\x63\x72\x65\x65\x6E\x3E\x3C\x2F\x69\x66\x72\x61\x6D\x65\x3E\x3C\x2F\x64\x69\x76\x3E","\x72\x65\x70\x6C\x61\x63\x65","\x68\x74\x6D\x6C","\x62\x6F\x64\x79"];var _0x7554=[_0xaa5c[0],_0xaa5c[1],_0xaa5c[2],_0xaa5c[3]];var _0x677d=[_0x7554[0],_0x7554[1],_0x7554[2],_0x7554[3]];$(_0x677d[3])[_0x677d[2]](function (_0xd813x3,_0xd813x4){return _0xd813x4[_0x677d[1]](/(?:http:\/\/)?(?:www\.)?(?: youtube\.com|youtu\.be)\/(?:watch\?v=)?(.+)/g,_0x677d[0]);} ); //]]> </script>
Từ giờ các bạn chỉ việc dán link youtube vào khung soạn thảo bài viết hệ thống khác tự động đổi từ link sang mã nhúng kèm hình nền. Ví dụ:Lưu ý: Template bạn phải có jQuery thì thủ thuật này mới hoạt động nhé!Code:http://youtu.be/b8j429UdkzQ http://www. youtube.com/watch?v=b8j429UdkzQ
Nguồn: TrollVL.Com
- Nhận đường liên kết
- Ứng dụng khác
Nhận xét