And since i rather preffer to use my old threaded comment cuz i love emoticon more than this new threaded comment. Some what i don't think that my old threaded comment is realy bad to be used. The difference betwen, is just that my old threaded comment doesn't embed replay comment on the same column with the comment replayed, isn't it the only difference betwen?
Well, what about you, emoticon or this new threaded comment?. Both? Fortunately, you can't have them both at once.
- 
And by the way you can guys go to my previous post about threaded comment if you want to do so. Here it is: How To Create Threaded Comment On Blogger Blog?. Or about emoticon: How To Add Smiley Emoticon Into Comment Section On Blogger Without Eror?.
Now Let's Talk About How To Implement This New Threaded Comment Service On Your Blog
1. Go to your blogger.
2. Design page.
3. Edit Html.
4. Check the Expand Widget Template box to load the entire codes in your template.
5. Copy and save the entire codes in the text box for anticipation of making mistake when you modify your template. Or simply download the codes through Download Full Template
6. Find the following code in your template. There are 3 of this code in my template, and it might apply in your template as well: < b:include data='post' name='comments'/>. Just replace the code in red with the following: threaded_comments. Well the code should look like this: < b:include data='post' name='threaded_comments'/>. Replace all three codes that you found.
7. Now find the following code: < body>. Copy and paste the code below right above that code.
To be the lesser arrangement the above code looks like the below:
< b:includable id='threaded_comment_css'>
< style >
< ! - - threaded comment blogger - - >
.comments {
clear:both;
margin-top:10px 0 0;
line-height:1em;}
.comments .comments-content{font-size:12px;margin-bottom:16px;font-weight:normal;text-align:left;line-height:1.4em;}
.comments .comment .comment-actionsa{display:inline-block;margin:0;padding:1px6px;border:1px solid #C4C4C4;border-top-color:#E4E4E4;border-left-color:#E4E4E4;color:#424242;text-align:center;text-shadow:0 1px white;text-decoration:none;-webkit-border-radiu5E5E5100%);font:11px/18pxsans-serif;padding:2px8px;margin-right:10px;}
.comments .comment .comment-actionsa:hover{text-decoration:none;background:#fff;border:1pxsolid#5AB1E2;}
.comments .comments-content .comment-thread ol{list-style-type:none;padding:0;text-align:none;}
.comments .comments-content.inline-thread{padding:0.5em1em;}
.comments .comments-content .comment-thread{margin:8px0px;}
.comments .comments-content .comment-thread:empty{display:none;}
.comments .comments-content .comment-replies{margin-top:1em;margin-left:40px;font-size:12px;background:#EBF5FE;}
.comments .comments-content .comment{margin-bottom:16px;padding-bottom:8px;}
.comments .comments-content .comment:first-child{padding-top:16px;}
.comments .comments-content .comment:last-child{border-bottom:0;padding-bottom:0;}
.comments .comments-content .comment-body{position:relative;}
.comments .comments-content .user{font-style:normal;font-weight:bold;}
.comments .comments-content .user a{color:#2D5E7B;font-size:14px;font-weight:bold;text-decoration:none;}
.comments .comments-content .icon. blog-author{width:18px;height:18px;display:inline-block;margin:0 0 - 4 6px;}
.comments .comments-content .datetime{color:#999999;float:right;font-size:11px;text-decoration:none;}
.comments .comments-content, .comments .comments-content .comment-content{margin:0 0 8px;}
.comment-header{background-color:#F4F4F4;border:thin solid #E6E6E6;margin-bottom:5px;padding:5px;}
.comments .comments-content .comment-content{text-align:none;}
.comments .comments-content .owner-actions{position:absolute;right:0;top:0;}
.comments .comments-replybox{border:none;height:250px;width:100%;}
.comments .comment-replybox-single{margin-top:5px;margin-left:48px;}
.comments .comment-replybox-thread{margin-top:5px;}
.comments .comments-content .loadmore a{display:block;padding:10px16px;text-align:center;}
.comments .thread-toggle{cursor:pointer;display:inline-block;}
.comments .continue{cursor:pointer;}
.comments .continue a{display:inline-block;margin:0;padding:1px6px;border:1px solid #C4C4C4;border-top-color:#E4E4E4;border-left-color:#E4E4E4;color:#424242;text-align:center;text-shadow:0 - 1px 0 white;text-decoration:none;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;background:#EDEDED;background:-webkit-gradient(linear,lefttop,left bottom,color-stop(.2,white),color-stop(1,#E5E5E5));background:-moz-linear-gradient(centertop,white20%,#E5E5E5100%);font:11px/18px sans-serif;padding:2px8px;margin-right:10px;}
.comments .comments-content .loadmore{cursor:pointer;max-height:3em;margin-top:3em;}
.comments .comments-content .loadmore .loaded{max-height:0px;opacity:0;overflow:hidden;}
.comments .thread-chrome .thread-collapsed{display:none;}
.comments .thread-toggle{display:inline-block;}
.comments .thread-toggle.thread-arrow{display:inline-block;height:6px;width:7px;overflow:visible;margin:0.3em;padding-right:4px;}
.comments .thread-expanded.thread-arrow{background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC")no-repeatscroll 0 0 transparent;}
.comments .thread-collapsed .thread-arrow{background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAABJRU5ErkJggg
==") no-repeat scroll 0 0 transparent;}
.comments .avatar-image-container{background-image: url("http://img846.imageshack.us/img846/7357/unled1oww.jpg");background-position:centercenter;background-repeat:no-repeat;float:left;width:36px;max-height:36px;margin:0;outline:1pxsolid#FFFFFF;padding:3px;vertical-align:middle;overflow:hidden;border:1pxsolid#DDDDDD;}
.comments .avatar-image-container img{width:36px;}
.comments .comment-block{margin-left:48px;position:relative;}
/*Responsive styles.*/ @mediascreenand(max-device-width:480px)
{
.comments .comments-content .comment-replies{margin-left:0;
}
}
< /style>
< / b :includable>
8. Save your template and you're done. Just check if your new threaded comment is shown up and working properly by replaying a comment on your blog.
Actually you could even make the easiest way to show it up on your blog, but this way the thread shown to replay is loaded as a anchor link, not a button. Yet, if you'd rather preffer to use it you can go to "Dashboard> Design> Edit Html". Scroll to bottom and look for a long button link titled Revert Widget Template To Default, Click it and you're done. Your new threaded comment should show up now. Don't worry about your layout and widget template, they will remain the same as before. But it doesn't mean that you don't need to back up your template prior to do it.
I'd read some articles before i wrote this, but i copypassed the code from: http://www.masterendi.com/. Sorry to brother endi cuz i don't link it, i just don't want if one day i should dig a deep to fix a broken link. Don't take it wrong.. 
Thanks for your visit bro. :)
ReplyDelete