Thứ Năm, 2 tháng 6, 2016

7 Stylish Popular Post Widget cho Blogger - Blogspot

Nguyễn Đạt KhánhThứ Năm, tháng 6 02, 2016Bài đăng, Thủ thuật Blogger Facebook Comment Không có nhận xét nào

1- Mỡ Blogger, vào Template, nhấn Ctrl + F tìm kiếm thẻ </b:skin>

2- Chép Source Code của một trong các kiểu dưới đây dán vào phía trên thẻ :</b:skin> vừa tìm được
3- Save lại Template mà bạn mới làm.

4- Cho Blogspot hoạt động thử để biết kết quả của hiệu ứng.
5- Save lại Template mà bạn mới làm.

Colorful popular posts



<!-- Popular posts multi colored UI theme -->
#PopularPosts1 ul{margin:0;padding:5px 0;list-style-type:none}
#PopularPosts1 ul li{position:relative;margin:5px 0;border:0;padding:10px}
#PopularPosts1 ul li:first-child{background:#ff4c54;width:97%}
#PopularPosts1 ul li:first-child:after{content:"1"}
#PopularPosts1 ul li:first-child + li{background:#ff764c;width:87%}
#PopularPosts1 ul li:first-child + li:after{content:"2"}
#PopularPosts1 ul li:first-child + li + li{background:#ffde4c;width:84%}
#PopularPosts1 ul li:first-child + li + li:after{content:"3"}
#PopularPosts1 ul li:first-child + li + li + li{background:#c7f25f;width:81%}
#PopularPosts1 ul li:first-child + li + li + li:after{content:"4"}
#PopularPosts1 ul li:first-child + li + li + li + li{background:#33c9f7;width:78%}
#PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"}
#PopularPosts1 ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:75%}
#PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"}
#PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:72%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li +li{background:#f59095;width:69%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#c7f25f;width:66%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"}
#PopularPosts1 ul li:first-child:after,
#PopularPosts1 ul li:first-child + li:after,
#PopularPosts1 ul li:first-child + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{position:absolute;top:20px;right:-15px;border-radius:50%;background:#353535;width:30px;height:30px;text-align:center;font-size:28px;color:#fff}
#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:70px;height:70px;}
#PopularPosts1 ul li a{font-size:13px;color:#444;text-decoration:none}
#PopularPosts1 ul li a:hover{color:#222;text-decoration:none}
#PopularPosts1 img{
-moz-border-radius: 130px;
-webkit-border-radius: 130px;
border-radius: 130px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
padding:4px;
border:1px solid #fff !important;
}
#PopularPosts1 img:hover {
border-radius: 0 0 0 0;
-moz-transform: scale(1.2) rotate(-711deg) ;
-webkit-transform: scale(1.2) rotate(-711deg) ;
-o-transform: scale(1.2) rotate(-711deg) ;
-ms-transform: scale(1.2) rotate(-711deg) ;
transform: scale(1.2) rotate(-711deg) ;
}
<!-- popular posts multicolored UI theme -->

Round image popular posts.



.popular-posts ul{padding-left:0px;}
.popular-posts ul li {background: #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6XCyc7Fxzxm-AJtR4DRpbLbp-m8fdaEc3FwzIjIfkjGI4qJnnpytgTbZKHjIp6ctsDd8A9Xu_N3x9BWekOWjk2m0LcYBKCqZsELssM28zexpE-Wdkus5BW-IGuCe-j33cLnOYHrIGlFs/s1600/1.gif)  no-repeat scroll 5px 10px;
  list-style-type: none;
  margin:0 0 5px 0px;
  padding:5px 5px 5px 20px !important;
  border: 1px solid #ddd;
  border-radius:10px;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
}
.popular-posts ul
  li:hover {
  border:1px solid #6BB5FF;
}
.popular-posts ul
  li a:hover {
  text-decoration:none;
}
.popular-posts .item-thumbnail img {
  webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
}

Numbered the popular posts.



 #PopularPosts1 h2{
padding:7px 0 3px 0;
width:100%;
margin-bottom:10px;
font-size:1.3em;
text-indent:-12px;
font-size:18px;
text-align:center;
color: #757575; /* Color of the widget's title */
}
#PopularPosts1 ul{
list-style:none;
counter-reset:li;
padding:8px 0px 1px;
left:-7px;
width:290px;
}
#PopularPosts1 li{
position:relative;
margin:0 0 10px 0;
padding: 3px 2px 0 17px;
left:-5px;
width:285px;
}
#PopularPosts1 ul li{
background: #eee;
position: relative;
display: block;
padding: .4em .2em .4em 2em;
*padding: .2em;
margin: .5em 0;
background: #ddd;
text-decoration: none;
border-radius: .3em;
transition: all .3s ease-out;   
}
#PopularPosts1 ul li:before{
content: counter(li);
counter-increment: li;
position: absolute; 
top: 50%;
margin: -1.3em;
height: 2em;
width: 2em;
line-height: 2em;
font-size: 15px;
color: #fff; /* text color of numbers */
background: #FB8835; /* background color of numbers */
border: .2em solid #fff; /* border color */
-webkit-box-shadow: 0 8px 5px -7px #888;
-moz-box-shadow: 0 8px 5px -7px #888;
box-shadow: 0 8px 5px -7px #888;
text-align: center;
font-weight: bold;
border-radius: 2em;
position: absolute;   
left: 0;
transition: all .3s ease-out;
}
#PopularPosts1 ul li:hover{
background: #eee;
}
#PopularPosts1 ul li:hover:before{
transform: rotate(360deg);   
}
#PopularPosts1 ul li a{
font: 14px Georgia, serif; /* font size of post titles */
text-shadow: 0 -1px 2px #fff;
color: #444;
display:block;
min-height:25px;
text-decoration:none;
text-transform: uppercase;
}
#PopularPosts1 ul li a:hover{
color: #444;
}

