Ở
bài viết trước, Namkna đã giới thiệu đến các bạn tiện ích Recent Posts mang phong cách Báo tr
í. Nhận thấy đây là một style Recent post rất hay với một số tùy chỉnh nâng cao được rất nhiều bạn đọc yêu thích. Và cũng theo yêu cầu của một số bạn là làm sao cho tiện ích gọn hơn, sử dụng chung một file javascipts , nên hôm nay namkna sẽ chia sẻ đến các bạn một tùy biến nâng cao và cập nhật của style này.
Những cập nhật nâng cao mới :
- Thêm ảnh thunbile cho những bài viết không có ảnh minh họa
- Sử dụng chung một file Javarscipt chèn thẳng vào template. Tất cả trong 1 với Recent post tất cả các bài viết và recent post theo nhãn.
- Giao diện : bắt hơn so với style cũ....
- Khả năng SEO : thân thiện hơn với các SE) do chèn thêm thuộc tính Alternate cho Images
- Cài đặt đơn giản hơn: Tiết kiệm thời gian và dung lượng của template
- Thêm liên kết “xem thêm” kèm hình ảnh nhỏ xinh He...he...he...
Cách tiến hành!
1- Đăng nhập vào blog
2- CHọn
Mẫu (Template)
3- CHọn
chỉnh sửa HTML (Edit HTML)
4- Thêm đoạn code bên dưới trước thẻ
]]></b:skin>/*----------------------------------
Recent post Magazine for homepage blogger
Edit by: http://namkna.blogspot.com/
------------------------------------*/
.fl{float:left}
.fr{float:right}
.folder{width:516px; margin-bottom:8px; overflow:hidden; line-height:1.5em;font:normal 12px arial;border-left:1px solid #ddd;border-right:1px solid #ddd;border-bottom:1px solid #ddd;}
.folder-title{height:26px; border-bottom:1px solid #eee; overflow:hidden; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhW9kjVmQN0e08xjzEVvjlcHY9RiG7GxwVRfmpoeqEadOtfzqNj6tA2kKFg5YrvqfHWx8CwkNcdyD0cLNZM_2_VW1VPSu6iGiYvdOZEEDisHgYaRmXpevW_snfXU_Ht55zcq1cn93LXTuUS/h120/catalog_header_bg-namkna-blogspot-com.gif) repeat-x}
.folder-active{height:24px; padding:4px 10px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx250u9dETcOExm80DoI3nUTaxyruBFpLCbruKFJUGIQkQe1dDb58c7RzQBAqezS6wosnIZMIgECyi0whMxhuMtb_ARP8oj3rEl5i0mu0sXugASAleLV4gCiO_ztdCqtWS15-xZkde18CF/h120/parent_bg-namkna-blogspot-com.gif) repeat-x; font-weight:bold}
.link-folder:link, .link-folder:visited{color:#fff}
.subfolder{height:24px; padding:5px 5px 0 15px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJrrhu-gJLt8Lf4Me_zcY6aqC2fGu3W-XWMT068m3sOcE05bhm6Qlb4s1SbMdJYc4JedK5lNpGnyDxnKICK-8b4xynojD6J3iQh7Z1JTsXGrEnW7E4Z2yqTXlVu8sbXrmhwzd6RR7PZjre/h120/parent_child_spc-namkna-blogspot-com.gif) no-repeat}
.folder-content{width:500px; background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-b0fPNjSJgsgDeBa7pqVIyO8n2ALRc-JhVN0-xck4zozMKZawZaAlT6d9aCt0Na9Jy4DDPqNPkLYy64LC-HxyjoeuDE126csTdzELFAiDWLNtDvJyqu0T0obqFQ4u5EyUtbwDY15u1NQU/h120/red-box-content-namkna-blogspot-com.png) repeat-x left bottom; padding:10px 6px 2px 10px; overflow:hidden}
.folder-content p{margin:0}
.folder-content ul{list-style:none; margin:0; padding:0}
.folder-content li{padding:0 0 4px 6px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8Hojw0o7e6OIU0jJnZqMVnR1O6Fb-SIefK8DoKqP0l48RRcYmhyphenhyphenKQpwJJ4uJmMPUfinR6oEJTnfoh82s7BMmxZdsy-5tFh4qeFhPZtgLaItxhxIMtuOsOlIs2xTHb7VVl0qSOddE72Kwj/h120/icon-namkna-blogspot-com.gif) no-repeat 0 8px}
.folder-topnews{width:312px; padding-right:10px}
.folder-othernews{width:168px}
.other-folder{margin:0}
.img-subject{height:85px; width:110px; border:1px solid #a5a5a5; margin-right:8px}
.img-other{width:60px; height:50px; border:1px solid #a5a5a5; margin:0 5px 4px 0}
.xemthem{float:right; display:block; margin:0; padding:5px}
5- Thêm đoạn code dưới trước thẻ
</head><script type='text/javascript'>
//<![CDATA[
imgr = new Array();
showRandomImg = true;
summaryPost = 230;
numposts2 = 5;
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEial75ONGwzuN_oBo_qKFP8lzdgAZN6iprFujxc7l1shzA-EVV35e1pGPb_GjPpBorFx750YbUjjRPCWHscu1L_OnUENyjNybEPImfy7ZurooBA7teBxlpxczhWDJoxh25Df1GYarSMwDMX/s1600/noimage-namkna-blogspot-com.png";
aBold = true;
function removeHtmlTag(strx, chop) {
if (strx.indexOf("<") != -1) {
var s = strx.split("<");
for (var i = 0; i < s.length; i++) {
if (s[i].indexOf(">") != -1) {
s[i] = s[i].substring(s[i].indexOf(">") + 1, s[i].length)
}
}
strx = s.join("")
}
chop = (chop < strx.length - 1) ? chop : strx.length - 2;
while (strx.charAt(chop - 1) != ' ' && strx.indexOf(' ', chop) != -1) chop++;
strx = strx.substring(0, chop - 1);
return strx + ' [...]'
}
function showrecentposts2(e) {
j = (showRandomImg) ? Math.floor((imgr.length + 1) * Math.random()) : 0;
img = new Array();
for (var i = 0; i < numposts2; i++) {
var f = e.feed.entry[i];
var g = f.title.$t;
var h;
if (i == e.feed.entry.length) break;
for (var k = 0; k < f.link.length; k++) {
if (f.link[k].rel == 'alternate') {
h = f.link[k].href;
break
}
}
if ("content" in f) {
var l = f.content.$t
} else if ("summary" in f) {
var l = f.summary.$t
} else var l = "";
if (j > imgr.length - 1) j = 0;
img[i] = imgr[j];
s = l;
a = s.indexOf("<img");
b = s.indexOf("src=\"", a);
c = s.indexOf("\"", b + 5);
d = s.substr(b + 5, c - b - 5);
if ((a != -1) && (b != -1) && (c != -1) && (d != "")) img[i] = d;
if (i == 0) {
var m = '<div class="folder-topnews fl"><img src="' + img[i] + '" title="' + g + '" class="img-subject fl"><p style="padding-bottom:5px"><a href="' + h + '"><b>' + g + '</b></a></p><p>' + removeHtmlTag(l, summaryPost) + '</p><a href="' + h + '" class="xemthem">Xem thêm <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwz2gxsXJpkeJ_P-fwVyhNDy-o509yDrR5-OumNzObn0DK669WeyPKjQwKFTVYX4USnvTm3wf2CSUm42mCdBaNJPcRkwncRkfZualcMo70y6ppG6XTVt-KLBkhYjFUYtYgs1VuDs5lVhU/" alt="' + g + '"/></a></div>';
document.write(m)
}
if (i == 1) {
var m = '<div class="folder-othernews fl"><div class="other-folder fl"><img alt="" class="img-other fl" src="' + img[i] + '" alt="' + g + '"><a href="' + h + '">' + g + '</a></div>';
document.write(m)
}
if (i == 2) {
var m = '<div class="fl"><ul><li><a href="' + h + '">' + g + '</a></li>';
document.write(m)
}
if ((i > 2) && (i < numposts2 - 1)) {
var m = '<li><a href="' + h + '">' + g + '</a></li>';
document.write(m)
}
if (i == numposts2 - 1) {
var m = '<li><a href="' + h + '">' + g + '</a></li></ul></div></div>';
document.write(m)
}
j++
}
}
//]]>
</script>
6- Tìm đoạn mã sau:
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Bài đăng trên Blog' type='Blog'/>
</b:section>
- Thêm đoạn code dưới vào sau nó (Bạn cũng có thể thêm vào tiện ích HTML/Javarscip bên dưới bài đăng):
<!-- Recnet post all -->
<div class='folder'><div class='folder-title'><div class='folder-active fl'>
<a class='link-folder' href='http://namkna.blogspot.com/search/label/Blogspot%20Recent post?&max-results=5'>Recent post</a></div>
<div class='subfolder fl'>
<a class='link-subfolder' href='http://namkna.blogspot.com/search/label/Blogspot Menu?&max-results=5'>Menu</a> | <a class='link-subfolder' href='http://namkna.blogspot.com/search/label/Blogspot Navigation?&max-results=5'>Navigation</a> | <a class='link-subfolder' href='http://namkna.blogspot.com/search/label/Blogspot Comments?&max-results=5'>Comments</a> | <a class='link-subfolder' href='http://namkna.blogspot.com/search/label/Blogspot Popular posts?&max-results=5'>Popular posts</a></div></div><div class='folder-content' id='tdHomeFolder2'>
<script>
document.write("<script src=\"/feeds/posts/default?max-results="+numposts2+"&orderby=published&alt=json-in-script&callback=showrecentposts2\"><\/script>");
</script>
</div>
</div>
<!-- Nhãn 2 -->
<div class='folder'><div class='folder-title'><div class='folder-active fl'>
<a class='link-folder' href='http://namkna.blogspot.com/search/label/Blogspot%20Recent post?&max-results=5'>Recent post</a></div>
<div class='subfolder fl'>
<a class='link-subfolder' href='http://namkna.blogspot.com/search/label/Blogspot Menu?&max-results=5'>Menu</a> | <a class='link-subfolder' href='http://namkna.blogspot.com/search/label/Blogspot Navigation?&max-results=5'>Navigation</a> | <a class='link-subfolder' href='http://namkna.blogspot.com/search/label/Blogspot Comments?&max-results=5'>Comments</a> | <a class='link-subfolder' href='http://namkna.blogspot.com/search/label/Blogspot Popular posts?&max-results=5'>Popular posts</a></div></div><div class='folder-content' id='tdHomeFolder2'>
<script>
document.write("<script src=\"/feeds/posts/default/-/Tên nhan 1?max-results="+numposts2+"&orderby=published&alt=json-in-script&callback=showrecentposts2\"><\/script>");
</script>
</div>
</div>
<!-- nhãn 1 -->
<div class='folder'><div class='folder-title'><div class='folder-active fl'>
<a class='link-folder' href='http://namkna.blogspot.com/search/label/Blogspot%20Recent post?&max-results=5'>Recent post</a></div>
<div class='subfolder fl'>
<a class='link-subfolder' href='http://namkna.blogspot.com/search/label/Blogspot Menu?&max-results=5'>Menu</a> | <a class='link-subfolder' href='http://namkna.blogspot.com/search/label/Blogspot Navigation?&max-results=5'>Navigation</a> | <a class='link-subfolder' href='http://namkna.blogspot.com/search/label/Blogspot Comments?&max-results=5'>Comments</a> | <a class='link-subfolder' href='http://namkna.blogspot.com/search/label/Blogspot Popular posts?&max-results=5'>Popular posts</a></div></div><div class='folder-content' id='tdHomeFolder2'>
<script>
document.write("<script src=\"/feeds/posts/default/-/Tên nhan 2?max-results="+numposts2+"&orderby=published&alt=json-in-script&callback=showrecentposts2\"><\/script>");
</script>
</div>
</div>
7- Lưu mẫu lại:
Microsoft office là trình daanhs văn bản dành cho văn phòng rất phổ biến. Các bản cập nhật mới như: phiên bản office 2007, 2010, 2013 giúp người sử dụng dễ dàng hơn. Tuy nhiên không phải ai cũng tìm hiểu chuyên sau về các kỹ năng cơ bản như trình bày văn bản trong word. Để một văn bản Word đạt chuẩn kỹ năng thì có rất nhiều tiêu chí cần phải thỏa mãn được đưa ra. Ở đây Namkna hướng dẫn các bạn cách căn chỉnh lề trong word, một trong những tiêu chí trình bày word cơ bản cần thiết mà bài word nào cũng phải có. Đặc biệt trong những bài tiểu luận, báo cáo, khóa luận luận văn... các bạn phải đáp ứng được yêu cầu đưa ra.
