Với tiện ích này khi bạn nhúng code lấy từ Youtube vào blog thì nó sẽ tự động lấy ảnh thumbnail bạn không cần phải upload hình ảnh kèm theo trong khi đang bài viết nữa. Những video trong cùng 1 nhãn sẽ được hiển thị ngay bên dưới video mà bạn đang xem.
1. Đăng nhập vào tài khoản Blogger
2. Vào phần thiết kế (Design)
3. Chọn chỉnh sửa HTML (Edit HTML)
4. Chọn mở rộng mẫu tiện ích (Expand Widget Templates)
5. Chèn code bên dưới vào sau thẻ <head>
<script src='http://traidatmuidata.appspot.com/scripts/related_video_youtube.js' type='text/javascript'></script>
<script type='text/javascript'>
var relatedvideos = 5; //số bài viết hiển thị trong tiện ích
var showpostthumbnails = true;
var displaymore = true;
var displayseparator = true;
var showcommentnum = true;
var showpostdate = true;
var showpostsummary = true;
var numchars = 50;
</script>
6. Chèn tiếp code CSS bên dưới vào trước thẻ ]]></b:skin>
.relatedvideo {
padding:2px 2px 0px 2px;
font-size:12px;
display:block;
background:#eee;
width:100px;
float:left;
border:1px solid #ccc;
border-radius:5px;
margin:0 8px 8px 0px;}
.relatedvideo h3{height:45px;padding:5px 2px 4px 2px;margin:0;line-height:0.8em!important;}
.relatedvideo h3 a{
font-weight:bold;
text-decoration:none;
color:#333!important;
font-size:12px;}
.relatedvideo h3 a:hover{
color:#666;
text-decoration:underline;}
.related_thumb {
margin:0px;
width:94px;
height:80px;
padding:0px;
}
.related_thumb:hover {
filter: alpha(opacity:0.7);
KHTMLOpacity: 0.7;
MozOpacity: 0.7;
-khtml-opacity:.70;
-ms-filter:"alpha(opacity=70)";
-moz-opacity:.70;
filter:alpha(opacity=70);
opacity:.70;
}
7. Tìm đến dòng code như bên dưới hoặc tương tự
<div class='post-footer-line post-footer-line-3'/>
8. Tiếp theo chèn đoạn code bên dưới ngay sau code vừa tìm được ở trên
b:if cond='data:blog.pageType == "item"'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?orderby=published&alt=json-in-script&callback=relatedvideo"' type='text/javascript'/>
</b:if>
</b:loop>
</b:if>
9. Cuối cùng save template lại là xong.
DOWNLOAD FILE .JS
http://traidatmuidata.appspot.com/scripts/related_video_youtube.js
OR
http://www.mediafire.com/?d5ro69g86ui9sa0
http://www.traidatmui.com/2012/06/thu-thuat-tao-tien-ich-video-lien-quan.html
No comments:
Post a Comment