Đồ họa
Blogspot
Phần mềm
Photoshop
File PhotoshopTiện ích Bài viết mới Recent Posts giống vnexpress.net
05:42 |Từ sau khi hoàn thiện thủ thuật "Recent posts" hiện thị giống trang tin247.com, mình nảy ý định hiển thị nhiều kiểu khác nhau cho các bài viết trong widget "Recent posts". Tức là bài này hiển có kèm ảnh thumbnail , bài khác thì chỉ hiển thị tiêu đề... Với cách này, tiện ích Recent posts của chúng ta sẽ không còn đơn điệu nữa.
☼ Và đây là toàn bộ code của thủ thuật :
- Chỉ việc tạo 1 widget HTML/Javascript và dán tất cả code bên dưới vào:
Để hiểu rõ hơn cho việc chỉnh sửa độ rộng của khung, các bạn xem hình bên dưới:
- Tùy chỉnh lại số bài viết để việc hiển thị được hợp lý nhất.
- Tùy chỉnh lại các độ rộng theo ý bạn.
- Lưu ý với việc điều chỉnh độ rộng của class bottom-news , độ rộng của class này phải lớn hơn con số : 4x(botwidth + 2px + 4px) + 4x5px = 444px (vớibotwidth=100px), nếu độ rộng của class này nhỏ hơn con số trên, các bài viết sẽ bị tràn xuống hàng ở class bottom-news.
- Độ rộng của class bottom-news-item : botwidth + 2px + 4px = 106px;
- Link JS dự phòng :
<script src="http://sites.google.com/site/fdblogsite/js/vne-recent.txt" type="text/javascript"></script>
☼ Cập nhật bản khác của thủ thuật (bản hiển thị 3 bài viết ở class bottom-news):
Hình minh họa:
- Code của thủ thuật : ở đây mình sẽ đưa code đã chỉnh sửa sẵn, cho các bạn tiện sử dụng.
- Nhưng code màu đỏ là nhưng chỗ mà mình đã chỉnh sửa lại.
- link file JS dự phòng:
<script src="http://sites.google.com/site/fdblogsite/js/vne-recent%28fix%29.txt" type="text/javascript"></script>
☼ Bản nâng cao của thủ thuật
- Với bản nâng cao này, các bạn có thể tùy chỉnh số bài viết ở class bottom-news.
- Code của thủ thuật sẽ thay đổi 1 chút như bên dưới:
...
...
...
summaryPost = 100;
summaryFontsize = 12;
summaryColor = "#000";
botnum = 3;
numposts = 16;
label = "Love";
home_page = "http://fandung.blogspot.com/";
</script>
<script src="http://data.fandung.com/blog/demo/vne-recent/vne-recent-adv.js" type="text/javascript"></script>
- với code botnum = 3; là code điều chỉnh số bài viết hiển thị ở class bottom-news
- Với bản nâng cao này, đòi hỏi bạn phải chỉnh sửa nhiều về phần kích thước trong code CSS để có được hiển thị như mong muốn.
- link file JS dự phòng:
<script src="http://sites.google.com/site/fdblogsite/js/vne-recent-adv.txt" type="text/javascript"></script>
2. Tạo một widget HTML/JavaScripts và chèn vào đoạn code bên dưới
☼ Và đây là toàn bộ code của thủ thuật :
- Chỉ việc tạo 1 widget HTML/Javascript và dán tất cả code bên dưới vào:
<style type="text/css">
#cotent-news {
border:#999 solid 1px;
width: 650px;
}
#top-news {
width: 440px;
height:166px;
padding:5px;
border:#bbb solid 1px;
background:#eee;
font-size:12px;
}
#bottom-news {
width: 444px;
padding:5px;
}
#bottom-news-item {
width: 106px;
margin-right:5px;
float:left;
}
#left-news {
padding:5px;
border-left:2px dotted #ccc;
}
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";
imgico= "http://farm3.static.flickr.com/2426/3638176588_31366a6822_o.gif";
showRandomImg = true;
topwidth = 160;
topheight = 160;
botheight = 100;
botwidth = 100;
fntsize = 12;
vnesize = 18; //kích thước của tiêu đề bài viết trong class "top-news"
acolor = "#555";
cmcolor = "#555";
topcolor = "#f00";
aBold = true;
text = "comments";
showPostDate = true;
summaryPost = 250;
summaryFontsize = 12;
summaryColor = "#000";
numposts = 17;
label = "Love";
home_page = "http://fandung.blogspot.com/";
</script>
<script src="http://data.fandung.com/blog/demo/vne-recent/vne-recent.js" type="text/javascript"></script>
#cotent-news {
border:#999 solid 1px;
width: 650px;
}
#top-news {
width: 440px;
height:166px;
padding:5px;
border:#bbb solid 1px;
background:#eee;
font-size:12px;
}
#bottom-news {
width: 444px;
padding:5px;
}
#bottom-news-item {
width: 106px;
margin-right:5px;
float:left;
}
#left-news {
padding:5px;
border-left:2px dotted #ccc;
}
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";
imgico= "http://farm3.static.flickr.com/2426/3638176588_31366a6822_o.gif";
showRandomImg = true;
topwidth = 160;
topheight = 160;
botheight = 100;
botwidth = 100;
fntsize = 12;
vnesize = 18; //kích thước của tiêu đề bài viết trong class "top-news"
acolor = "#555";
cmcolor = "#555";
topcolor = "#f00";
aBold = true;
text = "comments";
showPostDate = true;
summaryPost = 250;
summaryFontsize = 12;
summaryColor = "#000";
numposts = 17;
label = "Love";
home_page = "http://fandung.blogspot.com/";
</script>
<script src="http://data.fandung.com/blog/demo/vne-recent/vne-recent.js" type="text/javascript"></script>
Để hiểu rõ hơn cho việc chỉnh sửa độ rộng của khung, các bạn xem hình bên dưới:
- Tùy chỉnh lại số bài viết để việc hiển thị được hợp lý nhất.
- Tùy chỉnh lại các độ rộng theo ý bạn.
- Lưu ý với việc điều chỉnh độ rộng của class bottom-news , độ rộng của class này phải lớn hơn con số : 4x(botwidth + 2px + 4px) + 4x5px = 444px (vớibotwidth=100px), nếu độ rộng của class này nhỏ hơn con số trên, các bài viết sẽ bị tràn xuống hàng ở class bottom-news.
- Độ rộng của class bottom-news-item : botwidth + 2px + 4px = 106px;
- Link JS dự phòng :
<script src="http://sites.google.com/site/fdblogsite/js/vne-recent.txt" type="text/javascript"></script>
☼ Cập nhật bản khác của thủ thuật (bản hiển thị 3 bài viết ở class bottom-news):
- Code của thủ thuật : ở đây mình sẽ đưa code đã chỉnh sửa sẵn, cho các bạn tiện sử dụng.<style type="text/css">
#cotent-news {
border:#999 solid 1px;
width: 530px;
}
#top-news {
width: 330px;
height:126px;
padding:5px;
border:#bbb solid 1px;
background:#eee;
font-size:12px;
}
#bottom-news {
width: 333px;
padding:5px;
}
#bottom-news-item {
width: 106px;
margin-right:5px;
float:left;
}
#left-news {
padding:5px;
border-left:2px dotted #ccc;
}
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";
imgico= "http://farm3.static.flickr.com/2426/3638176588_31366a6822_o.gif";
showRandomImg = true;
topwidth = 120;
topheight = 120;
botheight = 100;
botwidth = 100;
fntsize = 12;
vnesize = 16;
acolor = "#555";
cmcolor = "#555";
topcolor = "#f00";
aBold = true;
text = "comments";
showPostDate = true;
summaryPost = 100;
summaryFontsize = 12;
summaryColor = "#000";
numposts = 16;
label = "Love";
home_page = "http://fandung.blogspot.com/";
</script>
<script src="http://data.fandung.com/blog/demo/vne-recent/vne-recent(fix).js" type="text/javascript"></script>
#cotent-news {
border:#999 solid 1px;
width: 530px;
}
#top-news {
width: 330px;
height:126px;
padding:5px;
border:#bbb solid 1px;
background:#eee;
font-size:12px;
}
#bottom-news {
width: 333px;
padding:5px;
}
#bottom-news-item {
width: 106px;
margin-right:5px;
float:left;
}
#left-news {
padding:5px;
border-left:2px dotted #ccc;
}
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";
imgico= "http://farm3.static.flickr.com/2426/3638176588_31366a6822_o.gif";
showRandomImg = true;
topwidth = 120;
topheight = 120;
botheight = 100;
botwidth = 100;
fntsize = 12;
vnesize = 16;
acolor = "#555";
cmcolor = "#555";
topcolor = "#f00";
aBold = true;
text = "comments";
showPostDate = true;
summaryPost = 100;
summaryFontsize = 12;
summaryColor = "#000";
numposts = 16;
label = "Love";
home_page = "http://fandung.blogspot.com/";
</script>
<script src="http://data.fandung.com/blog/demo/vne-recent/vne-recent(fix).js" type="text/javascript"></script>
- Nhưng code màu đỏ là nhưng chỗ mà mình đã chỉnh sửa lại.
- link file JS dự phòng:
<script src="http://sites.google.com/site/fdblogsite/js/vne-recent%28fix%29.txt" type="text/javascript"></script>
☼ Bản nâng cao của thủ thuật
- Với bản nâng cao này, các bạn có thể tùy chỉnh số bài viết ở class bottom-news.
- Code của thủ thuật sẽ thay đổi 1 chút như bên dưới:
...
...
...
summaryPost = 100;
summaryFontsize = 12;
summaryColor = "#000";
botnum = 3;
numposts = 16;
label = "Love";
home_page = "http://fandung.blogspot.com/";
</script>
<script src="http://data.fandung.com/blog/demo/vne-recent/vne-recent-adv.js" type="text/javascript"></script>
- với code botnum = 3; là code điều chỉnh số bài viết hiển thị ở class bottom-news
- Với bản nâng cao này, đòi hỏi bạn phải chỉnh sửa nhiều về phần kích thước trong code CSS để có được hiển thị như mong muốn.
- Xem hình minh họa bên dưới:
- link file JS dự phòng:<script src="http://sites.google.com/site/fdblogsite/js/vne-recent-adv.txt" type="text/javascript"></script>
Một hướng dẫn khác:
Hôm nay Chip giới thiẹu chia sẻ cho các bạn thủ thuật recent Post mà Chip đang áp dụng trên Blog Điện Tử | Tin Học.share luôn cho bác Quangpro
►Thực hiện cách 1 nhanh gọn nhưng load chậm trang:
1. Vào Thiết kế > Phần tử trang
<style type="text/css">
#cotent-news {
border:#999 solid 1px;
width: 650px;
}
#top-news {
width: 440px;
height:166px;
padding:5px;
border:#bbb solid 1px;
background:#eee;
font-size:12px;
}
#bottom-news {
width: 444px;
padding:5px;
}
#bottom-news-item {
width: 106px;
margin-right:5px;
float:left;
}
#left-news {
padding:5px;
border-left:2px dotted #ccc;
}
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";
imgico= "http://farm3.static.flickr.com/2426/3638176588_31366a6822_o.gif";
showRandomImg = true;
topwidth = 160;
topheight = 160;
botheight = 100;
botwidth = 100;
fntsize = 12;
vnesize = 18; //kích thước của tiêu đề bài viết trong class "top-news"
acolor = "#555";
cmcolor = "#555";
topcolor = "#f00";
aBold = true;
text = "comments";
showPostDate = true;
summaryPost = 250;
summaryFontsize = 12;
summaryColor = "#000";
botnum = 4;
numposts = 14;
label = "Hardware";
home_page = "http://www.chipkool.blogspot.com/";
</script>
<script src="https://sites.google.com/site/itechroot/javascripts/vne-recent-adv-all-posts.txt" type="text/javascript"></script>
* Trong đoạn code trên :
o width: 650px; : chiều rộng của widget
o botnum = 4; : số bài viết hiển thị ở class bottom-news
· numposts = 14; : số bài viết hiển thị ở class left-news
· label = "Hardware"; : nhãn/ trương mục ( Label ) sẽ được hiển thị
Các bạn có thể xem hình minh họa bên dưới để hiểu rõ layout của widget :
Bạn chú ý: thay Link http://chipkool.blogspot.com thành link blog của bạn:
* Cách tính chiều rộng :
o bottom-news = 4x(botwidth + 2px + 4px) + 4x5px = 444px
· bottom-news-item = botwidth + 2px + 4px = 106px
* Nếu bạn muốn widget hiển thị những bài cho Label thì thay code
https://sites.google.com/site/itechroot/javascripts/vne-recent-adv-all-posts.txt
thành :
https://sites.google.com/site/itechroot/javascripts/vne-recent-adv.txt
►Thực hiện cách 2 load nhanh hơn:
B1:Vào chỉnh sửa Html -Chọn mở rộng mẫu tiện ích - nhấn Ctr+F - Tìm mã code sau:]]></b:skin>
B2:copy hết code sau và chèn lên phía trên code vừa tìm được:
#cotent-news {
border:#999 solid 1px;
width: 650px; }
#top-news {
width: 440px;
height:166px; padding:5px;
border:#bbb solid 1px;
background:#eee;
font-size:12px;
}
#bottom-news {
width: 444px; padding:5px;
}
#bottom-news-item {
width: 106px;
margin-right:5px;
float:left;
}
#left-news {
padding:5px;
border-left:2px dotted #ccc;
}
B3:Tạo một widget HTML/JavaScripts và chèn vào đoạn code bên dưới :
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";
imgico= "http://farm3.static.flickr.com/2426/3638176588_31366a6822_o.gif";
showRandomImg = true;
topwidth = 160;
topheight = 160;
botheight = 100;
botwidth = 100;
fntsize = 12;
vnesize = 18; //kích thước của tiêu đề bài viết trong class "top-news"
acolor = "#555";
cmcolor = "#555";
topcolor = "#f00";
aBold = true;
text = "comments";
showPostDate = true;
summaryPost = 250;
summaryFontsize = 12;
summaryColor = "#000";
botnum = 4;
numposts = 14;
label = "Hardware";
home_page = "http://www.chipkool.blogspot.com/";
</script>
<script src="https://sites.google.com/site/itechroot/javascripts/vne-recent-adv-all-posts.txt" type="text/javascript"></script>
Style 2 : Recent Post mang phong cách VNExpress
Thực hiện cách 1 khó sửa khi sai xót nặng temple:
1. Vào Thiết kế > Chình sửa HTML
2. Chèn đoạn code bên dưới vào trước thẻ đóng</head>
<style type='text/css'>
.fl {float:left;}
.fr {float:right;}
.folder, .folder-title, .folder-content, .folder-bottom, .folder-header, .folder-top, .folder-news {position:relative;}
.folder-content {background-color:#ffffff;}
.other-folder {width:100%;}
.folder, .folder-title, .folder-content, .folder-bottom, .folder-header, .folder-top, .folder-news {overflow:hidden;}
.folder, .folder-title, .folder-bottom {width:500px;}
.folder-bottom {background:#f5f5f6 url('http://vnexpress.net/Images/Background/bg_vne.gif') repeat-x 0px -73px;}
.folder {margin-bottom:5px;}
.folder-title {height: 21px;}
.folder-active, .subfolder {height: 17px;}
.folder-title {font:11px arial; color:#868d9d; background:#f5f5f6 url('http://vnexpress.net/Images/Background/bg_repeat.gif') repeat-x scroll 0px 0px;}
.folder-active {padding: 2px 9px; background:#f5f5f6 url('http://vnexpress.net/Images/Background/bg_repeat.gif') repeat-x 0px -23px;}
.folder-content {width:478px; padding:5px 10px 5px;font:12px arial; border-left:1px solid #d5d8de; border-right:1px solid #d5d8de;}
.folder-bottom {height:5px;}
.folder-topnews {width:298px; padding-right:20px;}
.folder-othernews {width:160px;}
.folder-news {width:478px; padding:0px 11px; margin-bottom:10px;}
.folder-news p{padding:0; margin-top:0px; margin-bottom:5px;}
.subfolder {padding: 3px 5px 1px;}
.link-folder {font:bold 12px arial; color:#8a0000; text-decoration:none;}
.link-subfolder {font:11px arial; color:#003f7a; text-decoration:none;}
.link-title {font:bold 13px arial; text-decoration:none; color:#000000;}
.link-title:visited {color:#004080;}
.link-othernews {text-decoration:none; color:#000000;font:12px arial;}
.link-othernews:visited {color:#004080;}
.link-othernews:hover {text-decoration:underline;}
.folder-content p{margin-top:0px;margin-bottom:4px;}
.folder-content ul {list-style:none;margin:0;padding:0;}
.folder-content li {
padding-left:6px;
background-image:url('http://vnexpress.net/Images/Background/black-square.gif'); background-repeat:no-repeat;
background-position: 0 7px;
}
.other-folder {margin-bottom:5px;}
.img-subject {height:100px; border:1px solid #a5a5a5; margin-right:8px; margin-top:2px;}
.img-other {width:53px; height:53px; border:1px solid #a5a5a5; margin-right:5px;}
.folder-activeleft{width:2px; height:21px; background:#f4f5f6 url('http://vnexpress.net/Images/Background/bg_corner.gif') no-repeat -5px -0px;}
.folder-activeright{width:2px; height:21px; background:#f4f5f6 url('http://vnexpress.net/Images/Background/bg_corner.gif') no-repeat -5px -23px;}
.Lead1 { font-family: 'Arial'; font-size: 11px; color: #919090; font-weight: bold }
</style>
<script type='text/javascript'>
rdlabels = new Array(3);
//Nhãn thứ 1 : Kiến thức căn bản
rdlabels[0] = "\<script\>label = 'OSystemK'\;\</script\>";
//Nhãn thứ 2 : Thủ thuật
rdlabels[1] = "\<script\>label = 'OSystemT'\;\</script\>";
//Nhãn thứ 3 : Phần mềm
rdlabels[2] = "\<script\>label = 'Download'\;\</script\>";
//Nhãn thứ 4 : Phần mềm bản quyền
rdlabels[3] = "\<script\>label = 'License'\;\</script\>";
index = Math.floor(Math.random() * rdlabels.length);
</script>
3. Tạo một widget HTML/JavaScripts và chèn vào đoạn code bên dưới :
<div class="folder">
<div class="folder-title">
<div class="folder-activeleft fl"></div>
<div class="folder-active fl"><a class="link-folder" href="http://www.itechplus.info/search/label/OSystem?max-results=10">Windows</a></div>
<div class="folder-activeright fl"></div>
<div class="subfolder fl">
<a class="link-subfolder" href="http://www.itechplus.info/search/label/OSystemK?max-results=10">Kiến thức</a> | <a class="link-subfolder" href="http://www.itechplus.info/search/label/OSystemT?max-results=10">Thủ thuật</a> | <a class="link-subfolder" href="http://www.itechplus.info/search/label/Download?max-results=10">Phần mềm</a> | <a class="link-subfolder" href="http://www.itechplus.info/search/label/License?max-results=10">Free License</a>
</div>
<div class="folder-titleright fr"></div>
</div>
<div class="folder-content" id="tdHomeFolder2">
<script type="text/javascript">
document.write(rdlabels[index]);
</script>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";
showRandomImg = true;
aBold = false;
summaryPost = 247;
sumPost = 147;
numposts = 6;
home_page = "http://www.itechplus.info/";
</script>
<script src="https://sites.google.com/site/itechroot/javascripts/VnE-recent.txt" type="text/javascript"></script>
</div>
<div class="folder-bottom"></div>
</div>
Trong 2 đoạn code trên :
o width:500px; : chiều rộng của cả widget
o width:478px; : chiều rộng phần nội dung widget
o width:298px; : chiều rộng phần nội dung bên trái
o width:160px; : chiều rộng phần nội dung bên phải
o height:100px; : chiều rộng ảnh bài viết mới nhất
o width:53px; height:53px; : chiều rộng & chiều cao ảnh bài viết đầu tiên bên phải
o rdlabels[x] : tên của mảng tương ứng với Label. Nếu bạn không gán cụ thể, nội dung của tiện ích sẽ hiển thị một cách ngẫu nhiên theo nhãn.
· summaryPost = 247; : số ký tự đoạn mô tả bài viết chính
· sumPost = 147; : số ký tự tiêu đề bài viết
· numposts = 6; : tổng số bài viết được hiển thị trên mỗi widget
Để hiểu rõ hơn bố cục của Widget, các bạn có thể xem hình dưới :
Thực hiện cách 2 đẹp hơn,có thêm nút xem thêm tạo cho nhiều label trên trang chủ:
B1:Vào Chỉnh sửa html - Mở rộng mẫu tiện ích- nhấn ctrl + F - tìm code sau]]></b:skin>
B2:Copy hết code sau và chèn lên phí trên code vừa tìm được:
.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(http://goo.gl/CyQBL)repeat-x}
.folder-active{height:24px; padding:4px 10px; background:url(http://goo.gl/EgxmY) repeat-x; font-weight:bold}
.link-folder:link, .link-folder:visited{color:#fff}
.subfolder{height:24px; padding:5px 5px 0 15px; background:url(http://goo.gl/Z29yN) no-repeat}
.folder-content{width:500px; background:#fff url(http://goo.gl/qy9iZ) 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(http://goo.gl/4OvNo) no-repeat 0 8px}
.folder-topnews{width: 398px; padding-right:10px}
.folder-othernews{width:220 px}
.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}
.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(http://goo.gl/CyQBL)repeat-x}
.folder-active{height:24px; padding:4px 10px; background:url(http://goo.gl/EgxmY) repeat-x; font-weight:bold}
.link-folder:link, .link-folder:visited{color:#fff}
.subfolder{height:24px; padding:5px 5px 0 15px; background:url(http://goo.gl/Z29yN) no-repeat}
.folder-content{width:500px; background:#fff url(http://goo.gl/qy9iZ) 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(http://goo.gl/4OvNo) no-repeat 0 8px}
.folder-topnews{width: 398px; padding-right:10px}
.folder-othernews{width:220 px}
.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}
B3:Tạo 1 Javar/script rồi chèn code sau vào:
<div class="folder"><div class="folder-title"><div class="folder-activeleft fl"></div>
<div class="folder-active fl"><a class="link-folder" href="http://www.chipkool.tk/search/label/Th%E1%BB%A7%20Thu%E1%BA%ADt%20Vi%20t%C3%ADnh?max-results=10">Thủ thuật vi tính</a></div>
<div class="folder-activeright fl"></div><div class="subfolder fl">
<a class="link-subfolder" href="http://www.chipkool.tk/search/label/S%E1%BB%A9c%20m%E1%BA%A1nh%20s%E1%BB%91?max-results=10">Sức mạnh số</a> |
<a class="link-subfolder" href="http://www.chipkool.tk/search/label/th%E1%BB%A7%20thu%E1%BA%ADt%20internet?max-results=10">Internet</a> |
<a class="link-subfolder" href="http://www.chipkool.tk/search/label/Di%E1%BB%87t%20virut?max-results=10">Diệt Virut</a> | <a class="link-subfolder" href="http://www.chipkool.tk/search/label/clip%20th%E1%BB%A7%20thu%E1%BA%ADt?max-results=10">Video - clip</a>| <a class="link-subfolder" href="http://www.chipkool.tk/search/label/windows%207?max-results=10
">Windows 7</a>| <a class="link-subfolder" href="http://www.chipkool.tk/search/label/windows%208?max-results=10">Windows 8</a>| <a class="link-subfolder" href="http://www.chipkool.tk/search/label/windows%20XP?max-results=10">Windows XP</a>
</div>
<div class="folder-titleright fr"></div>
</div>
<div class="folder-content" id="tdHomeFolder2">
<script type="text/javascript">
document.write(rdlabels[index]);
</script>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzYmG4HO4SBcos7_FyAmuFJABtQCZCd2De2_V6xnWKq4wyVnbaXirhud4ftkO3CnrMAwci5m4MM0bPdpMUuh9hgwuVxee-NbxK5ddr0P6_g4pN-CH4-XFZcGTHSaECS-ZBnpjnfA2XkHgM/";
showRandomImg = true;
aBold = false;
summaryPost = 247; //số ký tự của bài viết hiển thị (bài tóm tắt)
sumPost = 147;
numposts = 5; //số bài được hiển thị
label = "Th%E1%BB%A7%20Thu%E1%BA%ADt%20Vi%20t%C3%ADnh";
home_page = "http://www.chipkool.blogspot.com/";
</script>
<script src="http://chipteenplis.googlecode.com/files/vnexp_label.js" type="text/javascript"></script>
</div>
<div class="folder-bottom"></div>
</div>
<!---END THU THUAT VI TINH--->
<div class="folder"><div class="folder-title"><div class="folder-activeleft fl"></div>
<div class="folder-active fl"><a class="link-folder" href="http://www.chipkool.tk/search/label/M%E1%BA%A1ch%20Vi%20%C4%91i%E1%BB%81u%20khi%E1%BB%83n?max-results=10">Mạch vi điều khiển</a></div>
<div class="folder-activeright fl"></div><div class="subfolder fl">
<a class="link-subfolder" href="http://www.chipkool.tk/search/label/Ph%E1%BA%A7n%20m%E1%BB%81m%20%C4%91i%E1%BB%87n%20t%E1%BB%AD?max-results=10">Phần mềm điện tử</a> |
<a class="link-subfolder" href="http://www.chipkool.tk/search/label/%C4%90i%E1%BB%87n%20t%E1%BB%AD%20c%C6%A1%20b%E1%BA%A3n?max-results=5">Điện tử cơ bản</a> |
<a class="link-subfolder" href="http://www.chipkool.tk/search/label/M%E1%BA%A1ch%20%C4%91i%E1%BB%87n%20c%C6%A1%20b%E1%BA%A3n?max-results=10">Mạch điên cơ bản</a> |
<a class="link-subfolder" href="#">All datasheet</a>
</div>
<div class="folder-titleright fr"></div>
</div>
<div class="folder-content" id="tdHomeFolder2">
<script type="text/javascript">
document.write(rdlabels[index]);
</script>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzYmG4HO4SBcos7_FyAmuFJABtQCZCd2De2_V6xnWKq4wyVnbaXirhud4ftkO3CnrMAwci5m4MM0bPdpMUuh9hgwuVxee-NbxK5ddr0P6_g4pN-CH4-XFZcGTHSaECS-ZBnpjnfA2XkHgM/";
showRandomImg = true;
aBold = false;
summaryPost = 247; //số ký tự của bài viết hiển thị (bài tóm tắt)
sumPost = 147;
numposts = 5; //số bài được hiển thị
label = "M%E1%BA%A1ch%20Vi%20%C4%91i%E1%BB%81u%20khi%E1%BB%83n";
home_page = "http://www.chipkool.blogspot.com/";
</script>
<script src="http://chipteenplis.googlecode.com/files/vnexp_label.js" type="text/javascript"></script>
</div>
<div class="folder-bottom"></div>
</div>
<!--END TIEN ICH VI DIEU KHIEN--->
<div class="folder"><div class="folder-title"><div class="folder-activeleft fl"></div>
<div class="folder-active fl"><a class="link-folder" href="http://www.chipkool.tk/search/label/Ph%E1%BA%A7n%20m%E1%BB%81m%20vi%20t%C3%ADnh?max-results=10">Phần mềm vi tính</a></div>
<div class="folder-activeright fl"></div><div class="subfolder fl">
<a class="link-subfolder" href="http://www.chipkool.tk/search/label/th%E1%BB%A7%20thu%E1%BA%ADt%20word?max-results=10">Thủ thuật word</a> |
<a class="link-subfolder" href="http://www.chipkool.tk/search/label/th%E1%BB%A7%20thu%E1%BA%ADt%20mobile?max-results=5">Thủ thuật mobile</a> |
</div>
<div class="folder-titleright fr"></div>
</div>
<div class="folder-content" id="tdHomeFolder2">
<script type="text/javascript">
document.write(rdlabels[index]);
</script>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzYmG4HO4SBcos7_FyAmuFJABtQCZCd2De2_V6xnWKq4wyVnbaXirhud4ftkO3CnrMAwci5m4MM0bPdpMUuh9hgwuVxee-NbxK5ddr0P6_g4pN-CH4-XFZcGTHSaECS-ZBnpjnfA2XkHgM/";
showRandomImg = true;
aBold = false;
summaryPost = 247; //số ký tự của bài viết hiển thị (bài tóm tắt)
sumPost = 147;
numposts = 5; //số bài được hiển thị
label = "Ph%E1%BA%A7n%20m%E1%BB%81m%20vi%20t%C3%ADnh";
home_page = "http://www.chipkool.blogspot.com/";
</script>
<script src="http://chipteenplis.googlecode.com/files/vnexp_label.js" type="text/javascript"></script>
</div>
<div class="folder-bottom"></div>
</div>
<!--END TIEN ICH PHAN MEM VI TINH--->
<div class="folder"><div class="folder-title"><div class="folder-activeleft fl"></div>
<div class="folder-active fl"><a class="link-folder" href="http://www.chipkool.tk/search/label/ebook%20%C4%91i%E1%BB%87n%20t%E1%BB%AD?max-results=10">Ebook điện tử</a></div>
<div class="folder-activeright fl"></div><div class="subfolder fl">
<a class="link-subfolder" href="http://www.chipkool.tk/search/label/Ebook%20%C4%90%E1%BA%A1i%20H%E1%BB%8Dc?max-results=10">Ebook Đại Học</a> |
<a class="link-subfolder" href="http://www.chipkool.tk/search/label/Ebook%20Tin%20H%E1%BB%8Dc?max-results=10">Ebook tin học</a> | <a class="link-subfolder" href="http://www.chipkool.tk/search/label/Ebook%20Web?max-results=10">Ebook Lập trình Web</a>
</div>
<div class="folder-titleright fr"></div>
</div>
<div class="folder-content" id="tdHomeFolder2">
<script type="text/javascript">
document.write(rdlabels[index]);
</script>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzYmG4HO4SBcos7_FyAmuFJABtQCZCd2De2_V6xnWKq4wyVnbaXirhud4ftkO3CnrMAwci5m4MM0bPdpMUuh9hgwuVxee-NbxK5ddr0P6_g4pN-CH4-XFZcGTHSaECS-ZBnpjnfA2XkHgM/";
showRandomImg = true;
aBold = false;
summaryPost = 247; //số ký tự của bài viết hiển thị (bài tóm tắt)
sumPost = 147;
numposts = 5; //số bài được hiển thị
label = "ebook%20%C4%91i%E1%BB%87n%20t%E1%BB%AD";
home_page = "http://www.chipkool.blogspot.com/";
</script>
<script src="http://chipteenplis.googlecode.com/files/vnexp_label.js" type="text/javascript"></script>
</div>
<div class="folder-bottom"></div>
</div>
<!--END TIEN ICH EBOOK DIEN TU--->
<div class="folder"><div class="folder-title"><div class="folder-activeleft fl"></div>
<div class="folder-active fl"><a class="link-folder" href="http://www.chipkool.tk/search/label/th%E1%BB%A7%20thu%E1%BA%ADt%20blogger?max-results=10">Thủ thuật blogger</a></div>
<div class="folder-activeright fl"></div><div class="subfolder fl">
<a class="link-subfolder" href="http://www.chipkool.tk/2010/11/bang-ma-mau-hexa.html">Bảng mã màu </a> |
<a class="link-subfolder" href="http://www.chipkool.tk/2010/12/xem-ma-nguon-1-website-bat-ky.html">Xem mã nguồn website</a> | <a class="link-subfolder" href="http://ha-escapexml.blogspot.com/">Mã hóa code</a>
</div>
<div class="folder-titleright fr"></div>
</div>
<div class="folder-content" id="tdHomeFolder2">
<script type="text/javascript">
document.write(rdlabels[index]);
</script>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzYmG4HO4SBcos7_FyAmuFJABtQCZCd2De2_V6xnWKq4wyVnbaXirhud4ftkO3CnrMAwci5m4MM0bPdpMUuh9hgwuVxee-NbxK5ddr0P6_g4pN-CH4-XFZcGTHSaECS-ZBnpjnfA2XkHgM/";
showRandomImg = true;
aBold = false;
summaryPost = 247; //số ký tự của bài viết hiển thị (bài tóm tắt)
sumPost = 147;
numposts = 5; //số bài được hiển thị
label = "th%E1%BB%A7%20thu%E1%BA%ADt%20blogger";
home_page = "http://www.chipkool.blogspot.com/";
</script>
<script src="http://chipteenplis.googlecode.com/files/vnexp_label.js" type="text/javascript"></script>
</div>
<div class="folder-bottom"></div>
</div>
<!--END TIEN ICH THU THUAT BLOGGER--->
<div class="folder"><div class="folder-title"><div class="folder-activeleft fl"></div>
<div class="folder-active fl"><a class="link-folder" href="http://www.chipkool.tk/search/label/M%E1%BA%A1ch%20Vi%20%C4%91i%E1%BB%81u%20khi%E1%BB%83n?max-results=10">Mạch vi điều khiển</a></div>
<div class="folder-activeright fl"></div><div class="subfolder fl">
<a class="link-subfolder" href="http://www.chipkool.tk/search/label/l%E1%BA%ADp%20tr%C3%ACnh%20c%2B%2B">Lập trình C</a> |
<a class="link-subfolder" href="http://www.chipkool.tk/search/label/l%E1%BA%ADp%20tr%C3%ACnh%20asembly">Lập trình Asembly</a> | <a class="link-subfolder" href="http://www.chipkool.tk/search/label/Gi%E1%BA%A3i%20thu%E1%BA%ADt%20C%2B%2B">Giải thuật C</a> | <a class="link-subfolder" href="http://www.chipkool.tk/search/label/L%E1%BA%ADp%20tr%C3%ACnh%20Robot?max-results=10">lập trình robocon</a>
</div>
<div class="folder-titleright fr"></div>
</div>
<div class="folder-content" id="tdHomeFolder2">
<script type="text/javascript">
document.write(rdlabels[index]);
</script>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzYmG4HO4SBcos7_FyAmuFJABtQCZCd2De2_V6xnWKq4wyVnbaXirhud4ftkO3CnrMAwci5m4MM0bPdpMUuh9hgwuVxee-NbxK5ddr0P6_g4pN-CH4-XFZcGTHSaECS-ZBnpjnfA2XkHgM/";
showRandomImg = true;
aBold = false;
summaryPost = 247; //số ký tự của bài viết hiển thị (bài tóm tắt)
sumPost = 147;
numposts = 5; //số bài được hiển thị
label = "Gi%E1%BA%A3i%20thu%E1%BA%ADt%20C%2B%2B";
home_page = "http://www.chipkool.blogspot.com/";
</script>
<script src="http://chipteenplis.googlecode.com/files/vnexp_label.js" type="text/javascript"></script>
</div>
<div class="folder-bottom"></div>
</div>
<!--END TIEN ICH LAP TRINH--->
Style 3 : Recent Post mang phong cách Quantrimang
Thực hiện :
1. Tạo 1 widget HTML\JavaScript và dán code bên dưới vào :
<style type="text/css">
.wbox {background-color:#ffffff;width:auto;height:auto;}
.wbox.Cat {width:500px;height:auto;margin-bottom:5px;}
.wbox .tl {
background:url(http://quantrimang.com.vn/App_Themes/default/images/left_wbox_03.jpg) no-repeat left top;
padding-left:3px;
}
.wbox .tr {
background:url(http://quantrimang.com.vn/App_Themes/default/images/right_wbox_03.jpg) no-repeat right top;
padding-right:3px;
}
.wbox .tc {
background:url(http://quantrimang.com.vn/App_Themes/default/images/mid_wbox_03.jpg) repeat-x left top;
height:23px;
color:#246296;
font-size:12px;
text-transform:uppercase;
font-weight:bold;
padding-top:5px;
padding-left:7px;
}
.wbox .tc a {text-decoration:none;color:#246296;}
.wbox .ml {
background:url(http://quantrimang.com.vn/App_Themes/default/images/left_contannerbox.jpg) repeat-y left top;
padding-left:3px;
}
.wbox .mr
{
background:url(http://quantrimang.com.vn/App_Themes/default/images/right_contannerbox.jpg) repeat-y right top;
padding-right:3px;
}
.wbox .mc {background-color:#FFFFFF;}
.wbox .bl
{
background:url(http://quantrimang.com.vn/App_Themes/default/images/bottomLeft_wbox.jpg) no-repeat left top;
padding-left:3px;
height:5px;
}
.wbox .br
{
background:url(http://quantrimang.com.vn/App_Themes/default/images/bottomright_wbox.jpg) no-repeat right top;
height:5px;
padding-right:3px;
}
.wbox .bc
{
background:url(http://quantrimang.com.vn/App_Themes/default/images/bottomMiddle_wbox.jpg) repeat-x left top;
height:5px;
font-size:0;
line-height:5px;
}
.Tin_lienquan ul,.Tin_lienquan li {list-style:none}
.Title_article {
color:#246296;
font-size:12px;
font-weight:bold;
padding-top:10px;
padding-bottom:10px;
padding-left:5px;
}
.Title_article {text-decoration:none;color:#246296;}
.Title_article a {text-decoration:none;color:#303030;}
.Title_article a:hover {color:#990000; text-decoration:none;}
.imgModule {padding-left:5px;}
.imgModule img {width:120px; margin-right:5px;}
.imgModule a {text-decoration:none;}
.Tin_lienquan {
color:#797979;
font-size:11px;
padding-top:15px;
font-family:Tahoma;
padding-left:5px;
}
.Tin_lienquan a {text-decoration:none; color:#004784;}
.Tin_lienquan a:hover {text-decoration:none;color:#CC3300;}
</style>
<script type="text/javascript">
home_page = "http://itechplus.info/";
label = "Office";
numposts = 6;
list1 = 1;
sumPosts = 268;
mode = "label";
</script>
<div class="wbox Cat">
<!-- Header widget -->
<div class="tl"><div class="tr"><div class="tc"><a href="http://itechplus.info/search/label/Office">Tin học văn phòng</a></div></div></div>
<!-- END Header widget -->
<div class="ml">
<div class="mr">
<div class="mc">
<!-- noi dung cua tien ich -->
<script type="text/javascript" src="https://sites.google.com/site/itechroot/javascripts/rc-post-qmt.txt"></script>
<!-- END noi dung cua tien ich -->
</div>
</div>
</div>
<!-- Footer widget -->
<div class="bl"><div class="br"><div class="bc"></div></div></div>
<!-- END footer widget -->
</div>
Thay đoạn code in đậm cho phù hợp với Blog bạn, cần lưu ý :
- list1 : số bài viết có hiện ảnh thumbnail kèm trích dẫn
- mode :
o mode=”label” : áp dụng cho Label
o mode=”blog” : áp dụng cho cả Blog
Chúc các bạn thành công!!
Nguồn : chipkool.tk và một số trang khác.
Tạo Banner quảng cáo với hiệu ứng trượt dọc 2 bên (kiểu 2)
20:34 |
Banner quảng cáo trượt dọc 2 bên trang web là hình thức quảng cáo rất phổ biến hiện nay trên các Forum\Website lớn. Không những giúp tận dụng “đất”, nó còn dễ dàng gây được sự chú ý của người đọc với hiệu ứng trượt theo khi trang được cuộn lên\xuống.Tiện ích này trước đây đã được một số Blogger giới thiệu. Tuy nhiên có một số nhược điểm “chết người” như : không hiển thị tốt trên trình duyệt Firefox, hoặc nếu hiển thị thì khi click vào bất cứ liên kết nào trên Blog cũng không có tác dụng ( unclickable ).
Sau khi tham khảo code từ một số website tên tuổi, iTechPlus đã tìm được đoạn code ưng ý, có thể khắc phục được các lỗi nêu trên, đặc biệt là hiển thị tốt ngay cả trên trình duyệt “già nua xấu xí” IE6.
Trang iTechPlus.info hiển thị dưới độ phân giải 1280x800
Và cũng theo yêu cầu của một số bạn trước đây, hôm nay iTechPlus sẽ hướng dẫn các bạn cách chèn tiện ích “Banner quảng cáo trượt dọc 2 bên” vào Blog, qua 2 bước rất đơn giản sau :1. Vào Thiết kế > Phần tử trang
2. Tạo một widget HTML\JavaScript và chèn vào đoạn code bên dưới :
<div id="divAdRight" style="DISPLAY: none; POSITION: absolute; TOP: 0px">Trong đoạn code trên :
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR8jtorMYCf77mkrZmBJG1TPYQkagbcQ1lzxlrVEEelTETfTNQzwCxNJ29qOQ0mbwCPAWc3D951iFbB4omkThyphenhyphen_h-ycMUJQntTlaR_KZWXsGYfsc3YXAiiBY4doqlfmpKNgMOGVypEkFI/s512/bannerfpt.jpg" width="125" /></a>
</div>
<div id="divAdLeft" style="DISPLAY: none; POSITION: absolute; TOP: 0px">
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR8jtorMYCf77mkrZmBJG1TPYQkagbcQ1lzxlrVEEelTETfTNQzwCxNJ29qOQ0mbwCPAWc3D951iFbB4omkThyphenhyphen_h-ycMUJQntTlaR_KZWXsGYfsc3YXAiiBY4doqlfmpKNgMOGVypEkFI/s512/bannerfpt.jpg" width="125" /></a>
</div>
<script>
function FloatTopDiv()
{
startLX = ((document.body.clientWidth -MainContentW)/2)-LeftBannerW-LeftAdjust , startLY = TopAdjust+80;
startRX = ((document.body.clientWidth -MainContentW)/2)+MainContentW+RightAdjust , startRY = TopAdjust+80;
var d = document;
function ml(id)
{
var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
el.sP=function(x,y){this.style.left=x + 'px';this.style.top=y + 'px';};
el.x = startRX;
el.y = startRY;
return el;
}
function m2(id)
{
var e2=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
e2.sP=function(x,y){this.style.left=x + 'px';this.style.top=y + 'px';};
e2.x = startLX;
e2.y = startLY;
return e2;
}
window.stayTopLeft=function()
{
if (document.documentElement && document.documentElement.scrollTop)
var pY = document.documentElement.scrollTop;
else if (document.body)
var pY = document.body.scrollTop;
if (document.body.scrollTop > 30){startLY = 3;startRY = 3;} else {startLY = TopAdjust;startRY = TopAdjust;};
ftlObj.y += (pY+startRY-ftlObj.y)/16;
ftlObj.sP(ftlObj.x, ftlObj.y);
ftlObj2.y += (pY+startLY-ftlObj2.y)/16;
ftlObj2.sP(ftlObj2.x, ftlObj2.y);
setTimeout("stayTopLeft()", 1);
}
ftlObj = ml("divAdRight");
//stayTopLeft();
ftlObj2 = m2("divAdLeft");
stayTopLeft();
}
function ShowAdDiv()
{
var objAdDivRight = document.getElementById("divAdRight");
var objAdDivLeft = document.getElementById("divAdLeft");
if (document.body.clientWidth < 1000)
{
objAdDivRight.style.display = "none";
objAdDivLeft.style.display = "none";
}
else
{
objAdDivRight.style.display = "block";
objAdDivLeft.style.display = "block";
FloatTopDiv();
}
}
</script>
<script>
document.write("<script type='text/javascript' language='javascript'>MainContentW = 1000;LeftBannerW = 125;RightBannerW = 125;LeftAdjust = 5;RightAdjust = 5;TopAdjust = 10;ShowAdDiv();window.onresize=ShowAdDiv;;<\/script>");
</script>
- <a href="#"> : liên kết đến khi người đọc click vào. Thay # bằng liên kết trang bạn cho phù hợp
- <img src=”…”/> : banner bạn muốn hiển thị
- width="125" : chiều rộng của banner. Có 2 giá trị được đánh dấu cùng màu đỏ
- MainContentW = 1000 : chiều rộng trang web. Có 2 giá trị được đánh dấu cùng màu xanh lá
- LeftAdjust = 5 : khoảng cách từ bìa trái trang web đến banner
- RightAdjust = 5 : khoảng cách từ bìa phải trang web đến banner
- TopAdjust = 10 : khoảng cách từ rìa trên trang web đến banner
3. Save and Done.
Chúc các bạn thành công !
Nguồn: itechplus.info
Tạo banner trượt dọc hai bên
00:06 |
(Traidatmui.com) – Trước đây mình có giới thiệu cùng các bạn một thủ thuật là tạo banner chạy dọc hai bên của blog. Tuy nhiên với thủ thuật cũ thì banner chỉ trượt tốt với trình duyệt IE (Internet Explorer) còn với Firefox thì banner không chạy được. Cũng chính vì hạn chế của thủ thuật trước, hôm nay mình xin giới thiệu với các bạn một bản hoàn thiện hơn, banner sẽ chạy tốt hơn trên cả hai trình duyệt. Các bước thực hiện thủ thuật này cũng không phức tạp hơn thủ thuật cũ, bạn chỉ việc làm theo một vài bước đơn giản bên dưới.
1. Đăng nhập vào tài khoản
2. Vào bố cục chọn chỉnh sửa HTML
3. Chèn code sau vào bên dưới thẻ <head>
<style type='text/css'>
#slideads{
position: absolute;
visibility: hidden;}
#slideads1{
float:left;
margin-left: 20px;}
#slideads2{
float:right;
margin-right: 20px;}
</style>
<script src='http://traidatmui-tips.googlecode.com/files/slide_ads.js' type='text/javascript'/>
#slideads{
position: absolute;
visibility: hidden;}
#slideads1{
float:left;
margin-left: 20px;}
#slideads2{
float:right;
margin-right: 20px;}
</style>
<script src='http://traidatmui-tips.googlecode.com/files/slide_ads.js' type='text/javascript'/>
4. Bây giờ save template lại và trở về phần tử trang, tạo thêm 1 phần tử HTML/Javascript
5. Thêm vào phần tử HTML/Javascript code bên dưới
<div id="slideads">
<div id="slideads1" class="slideads1">
<a target="_blank" href="http://www.traidatmui.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXuxqFDhz8Ev6NhSnv7GuziUrwD6rGQ1FVMCpCXEejasLkwZ9lXVP5rmkm2w63xZQ2htYn2n3xKfJi4m5pu-zlZZYI7_1_ByGuIcrCljan4sr3jyJEEtT-71zoPcsKFlyFv_ER8yCtwyMC/" border="0"/></a>
</div>
<div id="slideads2" class="slideads2">
<a target="_blank" href="http://www.traidatmui.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOYJbJfXhVGbiJ7WEt39DPpYlutv2-jg26jHueJJH9c7RRFHqKYv8Kfi1JkzJTZ-RvvdXYZt1fOaRXasxgbKy4dB7LDOtSZch9-haQfEG4-IlZ8pcinHCUB1A8sN582e1hoX69MYWi9cUP/" border="0"/></a>
</div>
</div>
<div id="slideads1" class="slideads1">
<a target="_blank" href="http://www.traidatmui.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXuxqFDhz8Ev6NhSnv7GuziUrwD6rGQ1FVMCpCXEejasLkwZ9lXVP5rmkm2w63xZQ2htYn2n3xKfJi4m5pu-zlZZYI7_1_ByGuIcrCljan4sr3jyJEEtT-71zoPcsKFlyFv_ER8yCtwyMC/" border="0"/></a>
</div>
<div id="slideads2" class="slideads2">
<a target="_blank" href="http://www.traidatmui.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOYJbJfXhVGbiJ7WEt39DPpYlutv2-jg26jHueJJH9c7RRFHqKYv8Kfi1JkzJTZ-RvvdXYZt1fOaRXasxgbKy4dB7LDOtSZch9-haQfEG4-IlZ8pcinHCUB1A8sN582e1hoX69MYWi9cUP/" border="0"/></a>
</div>
</div>
Chỉnh code: Bạn hãy thay link ảnh trong code (dòng màu cam) thành banner của mình có thể bạn thêm độ rộng và độ cao của ảnh tùy ý.
- Thay đường dẫn cho banner tương ứng dòng màu xanh đậm trong code trên.
6. Đến đây bạn chỉ việc save lại là xong
Chúc bạn thành công
Nguồn traidatmui.com
Bài tập PLC điều khiển băng tải công nghiệp
04:18 |Các bạn vào các link sau để down load file chương trình và file PDF về xem nhé.
http://www.mediafire.com/?3fx5c3l6ta73kia File chuong trình
http://www.mediafire.com/?t913aq6cu6v3qcb file PDF
http://www.mediafire.com/?3fx5c3l6ta73kia File chuong trình
http://www.mediafire.com/?t913aq6cu6v3qcb file PDF
Tạo Forum nhanh chóng, miễn phí
22:47 |Sau đây là cách tự tạo một forum nhanh chóng. Nếu bạn có bản lĩnh và thích thử thách chính mình thì vào đây nhé!
1/ Đầu tiên bạn truy cập vào website: http://www.forumotion.com 2/ Sau khi load xong, phía bên trái sẽ thấy một con nhái há họng to chảng gào hai câu "Creat a free forum" và "Create a free blog". Bạn biết mục tiêu của bạn cần làm là gì rồi phải không? Click vào Create a free forum.
3/ Việc đầu tiên bạn phải làm là chọn một theme (mẫu khung hình) đơn giản trước, hoặc các theme khác đẹp hơn ở phần hitskin. Nhưng bạn cũng có thể sửa lại theme sau này, chẳng sao cả(nếu muốn xem qua dung nhan cái theme mình chọn, bạn click vào chữ Preview màu xanh ở dưới).
Kéo xuống dưới và click vào mũi tên có chữ Continue để tiếp tục.
4/ Giờ là lúc bạn vận dụng vốn liếng kiến thức tiếng Anh đã được học đây.
Title of your forum: điền tên cho forum yêu dấu của bạn
Category: nội dung chính của forum bạn: thể thao, giải trí, truyền thông....
Description : mô tả khái quát về forum. Nhớ là KHÁI QUÁT thôi nhá. Sau khi bạn lập, lời giới thiệu này sẽ thuộc dạng một cái banner của bạn đó, đâu có khách nào lại thích xem một cái quảng cáo toàn chữ là chữ đâu nè!
Internet Address of your forum (at least 4 characters): Điền địa chỉ cho forum mong muốn của bạn, ít nhất 4 ký tự. Sau đó, chọn một tên miền dễ nhớ và bạn thích. Ví dụ, mình đặt tên là uyencong, tên miền forummotion.com, thế thì địa chỉ của mình là uyencong.forummotion.com, thế thôi!
Language used on your forum : chọn ngôn ngữ cho forum của bạn. Ôi, nói về mặt ngôn ngữ thì forum nì đúng là ý ẹ. Quá ư là nghèo nàn, nhưng kệ, chúng ta có bản lĩnh thì giỏi làm như họ ấy, đừng có chê!
Hour / Timezone : cái này thì chúng ta học địa lý rồi nhé, múi giờ của Bangkok, Hanoi, Jakarta là....(không nhớ hả?) GMT+7, OK?
Còn hai dòng cuối là riêng tư cho admin (administrator: ở đây nghĩa là người điều hành)
Your e-mail address : điền email của bạn vào
Administration password : điền password của admin, nhớ là tối thiểu 6 ký tự, có cả chữ và số đó nhé, không thôi thì cứ bị báo lỗi password không thôi
Tick vào ô trống của dòng I agree with these terms and conditions, nói chung, những hoạt động trong sáng của chúng ta sẽ không bị phạm lỗi lầm gì cả nên khỏi lo. Nhưng nếu bạn nghi ngờ về mình hay đơn giản là muốn học tiếng Anh, cứ click vào Terms of service để đọc luật, mình rất ủng hộ ai có tinh thần học hỏi.
Click vào Continue để tiếp tục. Nếu có hộp thoại hỏi có nên ghi nhớ password hay không, quyền lựa chọn là ở bạn.
Important information là những điều quan trọng các bạn cần đọc qua để hiểu. Bạn cũng có thể để tiếng anh, hay dịch ra tiếng việt rồi lưu lại, xong để vào forum của mình làm cái rule (luật) riêng cho nó.
Administration password Checking: gõ lại password bạn đã chọn, để kiểm định ấy mà.
Nhấp tiếp vào Continue, nhưng theo mình thấy thì do lỗi hình, cái mũi tên đã thành ra méo mó, kệ, cứ dí nó, thấy bàn tay nổi lên là click, xong thôi!
5/ Nếu làm thành công, bạn sẽ có cái cúp to đùng thế này nè...
Ghi chú là nếu bạn đã có đăng ký tài khoản thì tên truy cập (username) của bạn chính là cái bạn đã đăng ký (nhưng khoản đăng ký này dài dòng hơn, và chưa chắc các bạn đã hiểu, nhưng bạn cứ khám phá khi thích nhé), nếu không, mặc định tên truy cập của bạn là admin
6/ Và bây giờ, bạn click vào cái link (địa chỉ) của forum bạn để bắt đầu "làm vua". Nhớ nhập tên truy cập và mật khẩu à nhá!
Nếu chọn tiếng Việt, bạn click vào "Bảng điều khiển của người quản trị" ở cuối trang để Quản lý giao diện, Quản lý diễn đàn, Quản lý tổng thể, Quản lý người dùng và nhóm, Quản lý các tính năng ưu việt khác (tạo portal, sưu tập ảnh - gallery...). Nói trước với các bạn là cái trang này nó còn "củ chuối" lắm. Thi thoảng bạn sẽ thấy mấy chữ tiếng anh tiếng việt nửa nạc nửa mỡ gắn với nhau, thôi kệ. Bây giờ, sự đoàn kết là trên hết. Mời gọi các member (thành viên) để giúp đỡ bạn thì hay hơn là ngồi đó kêu trời đó!
Cũng tương tự như thế, bạn click Administration panel cũng ở cuối trang để làm các việc tương tự, nhưng bằng tiếng Anh. Đây là cơ hội để các bạn chứng tỏ bản lĩnh tiếng Anh của mình. Nhưng mà cũng dễ thôi, chứ không đến nỗi như các bạn nghĩ đâu!
CHÚC CÁC BẠN THÀNH CÔNG
http://sangnguyenms.forumvi.com/
3/ Việc đầu tiên bạn phải làm là chọn một theme (mẫu khung hình) đơn giản trước, hoặc các theme khác đẹp hơn ở phần hitskin. Nhưng bạn cũng có thể sửa lại theme sau này, chẳng sao cả(nếu muốn xem qua dung nhan cái theme mình chọn, bạn click vào chữ Preview màu xanh ở dưới).
Kéo xuống dưới và click vào mũi tên có chữ Continue để tiếp tục.
4/ Giờ là lúc bạn vận dụng vốn liếng kiến thức tiếng Anh đã được học đây.
Title of your forum: điền tên cho forum yêu dấu của bạn
Category: nội dung chính của forum bạn: thể thao, giải trí, truyền thông....
Description : mô tả khái quát về forum. Nhớ là KHÁI QUÁT thôi nhá. Sau khi bạn lập, lời giới thiệu này sẽ thuộc dạng một cái banner của bạn đó, đâu có khách nào lại thích xem một cái quảng cáo toàn chữ là chữ đâu nè!
Internet Address of your forum (at least 4 characters): Điền địa chỉ cho forum mong muốn của bạn, ít nhất 4 ký tự. Sau đó, chọn một tên miền dễ nhớ và bạn thích. Ví dụ, mình đặt tên là uyencong, tên miền forummotion.com, thế thì địa chỉ của mình là uyencong.forummotion.com, thế thôi!
Language used on your forum : chọn ngôn ngữ cho forum của bạn. Ôi, nói về mặt ngôn ngữ thì forum nì đúng là ý ẹ. Quá ư là nghèo nàn, nhưng kệ, chúng ta có bản lĩnh thì giỏi làm như họ ấy, đừng có chê!
Hour / Timezone : cái này thì chúng ta học địa lý rồi nhé, múi giờ của Bangkok, Hanoi, Jakarta là....(không nhớ hả?) GMT+7, OK?
Còn hai dòng cuối là riêng tư cho admin (administrator: ở đây nghĩa là người điều hành)
Your e-mail address : điền email của bạn vào
Administration password : điền password của admin, nhớ là tối thiểu 6 ký tự, có cả chữ và số đó nhé, không thôi thì cứ bị báo lỗi password không thôi
Tick vào ô trống của dòng I agree with these terms and conditions, nói chung, những hoạt động trong sáng của chúng ta sẽ không bị phạm lỗi lầm gì cả nên khỏi lo. Nhưng nếu bạn nghi ngờ về mình hay đơn giản là muốn học tiếng Anh, cứ click vào Terms of service để đọc luật, mình rất ủng hộ ai có tinh thần học hỏi.
Click vào Continue để tiếp tục. Nếu có hộp thoại hỏi có nên ghi nhớ password hay không, quyền lựa chọn là ở bạn.
Important information là những điều quan trọng các bạn cần đọc qua để hiểu. Bạn cũng có thể để tiếng anh, hay dịch ra tiếng việt rồi lưu lại, xong để vào forum của mình làm cái rule (luật) riêng cho nó.
Administration password Checking: gõ lại password bạn đã chọn, để kiểm định ấy mà.
Nhấp tiếp vào Continue, nhưng theo mình thấy thì do lỗi hình, cái mũi tên đã thành ra méo mó, kệ, cứ dí nó, thấy bàn tay nổi lên là click, xong thôi!
5/ Nếu làm thành công, bạn sẽ có cái cúp to đùng thế này nè...
Ghi chú là nếu bạn đã có đăng ký tài khoản thì tên truy cập (username) của bạn chính là cái bạn đã đăng ký (nhưng khoản đăng ký này dài dòng hơn, và chưa chắc các bạn đã hiểu, nhưng bạn cứ khám phá khi thích nhé), nếu không, mặc định tên truy cập của bạn là admin
6/ Và bây giờ, bạn click vào cái link (địa chỉ) của forum bạn để bắt đầu "làm vua". Nhớ nhập tên truy cập và mật khẩu à nhá!
Nếu chọn tiếng Việt, bạn click vào "Bảng điều khiển của người quản trị" ở cuối trang để Quản lý giao diện, Quản lý diễn đàn, Quản lý tổng thể, Quản lý người dùng và nhóm, Quản lý các tính năng ưu việt khác (tạo portal, sưu tập ảnh - gallery...). Nói trước với các bạn là cái trang này nó còn "củ chuối" lắm. Thi thoảng bạn sẽ thấy mấy chữ tiếng anh tiếng việt nửa nạc nửa mỡ gắn với nhau, thôi kệ. Bây giờ, sự đoàn kết là trên hết. Mời gọi các member (thành viên) để giúp đỡ bạn thì hay hơn là ngồi đó kêu trời đó!
Cũng tương tự như thế, bạn click Administration panel cũng ở cuối trang để làm các việc tương tự, nhưng bằng tiếng Anh. Đây là cơ hội để các bạn chứng tỏ bản lĩnh tiếng Anh của mình. Nhưng mà cũng dễ thôi, chứ không đến nỗi như các bạn nghĩ đâu!
CHÚC CÁC BẠN THÀNH CÔNG
http://sangnguyenms.forumvi.com/
Tiện ích đếm số lần truy cập cho Blogspot
19:17 |(Traidatmui.com) - Hôm nay mình giới thiệu đến bạn tiện ích cũng khá hay dành cho Blogger, tiện ích này sẽ hiển thị số lần khách truy cập vào blog của bạn, nói cách khác là nó sẽ đến số lần khách ghé thăm blog của bạn. Ở đây mình giới thiệu cho bạn 2 dạng của tiện ích, một dạng là dạng text đơn giản và một dạng sẽ hiển thị cửa sổ popup.
Bạn có thể chọn một trong hai tiện ích này để đặt vào blog. 
Hình ảnh minh họa dạng text
Hình ảnh minh họa dạng popup 1. Đăng nhập tài khoản Blogger 2. Vào thiết kế
3. Chọn thêm tiện ích
4. Thêm 1 HTML/Javascript và thêm vào 1 trong 2 code bên dưới.
a. Dạng cửa sổ popup
<script language="JavaScript">
function getCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0)
break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (2 < argc) ? argv[2] : null;
var path = (3 < argc) ? argv[3] : null;
var domain = (4 < argc) ? argv[4] : null;
var secure = (5 < argc) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DisplayInfo() {
var expdate = new Date();
var visit;
expdate.setTime(expdate.getTime() + (24 * 60 * 60 * 1000 * 365));
if(!(visit = GetCookie("visit")))
visit = 0;
visit++;
SetCookie("visit", visit, expdate, "/", null, false);
var message;
if(visit == 1)
message=" Chào bạn đến với TRAIDATMUI.com!";
if(visit== 2)
message=" Rất vui bạn trở lại";
if(visit >= 3)
message=" Chúc bạn luôn vui vẻ";
alert("Bạn đã truy cập vào trang này"
+" "+visit+""
+" lần. "
+message);
}
function ResetCounts() {
var expdate = new Date();
expdate.setTime(expdate.getTime() + (24 * 60 * 60 * 1000 * 365));
visit = 0;
SetCookie("visit", visit, expdate , "/", null, false);
history.go(0);
}
window.onload=DisplayInfo
</script>
function getCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0)
break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (2 < argc) ? argv[2] : null;
var path = (3 < argc) ? argv[3] : null;
var domain = (4 < argc) ? argv[4] : null;
var secure = (5 < argc) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DisplayInfo() {
var expdate = new Date();
var visit;
expdate.setTime(expdate.getTime() + (24 * 60 * 60 * 1000 * 365));
if(!(visit = GetCookie("visit")))
visit = 0;
visit++;
SetCookie("visit", visit, expdate, "/", null, false);
var message;
if(visit == 1)
message=" Chào bạn đến với TRAIDATMUI.com!";
if(visit== 2)
message=" Rất vui bạn trở lại";
if(visit >= 3)
message=" Chúc bạn luôn vui vẻ";
alert("Bạn đã truy cập vào trang này"
+" "+visit+""
+" lần. "
+message);
}
function ResetCounts() {
var expdate = new Date();
expdate.setTime(expdate.getTime() + (24 * 60 * 60 * 1000 * 365));
visit = 0;
SetCookie("visit", visit, expdate , "/", null, false);
history.go(0);
}
window.onload=DisplayInfo
</script>
b. Dạng text
<script language="JavaScript">
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DeleteCookie (name) {
var exp = new Date();
exp.setTime (exp.getTime() - 1);
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
}
var expDays = 30;
var exp = new Date();
exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
function amt(){
var count = GetCookie('count')
if(count == null) {
SetCookie('count','1')
return 1
}
else {
var newcount = parseInt(count) + 1;
DeleteCookie('count')
SetCookie('count',newcount,exp)
return count
}
}
function getCookieVal(offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
</script>
<script>
document.write("Bạn đã truy cập vào trang này <b>" + amt() + "</b> lần")
</script>
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DeleteCookie (name) {
var exp = new Date();
exp.setTime (exp.getTime() - 1);
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
}
var expDays = 30;
var exp = new Date();
exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
function amt(){
var count = GetCookie('count')
if(count == null) {
SetCookie('count','1')
return 1
}
else {
var newcount = parseInt(count) + 1;
DeleteCookie('count')
SetCookie('count',newcount,exp)
return count
}
}
function getCookieVal(offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
</script>
<script>
document.write("Bạn đã truy cập vào trang này <b>" + amt() + "</b> lần")
</script>
Bạn có thể thay các dòng text màu xanh trên theo ý của bạn.
5. Cuối cùng save tiện ích lại
Chúc bạn thành công
Nguồn traidatmui.com
Hot
-
Bài 2 hướng dẫn sử dụng phần mềm Simatic S7.200 để viết chương trình điều khiển cho PLC. Ngoài ra, cũng hướng dẫn sử dụng phần mềm Simulator... -
Phần mềm tiện lợi trong việc vẽ các sơ đồ mạch điện công nghiệp, được hỗ trợ đầy đủ các kí hiệu của các thiết bị dùng trong công nghiệp như...
-
Bài 1 trình bày tổng quan về PLC S7.200, cấu trúc phần cứng, phương thức hoạt động của PLC S7.200. Đồng thời nêu những ưu điểm khi các nhà... -
Đây là phần mềm lập trình cho PLC của Siemens, tải phần mềm trên tại đây. Down cả 3 file về, giải nén ra bằng cách nhấn phải chuột vào 1 tr... -
Có khá nhiều bạn thắc mắc, gửi yêu cầu cho tôi về cách cài đặt phần mềm cho PLC của Mitsubishi. Tuy nhiên, vì quá bận nên tới nay mới hướng ... -
Đây là trang cho phép các bạn download tài liệu và phần mềm do các bạn khác hoặc tôi chia sẻ. -
1 CÁC LỆNH VÀO / RA OUTPUT: Sao chép nội dung của bit đầu tiên trong ngăn xếp vào bit được chỉ định trong lệnh. Nội dung của ngăn xếp không ... -
Giáo trình Điều khiển lập trình PLC S7-200, được biên soạn cho SV ngành Điện, điện tử theo học chế tín chỉ. -
First Alphabet PDF (Portable Document Format – định dạng tài liệu di động) là một định dạng tập tin văn bản khá phổ biến được phát triển bớ...
-
Ngày nay các thiết bị đo lường, điều khiển ... đều phải giao tiếp với máy tính để quan sát thông số và chế độ hoạt động của thiết bị như t...