Round Corners Popular Post Widget



.popular-posts ul{padding-left:0px;}
.popular-posts ul li {background: #FFF url() no-repeat scroll 5px 10px;
list-style-type: none;padding:5px 5px 5px 20px !important;
border: 1px solid #ddd;border-radius:30px;
-moz-border-radius:30px;
-webkit-border-radius:30px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
height: 40px;
-moz-box-shadow: 3px 2px 5px #242424;
-webkit-box-shadow: 3px 2px 5px #242424;
box-shadow: 3px 2px 5px #242424;margin-bottom: 5px;height: 40px;
}
.popular-posts ul li a {
font-style: italic;
}
.popular-posts ul li:hover {
border:1px solid #d10202;
 -moz-box-shadow: 3px 2px 5px #d10202;
-webkit-box-shadow: 3px 2px 5px #d10202;
box-shadow: 3px 2px 5px #d10202;
}
.popular-posts ul
li a:hover {
text-decoration:none;
}
.popular-posts .item-thumbnail img {
height:40px;width:40px;
webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
}
.popular-posts .item-thumbnail img:hover{
-moz-box-shadow: 0px 0px 5px #d10202;
-webkit-box-shadow: 0px 0px 5px #d10202;
box-shadow: 0px 0px 5px #d10202;}

Grid Layout For the Popular Posts Widget



.popular-posts ul{padding-left:0px;}
.popular-posts ul li {background: #FFF url() no-repeat scroll 5px 10px;
list-style-type: none;padding:5px 5px 5px 20px !important;
border: 1px solid #ddd;border-radius:30px;
-moz-border-radius:30px;
-webkit-border-radius:30px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
height: 40px;
-moz-box-shadow: 3px 2px 5px #242424;
-webkit-box-shadow: 3px 2px 5px #242424;
box-shadow: 3px 2px 5px #242424;margin-bottom: 5px;height: 40px;
}
.popular-posts ul li a {
font-style: italic;
}
.popular-posts ul li:hover {
border:1px solid #d10202;
 -moz-box-shadow: 3px 2px 5px #d10202;
-webkit-box-shadow: 3px 2px 5px #d10202;
box-shadow: 3px 2px 5px #d10202;
}
.popular-posts ul
li a:hover {
text-decoration:none;
}
.popular-posts .item-thumbnail img {
height:40px;width:40px;
webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
}
.popular-posts .item-thumbnail img:hover{
-moz-box-shadow: 0px 0px 5px #d10202;
-webkit-box-shadow: 0px 0px 5px #d10202;
box-shadow: 0px 0px 5px #d10202;}

Multi-color Popular posts widget



.PopularPosts h2{background:#2a3542 !important} .PopularPosts h2:before{content:" \f087" ; font-family:FontAwesome; font-size:22px; background:rgba(0,0,0,0.2); padding:10px 12px; margin:0 10px 0 0; border-radius:4px 0 0} .PopularPosts ul{list-style-type:none; padding:5px} .PopularPosts{color:#fff; line-height:1.6; font-size:100%; border-radius:5px 5px 0 0;} .PopularPosts{line-height:1.6; font-size:100%; border-radius:0; color:#fff} .PopularPosts a{color:#fff} .PopularPosts a:hover{color:#fff} .PopularPosts ul{list-style:none; margin:0; margin-left:-18px; padding:0; counter-reset:popcount} .PopularPosts ul li:before{list-style-type:none; margin-right:15px; margin-left:5px; padding:0.3em 0.6em; counter-increment:popcount; content:counter(popcount); font-size:16px; color:#fff; position:relative; float:left; border:1px solid #fff; border-radius:100%} .PopularPosts li{text-transform:uppercase; background:none; margin:0; padding:10px 18px; display:block; clear:both; overflow:hidden; list-style:none; font:13.5px/140%; border-bottom:none} .PopularPosts li:hover{background:#0FB9BB} .PopularPosts li a{text-decoration:none} .PopularPosts ul li{padding:3px 20px; border:none} .PopularPosts ul li:nth-child(1){background-color:#F48067; margin-right:0} .PopularPosts ul li:nth-child(2){background-color:#2ba6e1; margin-right:0} .PopularPosts ul li:nth-child(3){background-color:#718397; margin-right:0} .PopularPosts ul li:nth-child(4){background-color:#11b7b5; margin-right:0} .PopularPosts ul li:nth-child(5){background-color:#d9ba71; margin-right:0} .PopularPosts ul li:nth-child(6){background-color:#F48067; margin-right:0} .PopularPosts ul li:nth-child(7){background-color:#2ba6e1; margin-right:0} .PopularPosts ul li:nth-child(8){background-color:#718397; margin-right:0} .PopularPosts ul li:nth-child(9){background-color:#11b7b5; margin-right:0} .PopularPosts ul li:nth-child(10){background-color:#d9ba71; margin-right:0}

Popular posts widget with gradient effect



/* Popular Post */
.PopularPosts .widget-content ul{margin-top:-5px;margin-bottom:-1px;padding-right:20px!important;list-style-type:none}
.PopularPosts .widget-content ul li{position:relative;padding:10px!important}
.PopularPosts .widget-content ul li:first-child{background:#555;width:100%}
.PopularPosts .widget-content ul li:first-child:after{content:"01";background:#f88c00}
.PopularPosts .widget-content ul li:first-child+li{background:#666;width:100%}
.PopularPosts .widget-content ul li:first-child+li:after{content:'02'}
.PopularPosts .widget-content ul li:first-child+li+li{background:#777;width:100%}
.PopularPosts .widget-content ul li:first-child+li+li:after{content:'03'}
.PopularPosts .widget-content ul li:first-child+li+li+li{background:#888;width:100%}
.PopularPosts .widget-content ul li:first-child+li+li+li:after{content:'04'}
.PopularPosts .widget-content ul li:first-child+li+li+li+li{background:#999;width:100%}
.PopularPosts .widget-content ul li:first-child+li+li+li+li:after{content:'05'}
.PopularPosts .widget-content ul li:first-child+li+li+li+li+li{background:#aaa;width:100%}
.PopularPosts .widget-content ul li:first-child+li+li+li+li+li:after{content:'06'}
.PopularPosts .widget-content ul li:first-child+li+li+li+li+li+li{background:#bbb;width:100%}
.PopularPosts .widget-content ul li:first-child+li+li+li+li+li+li:after{content:'07'}
.PopularPosts .widget-content ul li:first-child+li+li+li+li+li+li+li{background:#c1c1c1;width:100%}
.PopularPosts .widget-content ul li:first-child+li+li+li+li+li+li+li:after{content:'08'}
.PopularPosts .widget-content ul li:first-child+li+li+li+li+li+li+li+li{background:#ccc;width:100%}
.PopularPosts .widget-content ul li:first-child+li+li+li+li+li+li+li+li:after{content:'09'}
.PopularPosts .widget-content ul li:first-child+li+li+li+li+li+li+li+li+li{background:#ddd;width:100%}
.PopularPosts .widget-content ul li:first-child+li+li+li+li+li+li+li+li+li:after{content:'10'}
.PopularPosts .widget-content ul li:first-child:after,.PopularPosts .widget-content ul li:first-child+li:after,.PopularPosts .widget-content ul li:first-child+li+li:after,.PopularPosts .widget-content ul li:first-child+li+li+li:after,.PopularPosts .widget-content ul li:first-child+li+li+li+li:after,.PopularPosts .widget-content ul li:first-child+li+li+li+li+li:after,.PopularPosts .widget-content ul li:first-child+li+li+li+li+li+li:after,.PopularPosts .widget-content ul li:first-child+li+li+li+li+li+li+li:after,.PopularPosts .widget-content ul li:first-child+li+li+li+li+li+li+li+li:after,.PopularPosts .widget-content ul li:first-child+li+li+li+li+li+li+li+li+li:after{position:absolute;bottom:1px;right:1px;background:#444;padding:6px 5px;width:20px;line-height:1em;text-align:center;color:#eee;font-size:13px!important}
.PopularPosts .widget-content{padding-right:10px}

Chúc các bạn thành công với những gì mà Khanhnguyen's Blog chia sẽ lại từ thebloggerguide.com

Tổng hợp và chia sẽ: Nguyễn Đạt Khánh

Share:

Được viết bởi Khánh Nguyễn

Blog của tôi, Nguyễn Đạt Khánh là tên của tôi :
Nghề nghiệp: IT Computer Networking - Kỹ thuật viên Mạng máy tính Viễn thông
Bạn đang xem Blog của tôi. Đừng quên nhấn Like và Share để ủng hộ. Một điều tốt nhất mà tôi mong đợi, là những dòng Comments thiện chí với nhau. Xin chân thành cảm ơn tất cả các bạn.

Nơi truy cập vào Nick của Tôi trên mạng:

Thế nào để có một Popular Post Thumbnail cho blogger blogspot

Nguyễn Đạt KhánhThứ Năm, tháng 6 02, 2016Bài đăng, Thủ thuật Blogger Facebook Comment Không có nhận xét nào

Để có được một Popular Post kiểu thumbnail, như hình trên ta cần phải có trước tiên một Widget Popular Post. Phần còn lại, các bước thực hiện sẽ như sau:

1- Mỡ Blogger, vào Template, nhấn Ctrl + F tìm kiếm thẻ </head>

2- Chép Source Code dưới đây dán vào phía trên thẻ :</head> vừa tìm được



<style type='text/css'>
.PopularPosts .item-thumbnail a {
clip: auto;
display: block;
height: 180px;
overflow: hidden;
width: 240px;
margin-left: -10px;
}
.PopularPosts .item-thumbnail img {
position: relative;
top: -30px;
transition:all .2s linear;
 -o-transition:all .5s linear;
-moz-transition:all .2s linear;
-webkit-transition:all .2s linear;
}

.PopularPosts .item-thumbnail img:hover{
opacity:.6;
filter:alpha(opacity=60)
}
.PopularPosts .widget-content ul li {
color: #555555;
}

.PopularPosts .item-title {
clear:both;
font: 10px verdana;
color: #222222;
text-transform: uppercase;
text-align: center;
margin-right: 10px;
}

.PopularPosts .item-snippet {
display: none;
}

.widget .widget-item-control a img {
height: 18px;
width: 18px;

}

</style>


Step 4. Still in the template editor, you next need to search for this tag:

</body>

Just above it you need to paste this code:


<script type='text/javascript'>                   
function changeThumbSize(id,size){
var blogGadget = document.getElementById(id);
var replacement = blogGadget.innerHTML;
blogGadget.innerHTML = replacement.replace(/s72-c/g,&quot;s&quot;+size+&quot;-c&quot;);
var thumbnails = blogGadget.getElementsByTagName(&quot;img&quot;);
for(var i=0;i&lt;thumbnails.length;i++){ 
thumbnails[i].width = size; 
thumbnails[i].height = size; 
}
}
changeThumbSize(&quot;PopularPosts1&quot;,240);                   
</script>

3- Save lại Template mà bạn mới làm.
4- Cho Blogspot hoạt động thử để biết kết quả của hiệu ứng.

Xem bản Demo:

http://itcomputerdemo.blogspot.com/

Chúc các bạn thành công với tài liệu chia sẽ mà Khanhnguyen's Blog đã Cóp được từ nguồn bloominrouge.com

Tổng hợp và chia sẽ: Nguyễn Đạt Khánh

Share:

Nguyễn Đạt Khánh | Thứ Năm, tháng 6 02, 2016 | Bài đăng | Thủ thuật Blogger Be the first to comment!

Được viết bởi Khánh Nguyễn

Nơi truy cập vào Nick của Tôi trên mạng:

Thêm Recent Comments có ảnh Avatar bo tròn tuyệt vời cho Blogger Blogspot

Nguyễn Đạt KhánhThứ Năm, tháng 6 02, 2016Comments, Thủ thuật Blogger, Thumbnail Facebook Comment Không có nhận xét nào

Làm cách nào để thực hiện được, khi mà bạn muốn có được những những Comments gần đây. Tất cả chỉ trong một Widget thôi với ảnh Avatar được bo tròn rất đẹp.

Các bước thực hiện như sau:
1- Mỡ Blogger, vào Layout, tạo một Widget HTML/JavaScript
2- Chép Source Code dưới đây dán vào trong khung soạn thảo Code:

<style type="text/css">
ul.helploggercomments{list-style: none;margin: 0;padding: 0;}
.helploggercomments li {background: none !important;margin: 0 0 6px !important;padding: 0 0 6px 0 !important;display: block;clear: both;overflow: hidden;list-style: none;word-break:break-all;}
.helploggercomments li .avatarImage {padding: 3px;
background: #fefefe;-webkit-box-shadow: 0 1px 1px #ccc;-moz-box-shadow: 0 1px 1px #ccc;box-shadow: 0 1px 1px #ccc;float: left;margin: 0 6px 0 0;position: relative;overflow: hidden;}
.avatarRound {-webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;}
.helploggercomments li img {padding: 0px;position: relative;overflow: hidden;display: block;}
.helploggercomments li span {margin-top: 4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var numComments  = 5,
showAvatar  = true,
avatarSize  = 60,
roundAvatar = true,
characters  = 40,
showMorelink = false,
moreLinktext = "More »",
defaultAvatar  = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinC_dyrNbFMPTMmjIW-isjvAplxqgE-Mz8NCt9c_pIrnk9aYVPH_Ep5uZdWfZgBh8q-YRv_Ol_HU0aNZxASMVSniUpni99ZLwcAKKZsCXXW-NRYHMsumOeWMdBwZbX5AmrbM6kXY0nkhsQ/s1600/default-avatar.jpg",
hideCredits = true;
//]]>
</script>
<script type="text/javascript">
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('7 E=E||5,8=8||12,o=o||13,k=k||"h://4.F.p.f/-14/15/16/17/G/18-19.1a",H=H||" 1b &1c;",q=(r q===\'u\')?j:q,v=(r v===\'u\')?Q:v,m=(r m===\'u\')?j:m,I=(r I===\'u\')?Q:m;1d R(w){7 9;9=\'<S J="R">\';K(7 i=0;i<E;i++){7 x,y,3,n;6(i==w.T.b.z)1e;9+="<U>";7 b=w.T.b[i];K(7 l=0;l<b.L.z;l++){6(b.L[l].1f==\'1g\'){x=b.L[l].A}}K(7 a=0;a<b.M.z;a++){y=b.M[a].1h.$t;3=b.M[a].1i$1j.V}6(3.g("/G/")!=-1){3=3.B("/G/","/s"+8+"-c/")}e 6(3.g("/W/")!=-1){3=3.B("/W/","/s"+8+"-c/")}e 6(3.g("/X-c/")!=-1&&3.g("h:")!=0){3="h:"+3.B("/X-c/","/s"+8+"-c/")}e 6(3.g("N.f/C/1k-Y.O")!=-1){3="h://1.F.p.f/-1l/1m/1n/1o/s"+8+"/1p.Z"}e 6(3.g("N.f/C/1q-Y.O")!=-1){3="h://2.F.p.f/-1r/1s/1t/1u/s"+8+"/1v.Z"}e 6(3.g("N.f/C/1w.O")!=-1){6(k.g("1x.f")!=-1){3=k+"&s="+8}e{3=k}}e{3=3}6(q==j){6(m==j){n="1y"}e{n=""}9+="<10 J=\\"1z "+n+"\\"><C J=\\""+n+"\\" V=\\""+3+"\\" 1A=\\""+y+"\\" 1B=\\""+8+"\\" 1C=\\""+8+"\\"/></10>"}9+="<a A=\\""+x+"\\">"+y+"</a>";7 11=b.1D.$t;7 d=11.B(/(<([^>]+)>)/1E,"");6(d!=""&&d.z>o){d=d.1F(0,o);d+="&1G;";6(v==j){d+="<a A=\\""+x+"\\">"+H+"</a>"}}e{d=d}9+="<D>"+d+"</D>";9+="</U>"}9+=\'</S>\';7 P="";6(I==j){P="1H:1I;"}9+="<D 1J=\\"1K-1L:1M;1N:1O;1P-1Q:1R;"+P+"\\">1S 1T<a A=\\"h://w.p.f/\\"> 1U</a></D>";1V.1W(9)}',62,121,'|||authorAvatar|||if|var|avatarSize|commentsHtml||entry||commBody|else|com|indexOf|http||true|defaultAvatar||roundAvatar|avatarClass|characters|blogspot|showAvatar|typeof|||undefined|showMorelink|helplogger|commentlink|authorName|length|href|replace|img|span|numComments|bp|s1600|moreLinktext|hideCredits|class|for|link|author|blogblog|gif|hideCSS|false|helploggercomments|ul|feed|li|src|s220|s512|rounded|png|div|commHTML|60|40|SRSVCXNxbAc|UrbxxXd06YI|AAAAAAAAFl4|332qncR9pD4|default|avatar|jpg|More|raquo|function|break|rel|alternate|name|gd|image|b16|7bkcAKdpGXI|UrbyQRqvSKI|AAAAAAAAFmI|oBv_yMeYnMQ|blogger|openid16|VgnInuIUKBU|UrbzyXTYWRI|AAAAAAAAFmU|3f_Vfj3TI6A|openid|blank|gravatar|avatarRound|avatarImage|alt|width|height|content|ig|substring|hellip|visibility|hidden|style|font|size|10px|display|block|text|align|right|Widget|by|Helplogger|document|write'.split('|'),0,{}))
</script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&callback=helploggercomments&max-results=5"></script><div style="font-size: 10px; float: right; margin-top: -15px">Get this <a href="http://helplogger.blogspot.com/2012/03/add-recent-comments-widget-with-avatar.html">Recent Comments Widget</a></div>

3- Save lại Widget mà bạn mới tạo.
4- Cho Blogspot hoạt động thử để biết kết quả của hiệu ứng.

Xem bản Demo:

http://itcomputerdemo.blogspot.com/2016/06/demo-automatic-featured-post-slider.html

Chúc các bạn thành công với tài liệu chia sẽ mà mình đã Cóp được từ nguồn helplogger.blogspot.com

Tổng hợp và chia sẽ: Nguyễn Đạt Khánh

Share:

Nguyễn Đạt Khánh | Thứ Năm, tháng 6 02, 2016 | Comments | Thủ thuật Blogger | Thumbnail Be the first to comment!

Được viết bởi Khánh Nguyễn

Nơi truy cập vào Nick của Tôi trên mạng:

Thứ Hai, 30 tháng 5, 2016

Từ hôm ấy ! - Tác giả: Minh Ha

Nguyễn Đạt KhánhThứ Hai, tháng 5 30, 2016Bầu rượu túi thơ Facebook Comment Không có nhận xét nào

Từ hôm ấy ta ngừng hỏi thăm nhau

Ngừng yêu thương và bắt đầu xa lạ

Mải miết đi trên đường đời trăm ngả

Chẳng một ai nhắc hai chữ "đã từng "

Từ hôm ấy ta bổng hóa người dưng

Lối quen xưa giờ rêu phong cỏ úa

Bờ vai xưa mái đầu ai nghiêng tựa

Giờ bơ vơ nghe lạnh buốt thân gầy

Từ hôm ấy chìm đắm giữa cơn say

Hồn mộng tưởng ngày tao phùng hạnh phúc

Đất ngừng quay cho con tim thúc giục

Về bên nhau ta xây lại từ đầu

Từ hôm ấy hồn như thấy quặn đau

Lòng chua xót cho cuộc tình đã mất

Chuyện ngày xưa đã từng là rất thật

Giờ tan nhanh như sương khói ngang trời... !

30/5/2016 6g40 pm

P/s Xin mượn ai đó khổ thơ đầu 🙏🙏🙏🙏

Tác giả Minh Ha

https://plus.google.com/u/0/101105515808115919099

Bạn có thể tham khảo các bài thơ trong Bầu rượu túi thơ do Khanhnguyen' s blog sưu tập từ trên các diễn đàn mạng xã hội

Share:

Nguyễn Đạt Khánh | Thứ Hai, tháng 5 30, 2016 | Bầu rượu túi thơ Be the first to comment!

Được viết bởi Khánh Nguyễn

Nơi truy cập vào Nick của Tôi trên mạng:

Thứ Hai, 9 tháng 5, 2016

Hướng Dẫn Thủ Thuật Hiển Thị Số Lượt Xem Bài Đăng Trong Blogspot

Nguyễn Đạt KhánhThứ Hai, tháng 5 09, 2016Cơ bản, Thủ thuật Blogger Facebook Comment Không có nhận xét nào

Để làm được thủ thuật này các bạn thực hiện các bước sau:

Bước 1: Đăng ký tài khoản Firebase

Firebase cho bạn đăng ký miễn phí để sử dụng tiện ích này, bạn vào link đưới đây để đăng ký. Rất dễ dàng để bạn tạo 1 App cho tiện ích này.

https://console.firebase.google.com/project/firebase-nguyendatkhanh/overview

Blog Khanhnguyen, có được 1 App là: https://nguyendatkhanh.firebaseio.com/

Bước 2: Thêm code thống kê vào mẫu.

Vào bảng điều khiển Blogger -> Mẫu (Template) -> Chỉnh sửa HTML (Edit HTML)

-( Ctrl + F ) tìm tới ]]></b:skin> và dán code dưới đây ngay trên nó

 /*-------- Thống kê bài viết  ----------*/
#views-container {
width: 85px;
float: right;
}
.mbtloading {
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhN0-AWyUglJ-rcdd5kL38gf1nYkZbLbuqp1EekFSk3U-jH3CrBbStX1j6jAsWGB5Tc7zOdxy4TIg2fMjVQm8hiBHKVu2oQ58eWrqQvfMAd-2u14MoClF4fBJIwi6ymXbPEZBhLrgZxy6nf/s320/mbtloading.gif') no-repeat left center;
width: 16px;
height: 16px;
}
.viewscount {
float: right;
color: #EE5D06;
font: bold italic 14px arial;
}
.views-text {
float: left;
font: bold 12px arial;
color: #333;
}
.views-icon{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEpgeBiGQzIS9UrXTIINjw54qUvrDmr0AXjTOmv3kKZ9xaidQFnfu_5s6MVOuubPhhjUMsuiYqGWopJgLx3t_kQfK7lYkw8ihr-Y7JyeXhTp5GDOavoOE469XO4tcuWgVneECptjYv70Qe/s1600/postviews.png') no-repeat left;border: 0px;
display: block;
width: 16px;
height: 16px;
float: left;
padding: 0px 2px;
}

- Chữ bôi đỏ là màu sắc của số đếm,

-> Tiếp theo bạn tìm tới </body> và dán code dưới đây ngay trên nó.

 <script type='text/javascript'>
    window.setTimeout(function() {
 document.body.className = document.body.className.replace(&#39;loading&#39;, &#39;&#39;);
      }, 10);
  </script>
<script src='https://cdn.firebase.com/v0/firebase.js' type='text/javascript'/>
<script>
$.each($(&#39;a[name]&#39;), function(i, e) {
var elem = $(e).parent().find(&#39;#postviews&#39;).addClass(&#39;mbtloading&#39;);
var blogStats = new Firebase(&quot;https://nguyendatkhanh.firebaseio.com/pages/id/&quot; + $(e).attr(&#39;name&#39;));
blogStats.once(&#39;value&#39;, function(snapshot) {
var data = snapshot.val();
var isnew = false;
if(data == null) {
data= {};
data.value = 0;
data.url = window.location.href;
data.id = $(e).attr(&#39;name&#39;);
isnew = true;
}
elem.removeClass(&#39;mbtloading&#39;).text(data.value);
data.value++;
if(window.location.pathname!=&#39;/&#39;)
{
if(isnew)
blogStats.set(data);
else
blogStats.child(&#39;value&#39;).set(data.value);
}
});
});
</script>

- Link: https://nguyendatkhanh.firebaseio.com được bạn thay đổi bằng link của bạn lấy.

- Bạn Click vào lấy Code như hình phía dưới.

Tiếp theo, bạn tìm tới <data:post.body/> và dán code dưới đây ngay phía dưới nó.

Chú ý: Nếu bạn tìm thấy nhiều <data:post.body/> thì hãy lựa chọn kết quả tìm thấy đầu tiên, trình tự bằng cách thử đưa Code vào như hướng dẫn cho đến khi xuất hiện.

<div id='views-container'><span class='views-icon'/><div class='views-text'>Views:</div> <div class='mbtloading viewscount' id='postviews'/></div>

PS: Đoạn Javascript này cần sự hỗ trợ của Jquery nên nếu trong Template bạn chưa thấy có thì thêm Jquery đó vào dưới <head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>

-> Bạn lưu lại template của Blog sau khi hoàn thiện Code.

Chúc các bạn thành công.

Người viết: Nguyễn Đạt Khánh

Share:

Nguyễn Đạt Khánh | Thứ Hai, tháng 5 09, 2016 | Cơ bản | Thủ thuật Blogger Be the first to comment!

Được viết bởi Khánh Nguyễn

Nơi truy cập vào Nick của Tôi trên mạng:

Chủ Nhật, 8 tháng 5, 2016

Thủ thuật làm nổi bật Comment trong hệ thống bình luận cho Blogspot

Nguyễn Đạt KhánhChủ Nhật, tháng 5 08, 2016Comments, Thủ thuật Blogger Facebook Comment Không có nhận xét nào

Comment là một lời bình luận, nhận xét, giải thích mà bất cứ một bài đăng nào của một Blogger cũng đều rất cần thiết. Giá trị của chúng đều có điều lợi hại từ hai phía. Bất cứ một Blogger nào khi viết bài, hay tổng hợp kiến thức dẫu viết hay dỡ cỡ nào chăng nữa cũng cần được bạn bè, độc giả quan tâm. Từ những nhận định từ phía người xem, mà bài viết hay bài đăng của mình có tầm cỡ và sức hấp dẫn, khích lệ cao hơn. Nói đúng hơn, là một người viết Blog, mình rất chú trọng đến cả hình thức lẫn nội dung của một khung Comment, xem như đó cũng là tôn trọng độc giả, cũng chính là tôn trọng giá trị của bản thân.

Mình có một cái may mắn, tìm kiếm được từ Blog thủ thuật SeO Blogger một thủ thuật hay về cách trang trí để "làm nổi bật hệ thống Comment", cũng là một IT nhưng hoàn toàn là vừa phải làm, vừa phải tự học trong lĩnh vực nầy, cũng là điều rất ham thích chia sẽ lại cùng các bạn. Cách làm đơn giản thôi:

Bạn hãy làm theo các bước sau để thêm nó vào blog của bạn nhé:

1. Đăng nhập vào blogger :

2. Chọn chuột vào hướng chỉ của mũi tên màu xanh lá: Tiếp theo Click chọn "Mẫu"

3. Chọn vào ô "Chỉnh sữa HTML" để mỡ Template

4. Tìm thẻ này bằng cách sử dụng tổ hợp phím Ctrl + F </ body> và chép Source Code dưới đây dán vào trên nó:

5. Cuối cùng bạn Click chuột lưu lại Template nhe..Có hình dưới minh họa:

Chúc các bạn thành công và có được một khung Comment tuyệt hảo nhé.

Khanhnguyen' s blog
Tư liệu nguồn:

https://thuthuatseoblogger.blogspot.com/2014/11/thu-thuat-lam-noi-bat-comment-cua-admin.html

Share:

Nguyễn Đạt Khánh | Chủ Nhật, tháng 5 08, 2016 | Comments | Thủ thuật Blogger Be the first to comment!

Được viết bởi Khánh Nguyễn

Nơi truy cập vào Nick của Tôi trên mạng:

Thứ Sáu, 6 tháng 5, 2016

Cho em mượn anh cả cuộc đời anh nhé - Huyền linh angela

Nguyễn Đạt KhánhThứ Sáu, tháng 5 06, 2016Bầu rượu túi thơ Facebook Comment Không có nhận xét nào

Cho em mượn ... bờ vai này anh nhé !

Để giọt sầu... lặng lẽ được rơi ra

Để em biết... cảm giác được gọi là

Là điểm tựa... tháng ngày qua mệt mỏi

Đừng nhé anh ... xin anh đừng lau vội
Chuyện tình buồn ... em có lỗi chi đâu

Một lần thôi... xin được khóc thật lâu

Rồi quá khứ ... sẽ chôn sâu mãi mãi

Cho em mượn ... vòng tay đầy ân ái

Để không còn sợ hãi lúc cô đơn

Em mạnh mẽ ... để che giấu nỗi hờn

Sâu trong dạ... từng cơn như chết lặng

Cho em mượn ... nụ hôn anh nồng mặn

Quên cuộc tình... lận đận thuở xa xưa

Cho em mượn... mượn biết mấy cho vừa

Chỉ anh thôi... xin thưa không ai khác

Cho em mượn ... bản nhạc tình anh hát

Sưởi ấm lòng... đang khao khát yêu thương

Cho em mượn... anh đi hết con đường

Đường hạnh phúc... tình thương vô bờ bến

Nắm tay em ... hai ta cùng đi đến

Vườn ái ân... trái trìu mến ngọt lành

Cho em mượn... suốt cả cuộc đời anh

Chung nhịp đập ... ta kết thành phu phụ.

+Huyền linh angela 6/5/2016

https://plus.google.com/106353498056639854575

Bạn có thể tham khảo các bài thơ trong Bầu rượu túi thơ do Khanhnguyen' s blog sưu tập từ trên các diễn đàn mạng xã hội

Share:

Nguyễn Đạt Khánh | Thứ Sáu, tháng 5 06, 2016 | Bầu rượu túi thơ Be the first to comment!

Được viết bởi Khánh Nguyễn

Nơi truy cập vào Nick của Tôi trên mạng:

Mưa quê - Thu Hằng

Nguyễn Đạt KhánhThứ Sáu, tháng 5 06, 2016Bầu rượu túi thơ Facebook Comment Không có nhận xét nào

Giọt mưa thao thức bên hiên
Lanh canh đêm dài tí tách
Đêm nằm nghe mưa gõ nhịp
Đau đáu lòng mưa quê nhà...

Ươn ướt nỗi niềm xưa cũ
Ngoài vườn tàu chuối hàng cau
Mái tranh vờn bay khói bếp
Trong màn mưa mỏng lao xao

Thơm lừng từ bàn tay mẹ
Tô canh nóng hổi ngọt ngào
Hồn nhiên nụ cười thơ trẻ
Nô đùa rượt đuổi tắm mưa

Vẫn mưa... đêm dài không ngủ
Nghe mùa thơ ấu trôi xa
Quê nhà hàng cau khói bếp
Đau đáu lòng ơi mưa nhòa...

tặng người nơi xa...

Võ Thị Thu Hằng

https://plus.google.com/110152031833968160168

Bạn có thể tham khảo các bài thơ trong Bầu rượu túi thơ do Khanhnguyen' s blog sưu tập từ trên các diễn đàn mạng xã hội

Share:

Nguyễn Đạt Khánh | Thứ Sáu, tháng 5 06, 2016 | Bầu rượu túi thơ Be the first to comment!

Được viết bởi Khánh Nguyễn

Nơi truy cập vào Nick của Tôi trên mạng:

Buồn - Nam Trần

Nguyễn Đạt KhánhThứ Sáu, tháng 5 06, 2016Bầu rượu túi thơ Facebook Comment Không có nhận xét nào

Thoảng nghe tiếng động mơ hồ
Hình như có chiếc lá khô rụng rồi
Lòng buồn ngắm cảnh chiều rơi
Đứt từng sợi nắng ráng trời bóng xiêu

Màn đêm buông xuống tịch liêu
Giát mờ ánh bạc trăng phiêu gợi tình
Gió về cảnh sắc lung linh
Phiêu diêu viễn cảnh một tình yêu xa

Một đêm trăng tỏ ánh ngà
Trên con đường ấy mùi hoa thơm lừng
Nhìn em tha thiết ngập ngừng
Lời yêu định nói, lừng khừng lại thôi

Lệ buồn mặn đắng bờ môi
Vùng vằng hờn dỗi em tôi bỏ về
Mặc tôi chôn chặt câu thề
Giật mình chợt tỉnh cơn mê phiêu bồng

Một mình lại vẫn phòng không
Đêm buồn trăng tỏ nỗi lòng cô đơn./.

Bạn có thể biết thêm về cuộc đời của Cố nhạc sĩ Phạm Duy tại đây::

06/5/2016. TTH590

Nam Trần

https://plus.google.com/113163108387735239644

Bạn có thể tham khảo các bài thơ trong Bầu rượu túi thơ do Khanhnguyen' s blog sưu tập từ trên các diễn đàn mạng xã hội

Share:

Nguyễn Đạt Khánh | Thứ Sáu, tháng 5 06, 2016 | Bầu rượu túi thơ Be the first to comment!

Được viết bởi Khánh Nguyễn

Nơi truy cập vào Nick của Tôi trên mạng:

Hãy quên đi - Xuân Mai

Nguyễn Đạt KhánhThứ Sáu, tháng 5 06, 2016Bầu rượu túi thơ, Xuân Mai Facebook Comment Không có nhận xét nào

Nhận xét:

"Hãy quên đi", "quên đi"...thâu tóm lại chỉ một lời lẽ vấn an, nhắc nhỡ. Thật là khá hay với cuộc đời người, một dòng ngược xuôi trôi chảy, quẳng nặng truân chuyên. Những mong tất cả bình an, chúc anh ngày mới vui vẽ.

Hãy quên đi sông xa mịt mờ
Quên con thuyền lạc lối bơ vơ
Bao nhiêu năm dòng đời trôi mãi
Bao nhiêu lần thăm lại bến mơ

Hãy quên đi bao năm vội vàng
Mãi đi tìm xuân giữa rừng hoang
Em nghe chăng tiếng đời đang gọi
Sao không về, sao mãi lang thang

Hãy quên đi bao nhiêu tội tình
Mặc cho đời chìm nổi nhục vinh
Đêm hôm qua có người lên núi
Ta giật mình nghe lại câu kinh

Ngủ đi em quên cơn mộng dài
Ngủ đi em ngày đã tàn phai
Quên đi bao muộn phiền cay đắng
Quên nhọc nhằn còn nặng trên vai…..

Bạn có thể tham khảo các bài thơ trong Bầu rượu túi thơ do Khanhnguyen' s blog sưu tập từ trên các diễn đàn mạng xã hội

Xuân Mai

(Bài cũ đã chỉnh sửa lại)
Ảnh sưu tầm trên Google.

Nhạc nền:

Tôi vẫn nhớ

Share:

Nguyễn Đạt Khánh | Thứ Sáu, tháng 5 06, 2016 | Bầu rượu túi thơ | Xuân Mai Be the first to comment!

Được viết bởi Khánh Nguyễn

Nơi truy cập vào Nick của Tôi trên mạng:

Kết bạn cùng KhanhNguyen's blog

Thứ Năm, 2 tháng 6, 2016

7 Stylish Popular Post Widget cho Blogger - Blogspot

Colorful popular posts

Được viết bởi Khánh Nguyễn

Thế nào để có một Popular Post Thumbnail cho blogger blogspot

http://itcomputerdemo.blogspot.com/

Được viết bởi Khánh Nguyễn

Thêm Recent Comments có ảnh Avatar bo tròn tuyệt vời cho Blogger Blogspot

http://itcomputerdemo.blogspot.com/2016/06/demo-automatic-featured-post-slider.html

Được viết bởi Khánh Nguyễn

Thứ Hai, 30 tháng 5, 2016

Từ hôm ấy ! - Tác giả: Minh Ha

https://plus.google.com/u/0/101105515808115919099

Được viết bởi Khánh Nguyễn

Thứ Hai, 9 tháng 5, 2016

Hướng Dẫn Thủ Thuật Hiển Thị Số Lượt Xem Bài Đăng Trong Blogspot

https://console.firebase.google.com/project/firebase-nguyendatkhanh/overview

Được viết bởi Khánh Nguyễn

Chủ Nhật, 8 tháng 5, 2016

Thủ thuật làm nổi bật Comment trong hệ thống bình luận cho Blogspot

https://thuthuatseoblogger.blogspot.com/2014/11/thu-thuat-lam-noi-bat-comment-cua-admin.html

Được viết bởi Khánh Nguyễn

Thứ Sáu, 6 tháng 5, 2016

Cho em mượn anh cả cuộc đời anh nhé - Huyền linh angela

https://plus.google.com/106353498056639854575

Được viết bởi Khánh Nguyễn

Mưa quê - Thu Hằng

https://plus.google.com/110152031833968160168

Được viết bởi Khánh Nguyễn

Buồn - Nam Trần

https://plus.google.com/113163108387735239644

Được viết bởi Khánh Nguyễn

Hãy quên đi - Xuân Mai

Được viết bởi Khánh Nguyễn

Thống kê Blogspot

Nhãn

Lưu trữ Blog

Bài có thể xem

Mời tham gia CLB