Header Ads

  • Terkini

    Tutorial Widget Komen Terkini Tanpa Paparan Komen Pemilik Blog

    Tutorial Widget Komen Terkini Tanpa Paparan Komen Pemilik Blog

    Ada seorang teman blogger yang bertanyakan tentang widget ini. Saya kata tak ada lagi sebab belum pernah nampak.. Tapi semalam google punya google.. terjumpalah widget ini dari helpblogger.

    Di sini saya ingin kongsikan bagaimana memasang widget "Tutorial Widget Komen Terkini Tanpa Paparan Komen Pemilik Blog" untuk blogger? Ikuti langkah-langkah seperti berikut.
    • Pergi ke Blogger Dashboard
    • Klik pada Layout tab
    • Klik Add Gadget dan pilih 'HTML/Javascript'
    • Salin kod di bawah ini dan paste kan dalam kotak berkenaan
    • Namakan widget anda, contohnya "Komentar Terkini"
    LIVE DEMO UNTUK BLOG INI





    Salin html kod di bawah ini dan pastekan dalam kotak gadget blog anda.



    Sila lihat kod yang diwarnakan
    <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 = "http://2.bp.blogspot.com/-GfFjD8etS2E/UTPve4mQdYI/AAAAAAAAC7k/gy0DVRlx4xM/s"+sizeAvatar+"/anonymous-Icon.jpg"; 
    var urlAnoAvatar = 'http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&s=' + sizeAvatar;
    var txtMore = '';
    var txtWrote = 'komen:';
    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>
    <script language="javascript">
    document.write( unescape( '%3C%64%69%76%20%73%74%79%6C%65%3D%22%74%65%78%74%2D%61%6C%69%67%6E%3A%20%63%65%6E%74%65%72%3B%22%3E%0A%09%09%09%3C%73%70%61%6E%20%73%74%79%6C%65%3D%22%66%6F%6E%74%2D%73%69%7A%65%3A%31%31%70%78%3B%22%3E%3C%73%70%61%6E%3E%3C%61%20%68%72%65%66%3D%22%68%74%74%70%3A%2F%2F%77%61%61%7A%69%6E%2E%62%6C%6F%67%73%70%6F%74%2E%63%6F%6D%2F%32%30%31%33%2F%30%39%2F%74%75%74%6F%72%69%61%6C%2D%77%69%64%67%65%74%2D%6B%6F%6D%65%6E%2D%74%65%72%6B%69%6E%69%2D%74%61%6E%70%61%2D%6B%6F%6D%65%6E%2D%70%65%6D%69%6C%69%6B%2D%62%6C%6F%67%2E%68%74%6D%6C%22%20%74%61%72%67%65%74%3D%22%5F%62%6C%61%6E%6B%22%20%74%69%74%6C%65%3D%22%44%61%70%61%74%6B%61%6E%20%57%69%64%67%65%74%20%4B%6F%6D%65%6E%20%54%65%72%6B%69%6E%69%20%54%61%6E%70%61%20%50%61%70%61%72%61%6E%20%4B%6F%6D%65%6E%20%50%65%6D%69%6C%69%6B%20%42%6C%6F%67%20%22%3E%44%61%70%61%74%6B%61%6E%20%57%69%64%67%65%74%20%49%6E%69%3C%2F%61%3E%3C%2F%73%70%61%6E%3E%3C%2F%73%70%61%6E%3E%3C%73%70%61%6E%3E%3C%2F%73%70%61%6E%3E%3C%2F%64%69%76%3E%0A%09%09%09' ) );
    </script>
    

    Sebelum anda save widget ini, beberapa setting yang anda mungkin ingin tukar:
    • Setkan bilangan komen yang ingin dipaparkan. Tukar angka "5" dari kod yang bertanda merah.
    • untuk tukar bilangan huruf (character) komen ubah angka "67" dari kod yang bertanda biru tua.
    • untuk tidak memaparkan komen pemilik blog, tukar perkataan "Blogger User" yang bertanda warna kuning dengan username pemilik blog. terdapat DUA tempat yang mesti ditukar.
    • untuk menukar saiz avatar, ubah nombor "50" dari kod bertanda cyan.
    • jika anda tidak mahu paparan avatar bulat, buang kod berwarna hitam seperti di bawah ini:
    -webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;

    Save widget Komen Terkini Tanpa Paparan Komen Pemilik Blog anda. Itu sahaja..
    kredit: helpblogger


    Anda Seorang Blogger?. Sertai Group FB Top Bloggers Untuk Promote Blog dan Ping Entri Anda ! Tingkatkan Trafik Blog ~ Sertai sekarang!..  KLIK SINI

    5 comments:

    1. info yang sangat menarik :)terima kasih

      berminat menjana pendapatan lumayan melalui blog??
      sertai kami di sini ==> http://www.buatduitblog.com/hop.php?ref=airahumairahgmailcom

      ReplyDelete
    2. Terimakasih atas postnya. akan saya coba pada blog saya

      ReplyDelete

    Post Top Ad

    Post Bottom Ad