Hình minh họa tiện ích “Bài viết liên quan” có hình đại diện thu nhỏ
Nếu thấy phù hợp với blog thì thực hiện tạo tiện ích này theo hướng dẫn sau.
< 1 > . Truy cập vào Blogger > Layout > Edit HTML
- Click vào ô chọn "Expand Widget Templates"
< 2 > . Tìm (Ctrl-F) đoạn code:
</head>
thay thế nó bằng đoạn code sau:
<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove --><b:if cond='data:blog.pageType == "item"'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinin-r4gdWdaEmCB04TYwQ2sscdywZLB95ZtsMc4khhGQ6clgQlYaUV26MUX2VGgCmrnva8XYLLaphdsWhQxcC1zpQjSywoPJbSpPdbhbvIwoTRd8CwEQQkz16mq_yw1nkindkItzyaFE/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Posts";
</script>
<script src='http://blogergadgets.googlecode.com/files/related-posts-with-thumbnails-for-blogger-pro.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
</head>
< 3 > . Tìm đoạn code:<!-- remove --><b:if cond='data:blog.pageType == "item"'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinin-r4gdWdaEmCB04TYwQ2sscdywZLB95ZtsMc4khhGQ6clgQlYaUV26MUX2VGgCmrnva8XYLLaphdsWhQxcC1zpQjSywoPJbSpPdbhbvIwoTRd8CwEQQkz16mq_yw1nkindkItzyaFE/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Posts";
</script>
<script src='http://blogergadgets.googlecode.com/files/related-posts-with-thumbnails-for-blogger-pro.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
</head>
<div class='post-footer-line post-footer-line-1'>
<p class='post-footer-line post-footer-line-1'>
<data:post.dody/>
<!-- Related Posts with Thumbnails Code Start-->
<!-- remove --><b:if cond='data:blog.pageType == "item"'><div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs("<data:post.url/>");
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://vntim.blogspot.com/2010/05/bai-viet-lien-quan-ho-tro-anh-thumbnail.html' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.vntim.tk/' style='display:none;'>blogger gadgets</a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End—>
< 4 > . Chỉnh sửa tiện ích cho phù hợp với Blog (chỉnh các thông số màu đỏ)<!-- remove --><b:if cond='data:blog.pageType == "item"'><div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs("<data:post.url/>");
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://vntim.blogspot.com/2010/05/bai-viet-lien-quan-ho-tro-anh-thumbnail.html' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.vntim.tk/' style='display:none;'>blogger gadgets</a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End—>
- Chỉnh sửa số bài hiển thị trong tiện ích:
var maxresults=5;
- Chỉnh sửa tiêu đề của tiện ích:
var relatedpoststitle="Related Posts";
var defaultnoimage=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinin-r4gdWdaEmCB04TYwQ2sscdywZLB95ZtsMc4khhGQ6clgQlYaUV26MUX2VGgCmrnva8XYLLaphdsWhQxcC1zpQjSywoPJbSpPdbhbvIwoTRd8CwEQQkz16mq_yw1nkindkItzyaFE/s400/noimage.png;
- Thay đổi màu sắc của dòng kẻ phân chia bài:var splittercolor="#d4eaf2";
<!-- remove --><b:if cond='data:blog.pageType == "item"'>
<!-- remove --></b:if>
nguồn bloggerplugins
nguồn bloggerplugins
No comments: