[Blogger-TT] Recent Comments Widget


Để làm được Recent Comment như hình trên, mọi người làm theo cách sau:
1. Tạo 1 Widget HTML/JavaScript .




2. Chèn đoạn code sau:

 <style type="text/css">
.rc{padding-left:24px; padding-top: 6px;}
.rc a:hover {color: #F3903E;text-decoration: none;}
.rc-ico{margin-left:-20px;margin-top:4px;float:left; margin-right:3px}
.rc-ico img {margin-top: -2px;margin-right:5px; border: 2px solid #fff;-webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .4);-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .4);box-shadow: 0 1px 2px rgba(0, 0, 0, .4);
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
-ms-transition: all 1s ease-in-out; }
.rc-ico img:hover {-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);}
.rc-header{font-size: 13px;}
.rc-header a{}
.rc-body{font-style: italic; font-size:11px;padding: 0px 4px 1px 10px;border: 1px solid transparent;}
.rc-footer{font-size:11px; float: right;}
#rcw-cr {font-family: Arial,Tahoma;font-size:9px;padding-top:7px;display:block;}
</style>
<script type="text/javascript">
var numRecentComments = 5;
var maxCommentChars = 67;
var trueAvatars = true;
var urlMyAvatar = '';
var urlMyProfile = '';
var cropAvatar = true;
var sizeAvatar = 50;
var urlNoAvatar = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_0aSaAlcNKgbai2BCqxkWfLAGmQGTl1xQfWgc9V8KEqGchIAnwasrgnHkVZkuyJsF9pMynN_9kE55ZOZL3jPQr_BUovLrHYSafj1sd3MAsTfqENxMl9B3WXjVWTqp-dZbv-azXbtal7DX/"+sizeAvatar+"/anonymous-Icon.jpg";
var urlAnoAvatar = 'http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&s=' + sizeAvatar;
var txtMore = '';
var txtWrote = 'commented:';
var txtAnonymous = '';
var maxResultsComments = "";
var numPerPost = 2;
var maxPostTitleChars = 40;
var getTitles = true;
var maxResultsPosts = "";
var txtTooltip = '[user] on &quot;[title]&quot; - [date MM-dd-yyyy hh:mm]';
var urlToTitle = {};
function replaceVars(text, user, title, date) {
text = text.replace('[user]', user);
text = text.replace('[date]', date.toLocaleDateString());
text = text.replace('[datetime]', date.toLocaleString());
text = text.replace('[time]', date.toLocaleTimeString());
text = text.replace('[title]', title.replace(/\"/g,'&quot;'));
var i = text.indexOf("[date ");
if(i > -1) {
var format = /\[date\s+(.+?)\]/.exec(text)[1];
if(format != '') {
var txtDate = format.replace(/yyyy/i, date.getFullYear());
txtDate = txtDate.replace(/yy/i, date.getFullYear().toString().slice(-2));
txtDate = txtDate.replace("MM", String("0"+(date.getMonth()+1)).slice(-2));
txtDate = txtDate.replace("mm", String("0"+date.getMinutes()).slice(-2));
txtDate = txtDate.replace("ss", String("0"+date.getSeconds()).slice(-2));
txtDate = txtDate.replace("dd", String("0"+date.getDate()).slice(-2));
//or: txtDate = txtDate.replace("dd", date.getDate());
txtDate = txtDate.replace("hh", String("0"+date.getHours()).slice(-2));
//or: txtDate = txtDate.replace("hh", date.getHours());
text = text.replace(/\[date\s+(.+?)\]/, txtDate)
}
}
return text;
}
if(urlMyProfile == "") {
var elements = document.getElementsByTagName("*");
var expr = /(^| )profile-link( |$)/;
for(var i=0 ; i<elements.length ; i++)
if(expr.test(elements[i].className)) {
urlMyProfile = elements[i].href;
break;
}
}
function getPostUrlsForComments(json) {
for(var i = 0 ; i < json.feed.entry.length ; i++ ) {
var entry = json.feed.entry[i];
for (var k = 0; k < entry.link.length; k++ ) {
if (entry.link[k].rel == 'alternate') {
href = entry.link[k].href;
break;
}
}
urlToTitle[href] = entry.title.$t;
}
}
function showRecentComments(json) {
var postHandled = {};
var j = 0;
if(numPerPost) {
while(numPerPost < numRecentComments) {
for(var i = 0 ; i < json.feed.entry.length ; i++ ) {
var entry = json.feed.entry[i]; if(entry.author[0].name.$t=="Blogger User") continue;
if(entry["thr$in-reply-to"]) {
if(!postHandled[entry["thr$in-reply-to"].href])
postHandled[entry["thr$in-reply-to"].href] = 1;
else
postHandled[entry["thr$in-reply-to"].href]++;
if(postHandled[entry["thr$in-reply-to"].href] <= numPerPost)
j++;
}
}
if(j >= numRecentComments)
break;
numPerPost++;
j = 0;
postHandled = {};
}
if(numRecentComments == numPerPost)
numPerPost = 0;
}
postHandled = {};
j = 0;
for(var i = 0 ; j < numRecentComments && i < json.feed.entry.length ; i++ ) {
var entry = json.feed.entry[i]; if(entry.author[0].name.$t=="Blogger User") continue;
if(numPerPost && postHandled[entry["thr$in-reply-to"].href] && postHandled[entry["thr$in-reply-to"].href] >= numPerPost)
continue;
if(entry["thr$in-reply-to"]) {
if(!postHandled[entry["thr$in-reply-to"].href])
postHandled[entry["thr$in-reply-to"].href] = 1;
else
postHandled[entry["thr$in-reply-to"].href]++;
j++;
var href='';
for (var k = 0; k < entry.link.length; k++ ) {
if (entry.link[k].rel == 'alternate') {
href = entry.link[k].href;
break;
}
}
if(href=='') {j--; continue; }
var hrefPost = href.split("?")[0];
var comment = "";
if("content" in entry) comment = entry.content.$t;
else comment = entry.summary.$t;
comment = comment.replace(/<br[^>]*>/ig, " ");
comment = comment.replace(/<\S[^>]*>/g, "");
var postTitle="-";
if(urlToTitle[hrefPost]) postTitle=urlToTitle[hrefPost];
else {
if(hrefPost.match(/\/([^/]*)\.html/)) postTitle = hrefPost.match(/\/([^/]*)\.html/)[1].replace(/_\d{2}$/, "");
postTitle = postTitle.replace(/-/g," ");
postTitle = postTitle[0].toUpperCase() + postTitle.slice(1);
}
if(maxPostTitleChars && postTitle.length > maxPostTitleChars) {
postTitle = postTitle.substring(0, maxPostTitleChars);
var indexBreak = postTitle.lastIndexOf(" ");
postTitle = postTitle.substring(0, indexBreak) + "...";
}

var authorName = entry.author[0].name.$t;
var authorUri = "";
if(entry.author[0].uri && entry.author[0].uri.$t != "")
authorUri = entry.author[0].uri.$t;
var avaimg = urlAnoAvatar;
var bloggerprofile = "http://www.blogger.com/profile/";
if(trueAvatars && entry.author[0].gd$image && entry.author[0].gd$image.src && authorUri.substr(0,bloggerprofile.length) == bloggerprofile)
avaimg = entry.author[0].gd$image.src;
else {
var parseurl = document.createElement('a');
if(authorUri != "") {
parseurl.href = authorUri;
avaimg = 'http://www.google.com/s2/favicons?domain=' + parseurl.hostname;
}
}
if(urlMyProfile != "" && authorUri == urlMyProfile && urlMyAvatar != "")
avaimg = urlMyAvatar;
if(avaimg == "http://img2.blogblog.com/img/b16-rounded.gif" && urlNoAvatar != "")
avaimg = urlNoAvatar;
var newsize="s"+sizeAvatar;
avaimg = avaimg.replace(/\/s\d\d+-c\//, "/"+newsize+"-c/");
if(cropAvatar) newsize+="-c";
avaimg = avaimg.replace(/\/s\d\d+(-c){0,1}\//, "/"+newsize+"/");
if(authorName == 'Anonymous' && txtAnonymous != '' && avaimg == urlAnoAvatar)
authorName = txtAnonymous;
var imgcode = '<img height="'+sizeAvatar+'" width="'+sizeAvatar+'" title="'+authorName+'" src="'+avaimg+'" />';
if (authorUri!="") imgcode = '<a href="'+authorUri+'">'+imgcode+'</a>';
var clsAdmin = "";
if(urlMyProfile != "" && authorUri == urlMyProfile)
clsAdmin = " rc-admin";
var datePart = entry.published.$t.match(/\d+/g); // assume ISO 8601
var cmtDate = new Date(datePart[0],datePart[1]-1,datePart[2],datePart[3],datePart[4],datePart[5]);

var txtHeader = txtWrote;
if(txtWrote.indexOf('[')==-1)
txtHeader = authorName + ' ' + txtWrote;
else
txtHeader = replaceVars(txtHeader, authorName, postTitle, cmtDate);

var tooltip = replaceVars(txtTooltip, authorName, postTitle, cmtDate);
if(!/#/.test(href)) href += "#comments";
document.write('<div title="'+tooltip+'" class="rc'+clsAdmin+'">');
document.write('<div title="'+tooltip+'" class="rc-header'+clsAdmin+'"><div title="'+tooltip+'" class="rc-ico'+clsAdmin+'">'+imgcode+'</div><a title="'+tooltip+'" href="' + href + '">' + txtHeader + ' </a></div>');
if(comment.length < maxCommentChars)
document.write('<div title="'+tooltip+'" class="rc-body'+clsAdmin+'">' + comment + '</div>');
else {
comment = comment.substring(0, maxCommentChars);
var indexBreak = comment.lastIndexOf(" ");
comment = comment.substring(0, indexBreak);
document.write('<div title="'+tooltip+'" class="rc-body'+clsAdmin+'">' + comment + '...</div>');
if(txtMore != "") {
var moretext = replaceVars(txtMore, authorName, postTitle, cmtDate);
document.write('<div title="'+tooltip+'" class="rc-footer'+clsAdmin+'"><a title="'+tooltip+'" href="' + href + '">' + moretext + '</a></div>');
}
}
document.write('<div style="clear:both;"></div></div>');
}
}
}
if(getTitles)
document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/posts/summary?redirect=false'+maxResultsPosts+'&alt=json-in-script&callback=getPostUrlsForComments"></'+'script>');
document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false'+maxResultsComments+'&alt=json-in-script&callback=showRecentComments"></'+'script>');
</script>
<span id=rcw-cr><a href=http://helplogger.blogspot.ro/2013/03/recent-comments-widget-with-hide-author.html>Recent Comments Widget</a></span>

Chúc mọi người thành công !
http://helplogger.blogspot.com/2013/03/recent-comments-widget-with-hide-author.html
Xem thêm…

[Bloger-TT] CSS Button cho Blogspot

Sử dụng button cho Blogspot dễ dàng hơn với CSS Button.


1. Chèn code CSS vào trước ]&gt;&lt;/b:skin&gt;    

Download CSS Button

2. Sử dụng bằng cách chuyển Bài đăng sang HTML sau đó chọn một trong các mẫu sau:



<a href="#" class="button big blue">Big Button</a>
    <a href="#" class="button big green">Big Button</a>
    <a href="#" class="button big orange">Big Button</a>
    <a href="#" class="button big gray">Big Button</a>
<br/>
<br/>
    <a href="#" class="button blue medium">Medium Button</a>
    <a href="#" class="button green medium">Medium Button</a>
    <a href="#" class="button orange medium">Medium Button</a>
    <a href="#" class="button gray medium">Medium Button</a>
    <br/><br/>
    <a href="#" class="button small blue">Small Button</a>
    <a href="#" class="button small green">Small Button</a>
    <a href="#" class="button small blue rounded">Rounded</a>
    <br/><br/>
    <a href="#" class="button small orange">Small Button</a>
    <a href="#" class="button small gray">Small Button</a>
        <br/><br/>
    <a href="#" class="button small green rounded">Rounded</a>
<br/><br/>
http://www.webdesignshock.com/CSS-buttons/
Xem thêm…

[Themes Joomla] BT Bazaar - Joomla 2.5

Xem thêm…

[Bloger Themes] Boutique Blogger Template

Template name : Boutique

Platform: Blogger / Blogspot

Release date : Sep 2013

Author :  www.soratemplates.com

Designer :  www.elegantthemes.com

Xem thêm…

[Bloger-TT] Khung chứa Code đẹp cho Blogspot

 Khung chứa Code đẹp cho Blogspot

1. Đăng nhập blog

2. Vào Mẫu (Template)
3. Vào chỉnh sửa HTML (edit HMTL). Tìm 1 trong các đoạn code tương tự. (Mẹo: Bấm Ctrl + F để tìm với từ khóa pre hoặc code hoặc pre,code)


Xem thêm…

[Bloger Themes] Cong Ly Blogger Template


Platform type: Blogger / Blogspot

Theme name: Cong Ly

Basic Instructions: How to install a Blogger XML template

Theme author: nguagovt

Designer: http://www.helloximo.com/

Xem thêm…

[Blogspot Themes] Download themes Blogspot


http://btemplates.com

http://vi-template.blogspot.com/
http://besttheme.net/freebies/
http://www.vinathemes.com/search/label/Blogger?max-results=6
http://www.designrazzi.com/2013/free-blogger-templates/
Xem thêm…

[Themes WP] Euclides

 Euclides Wordpress Themes

Euclides is the perfect theme for those who write tutorials online. While we concentrate on web workers, anyone can use this theme. Euclides is a free WordPress theme.

Xem thêm…

[Plugin WP] Tuyển chọn một số plugin shortcode wordpress

Shortcode ( đoạn mã ngắn) là một đoạn code rút gọn của một bộ code lớn thực thi một nhiệm vụ nào đó, việc sử dụng shortcode giúp rút ngắn thời gian và cả sự dễ dàng cho người sử dụng.
Shortcode trong wordpress thông thường cung cấp cho chúng ta các tính năng làm đẹp bài viết, hỗ trợ tuỳ biến trong việc chèn các file media. Điển hình các plugin shortcode thường cung cấp các tính năng như thẻ spoiler ( thu gọn bài viết), thẻ Arrcodions, headline, button, list, highlight, tooltip, chèn ảnh, video,…
Xem thêm…

[Plugin WP] Sticky Social Bar

The jQuery Social Bar is a professional and elegant plugin that adds the possibility of show your social profiles in a sleek and innovative way.
Link :
http://www.ziddu.com/download/21614520/stickysocial_v1.4.3.zip.html


http://www56.zippyshare.com/v/15667636/file.html
Xem thêm…

Tạo trang tìm kiếm bằng Google Search

Công cụ tìm kiếm trên Blogspot đơn điệu, không toàn diện đối với những người khó tính.Tại sao chúng ta không tạo ra 1 công cụ tìm kiếm như của Google,Yahoo,...Nhưng  tạo ra là điều không dễ....heee.Do đó,Google dã cung cấp cho chúng ta 1 công cụ là Google Search Engine.
Với bộ công cụ này việc tìm kiếm trên trang web bạn sẽ trở nên mạnh mẽ và linh hoạt hơn.
Xem thêm…

[Bloger-TT] Tổng hợp Code Cho Bài Viết

Để bài viết hoàn chỉnh trong Blogger bắt buộc ta phải dùng thêm 1 số tiện ích khác cho phù hợp với nội dung bài viết hiển thị.
Mình tổng hợp lại 1 số code mình thường dùng cho bài viết.Các code này nhiều nguồn khác nhau do các Blogspotter Design.
Xem thêm…

[Bloger- TT] Bảng mã màu dành cho Blogger

Trong quá trình thiết kế Blog, ngoài chỉnh sửa bố cục thì việc phối màu để make-up giao diện là công việc thường xuyên của các Blogger.
Xem thêm…

[Bloger-TT] Cách hiển thị code và khung thông báo

 Hiển thị code trong Blogger thật dễ dàng hơn .


Đầu tiên , kiếm

]]></b:skin>

Xem thêm…

[Blogspot-TT]Tạo bài viết liên quan cho blogspot

Để thực hiện, bạn chỉ cần tạo 1 widget HTML/Javascript rồi dán code bên dưới vào:

Trước tiên bạn vào Dashboard -> Layout -> Edit html

Tìm </head> Copy code sau dán vào phía trước thẻ <style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 12px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuZpDcck1ENcGoa-q1esZX5crL9cPdhI1w0H0MG_fImmNWHxJcO4f2nwCop-sLHiA_jd3z1RRur-hTbpyb6l1XzRIXPKlP4j_DzSdgmYC5W3PpKe4iivXpC8JISrdR3kEZ9ybi594nLMo/") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://livefuz.tk/images-blog/Related_posts_hack.js' type='text/javascript'/> Tìm <data:post.body/> Copy code sau dán vào sau thẻ trên <b:if cond='data:blog.pageType == "item"'> <div id='related-posts'> <font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'> <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?max-results=5&orderby=published&alt=json-in-script&callback=related_results_labels"' type='text/javascript'/> </b:if></b:loop> </font> <script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels(); </script> </div></b:if> Nhớ là thay dấu " bằng &_quot; (bỏ _ ra nha) http://blog.livefuz.com/
Xem thêm…

[Bloger-TT] Tạo bài viết liên quan cho blogspot

Tạo

Script tạo danh sách các bài viết liên quan cho Blogger ban đầu được Hoctro phát triển, sau đó được nhân rộng ra với khá nhiều chỉnh sửa. Các bản "bài viết liên quan" hiện nay đều cho phép cấu hình số bài viết hiển thị và số bài viết lấy theo mỗi label. Tuy vậy, trong trường hợp cần liệt kê số lượng lớn các bài viết liên quan thì chưa script nào có khả năng phân trang. Trong bài viết này, tôi sẽ hướng dẫn các bạn làm phân trang cho chúng.


Script này thích hợp với các blog cần liệt kê số lượng lớn các bài viết liên quan (VD như các tập trong 1 bộ truyện tranh). Nếu blog bạn không có nhu cầu này, hãy dùng các bản cũ mà bạn thấy phù hợp.

Xem thêm…

[Blogspot-TT] Thủ thuật bài viết ngẫu nhiên (Random Posts)

Đây là một thủ thuật hòan tòan tương tự với thủ thuật tạo các bài viết ngẫu nhiên cho blog, chỉ khác là mở rộng riêng cho từng nhãn. Nếu blog bạn có một đề tài, chuyên mục nào đó nổi bật, bạn có thể tạo 1 widget random các bài viết từ nhãn (chuyên mục đó).
Để thực hiện, bạn chỉ cần tạo 1 widget HTML/Javascript rồi dán code bên dưới vào:
Trước tiên bạn vào Dashboard -> Layout -> Page Elements và Add a Gadget -> HTML/Javascript
Xem thêm…

[Bloger-TT] Đặt code trong khung bài viết trong blogspot

Thông thường, khi giới thiệu code , chúng ta hay đặt chúng ngay trên bài viết. Vì cùng nằm trên một nền nên nhiều khi trông rất lộn xộn . Vậy phải làm sao để phần giới thiệu ở nền blog chính thức , còn đoạn code ở trong một khung có nền tùy chỉnh ? Chúng ta sẽ biết sau khi đọc xong bài viết sau đây !
Đầu tiên, các bạn hãy vào Trình bày (Layout) và chọn tab Chỉnh sửa HTML mà không cần bật Mở rộng mẫu tiện ích . Sau đó , hãy thêm đoạn code dưới đây ngay trên thẻ 



Xem thêm…