Hie Friends Today i will show u how you can change ur comments in blogger...:)
So Here we go
Then replace the code:
Then replace the code:
NOW THIS WAS TRICK HOW TO ADD THREADED COMMENTS ON BLOGGER
PLEASE SHARE THIS POST WITH UR FRIENDS AND SHOW YOUR LOVE
So Here we go
replace with this code:<b:include data='post' name='threaded_comments'/>
<b:include data='post' name='comments'/>
STYLE 1
Save this code above ]]> </ b: skin>
# Comments {} # Comments h3 {margin-bottom: 15px; font-size: 18px;} . Comment_avatar_wrap { width: 42px; height: 42px; border: 1px solid # c4c4c4; border-top-color: # e4e4e4; border-left-color: # e4e4e4; background: # fcfcfc; padding: 4px; border-radius: 2px; text-align: center; margin-bottom: 20px; } # Comments. Avatar-image-container { float: left; margin: 0 10px 0 0; width: 42px; height: 42px; max-width: 42px; max-height: 42px; padding: 0; margin-bottom: 10px; } # Comments. Avatar-image-container img { width: 42px; height: 42px; max-width: 42px; max-height: 42px; no-repeat; } . Comment_name a { font-weight: bold; padding: 5px 0 0 0; font-size: 13px; text-decoration: none; } . Comment_admin. Comment_name { font-weight: bold; padding: 10px; font-size: 13px; text-decoration: none; background: # eee; } . Comment_admin. COMMENT_DATE { font-weight: normal; font-size: 11px; } . Comment_name { background: # eee; padding: 10px; font-size: 13px; font-weight: bold; position: relative; } . Comment_service { margin-top: 5px } . COMMENT_DATE { color: # a9a9a9; float: right; font-size: 11px; font-weight: normal; margin-top:-3px; } . COMMENT_DATE a { color: # a9a9a9; float: right; font-size: 11px; font-weight: normal; } . COMMENT_DATE a: hover { color: # a9a9a9; text-decoration: none; } . Comment_body { margin-top:-72px; margin-left: 66px; background: # fcfcfc; border: 1px solid # d1d1d1; padding: 10px; border-radius: 2px; } . Comment_body p { line-height: 1.5em; margin: 5px 0 0 0; color: # 666; border: 1px solid # eee; font-size: 13px; word-wrap: break-word; background: # fff; padding: 10px; } . Comment_inner { padding-bottom: 5px; margin: 5px 0 5px 0; } . Comment_child. Comment_wrap {padding-left: 7%;} . Comment_reply { display: inline-block; margin-top: 8px; margin-left:-5px; padding: 1px 12px; color: # fff! important; text-align: center; text-decoration: none; border-radius: 2px; background: # Bababa; font: 11px/18px sans-serif; transition: background-color 1s ease-out 0s; } . Comment_reply: hover { text-decoration: none! important;; background: # 056b95; } . Unneeded-paging-control {display: none;} . Comment-form {max-width: 100%;! Important;} # Comment-editor {width: 103%! Important; background: transparent no-repeat 50% 30%}} . Comment_form a { text-decoration: none; text-transform: uppercase; font-weight: bold; font-family: Arial, Helvetica, Garuda, sans-serif; font-size: 15px; } . Comment_form a: hover {text-decoration: underline;} . Comment-form p { background: # 666; padding: 10px; margin: 5px 0 5px 0; color: # eee; font-size: 13px; line-height: 20px; width: 97%; border-radius: 3px; position: relative; } . Comment-form p: after { content: ""; width: 0; height: 0; position: absolute; bottom:-16px; left: 15px; border: 8px solid transparent; border-color: # 666 transparent transparent; } . Comment_reply_form { padding: 0 0 0 70px; } . Comment_reply_form. Comment-form {width: 99%;} . Comment_emo_list { display: none; } . Comment_emo_list. Items { float: left; text-align: center; margin: 10px 10px 0 0; height: 40px; width: 41px; } . Comment_emo_list span { display: block; font-weight: bold; font-size: 11px; letter-spacing: 1px; } . Comment_emo_list span { display: block; font-weight: bold; font-size: 11px; letter-spacing: 1px; } . Comment_youtube {max-width: 100%! Important; width: 400px; height: 225px; display: block; margin: auto} . Comment_img {max-width: 100%! Important;} . Deleted-comment { padding: 10px 10px 10px 10px; display: block; color: # CCC; } . Comment_arrow { display: block; width: 9px; height: 18px; background: no-repeat; position: absolute; margin-left:-19px; } . Comment_header {width: 50px} # Respond { overflow: hidden; padding-left: 10px; clear: both; } . Comment_avatar no-repeat} . Comment-delete img {float: right; margin-left: 15px; margin-top: 3px; margin-right: 10px} . Comment_author_flag {display: none} . Comment_admin. Comment_author_flag iframe {border: none; overflow: hidden}
Then replace the code:
<b:includable id='comments' var='post'> ... </ B: includable>
with this:<b:includable id='comments' var='post'> <div class='comments' id='comments'> <b:if cond='data:post.allowComments'> <b:if cond='data:post.numComments != 0'> <h3> <b:if cond='data:post.numComments 1'> <data:commentLabel/> == 1: <b:else/> <data:post.numComments/> <data:commentLabelPlural/> </ B: if> </ H3> </ B: if> <b:if cond='data:post.commentPagingRequired'> <span class='paging-control-container'> <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'> <data:post.oldestLinkText/> </ a> <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'> <data:post.olderLinkText/> </ a> <data:post.commentRangeText/> <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'> <data:post.newerLinkText/> </ a> <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'> <data:post.newestLinkText/> </ a> </ Span> </ B: if> <div class='clear'/> <div id='comment_block'> <b:loop values='data:post.comments' var='comment'> <div class='data:comment.adminClass' expr:id='data:comment.anchorName'> <b:if cond='data:post.adminClass == data:comment.adminClass'> <div class='comment_inner comment_admin'> <b:else/> <div class='comment_inner'> </ B: if> <div class='comment_header'> <div class='comment_avatar_wrap'> <div class='comment_avatar'> <img alt='avatar' expr:src='data:comment.authorAvatarSrc' expr:title='data:comment.author'/> </ Div> <A class = 'comment_reply' expr: href = '"# r_" + data: comment.anchorName' expr: id = '"r" + data: comment.anchorName' onclick = 'javascript: Display_Reply_Form (this)' title = 'Reply'> Reply </ a> </ Div> <div class='clear'/> </ Div> <div class='comment_body'> <span class='comment_arrow'/> <div class='comment_name'> <b:if cond='data:comment.authorUrl'> <a expr:href='data:comment.authorUrl' expr:title='data:comment.author' rel='nofollow' target='_blank'> <data:comment.author/> </ a> <b:else/> <data:comment.author/> </ B: if> <span class='comment_author_flag'/> <span class='comment_service'> <A class = 'comment-delete' expr: href = '"http://www.blogger.com/delete-comment.g?blogID =" + data: + blog.blogId "& postID =" + of data: the comment.id 'expr: title =' Data: the top.deleteCommentMsg '> <img alt='delete' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUgBzCfer76BGFrC91u_VT9fd6TkYWrlTYftZiiRnj-x7dZ47DsuGXFOCaMVjKbJOxqrNgjfmFFpoWO3QEe5sRH0wtptyRGrOoaYGDmtkKX9w2f7_35ILq-w8z9qf87VIQRXhFokpK_3A/s1600/delete4.png' title='Hapus Komentar'/> </ A> <span class='comment_date'> <a expr:href='data:comment.url' rel='nofollow' title='comment permalink'> <data:comment.timestamp/> </ A> </ span> </ Span> </ div> <b:if cond='data:comment.isDeleted'> <span class='deleted-comment'> <data:comment.body/> </ span> <b:else/> <p> <data:comment.body/> </ p> <div class='clear'/> </ B: if> </ Div> <div class='clear'/> </ Div> <div class='clear'/> <div class='comment_child'/> <div class='comment_reply_form' expr:id='"r_f_"+data:comment.anchorName'/> </ Div> </ B: loop> </ Div> <div class='clear'/> <b:if cond='data:post.commentPagingRequired'> <span class='paging-control-container'> <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'> <data:post.oldestLinkText/> </ a> <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'> <data:post.olderLinkText/> </ a> <data:post.commentRangeText/> <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'> <data:post.newerLinkText/> </ a> <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'> <data:post.newestLinkText/> </ a> </ Span> </ B: if> <div class='clear'/> <div class='comment_form'> <b:if cond='data:post.embedCommentForm'> <b:if cond='data:post.allowNewComments'> <div class='comment_emo_list'/> <b:include data='post' name='threaded-comment-form'/> <b:else/> <data:post.noNewCommentsText/> </ B: if> <b:else/> <b:if cond='data:post.allowComments'> <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' expr:title='data:postCommentMsg'> <data:postCommentMsg/> </ a> </ B: if> </ B: if> </ Div> </ B: if> </ Div> <script type='text/javascript'> / / <! [CDATA [ if (typeof (jQuery) == 'undefined') { / / Output the script (load it from google api) document.write ("<scr" + "IPT type = \" text / javascript \ "src = \" http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js \ "> </ scr '+' IPT> '); } / /]]> </ Script> <script async='async' expr:src='data:post.commentSrc' type='text/javascript'/> <script type='text/javascript'> <b:if cond='data:post.numComments != 0'> var Items = <data:post.commentJso/>; var msgs = <data:post.commentMsgs/>; var config = <data:post.commentConfig/>; <b:else/> var Items = {}; var msgs = {}; var config = {'maxThreadDepth': '0 '}; </ B: if> / / <! [CDATA [ / / Global settings Config.maxThreadDepth = 6 ;/ / Depth-level threaded comment Display_Emo = true ;/ / Show emoticons? types of "false" to hide Replace_Youtube_Link = false ;/ / Embed YouTube video, type "false" to disable Replace_Image_Link = false ;/ / Auto replace the image link, type "false" to disable. Replace_Force_Tag = false ;/ / replace Auto virtual tag example: [pre] to <pre>, and [/ pre] to </ pre>, if one writes, will not work Replace_Image_Ext = ['JPG', 'GIF', 'PNG', 'BMP'] ;/ / (support: jpg, gif, png, bmp), only works when Replace_Image_Link = true / / Setting Emoticon Emo_List = [ ':)', 'Http :/ / 1.bp.blogspot.com/-2Z7Cwe04x-Q/UH9THzWWJII/AAAAAAAACtA/ChwawyzYsDI/s1600/smile1.gif', ': (', 'Http :/ / 4.bp.blogspot.com/-yXc7xHs5mXc/UKhVJLBfdaI/AAAAAAAADPY/LJKRsefyeao/s1600/sad.gif', '= (', 'Http :/ / 1.bp.blogspot.com/-7I8DdEs58z0/UKhVKHT1yUI/AAAAAAAADPg/Lyzv-E74EdM/s1600/sadanimated.gif', '^ _ ^', 'Http :/ / 1.bp.blogspot.com/-IoZJlpB0-dE/UKhVKnR0BDI/AAAAAAAADPo/Kz87N1Aj4X8/s1600/smile.gif', ': D', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7CTg5iFXw5AQ2ao9NfqbZfmiy2ROdAZKqF09nuJ_XKypQ0V1VntMtLyaqK8x-q7-rVwNvEEvyI9GH_WymHRQWWv-sr1xoqSJ6Joowexa3NFsPKs1PdZcMjTXuKIxcfnysxIe2OWYn5J8/s1600/icon_smile.gif', '= D', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicdCpF50Ou-qINh-7notqOTWeCZFdXpkNRMlqbTlZ8GRvCR6kC7jv9Ec9gPsyIP4rXcTAw80umavPLp_X4tTtHVwFzprYEC65EHC8nOAcKEocj1oAHf1uNCzh_UhAK5LH9Sv14d-N2Tkc/s1600/hihi.gif', '| O |', 'http://reader-download.googlecode.com/svn/trunk/images/emo/applause.gif', '@ @,', 'Http :/ / 4.bp.blogspot.com/-w1VfvgO2-e8/UKhVIT7XLhI/AAAAAAAADPQ/cJ0KDjEsoj4/s1600/rolleyes.gif', ';)', 'Http :/ / 3.bp.blogspot.com/-5zPfqshivtY/UKhVONWZnkI/AAAAAAAADQI/iCDxagcaj5s/s1600/wink.gif', ':-Bd', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw9lRdYUilSCGcrjaEKdB6dnko8bvUmPuIA8Vbi2_7FPeWWO4_n4ZVjCpTPgnSsJBcrFK2NUL63O0Et1-pH_S7Y6NR5FitQRSQPpTRv3JKTdBQF3Gze11jmUSj5fmSZKHvgfrHNtZ3ADY/s1600/thumb.gif', ':-D', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjByxltgPPwH2gzWDWfzoLbStk_x8TqA7l56tpt3oO00yLm-r8UN2zDz9nmNHanpZBv5AfKfpYKBBd7r3XtXBKcS6YmZ-JmoZn6FGsWVguTgdnCuMNKN2-RPK6nukjSCvdX0v1RA178Jwg/s1600/thumbsup.gif', ': P', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOBs2cK_q6W0J9kyJZs9d65EYuTEh7kCyLH_FiArcFK-5sJ8xJOAQ1ZZd1wKb0FkULS129bwGeB2aI8Jsqy0jhC1pxswjq3O4M6Ne8K7N11rJCZxgyiWsh3HjI6vxhF3I0J1uAd9Aj1OU/s1600/wee.gif', ]; / / Config Force tag list, define all in lower case Force_Tag = [ '[Pre]', '<pre>', '[/ Pre]', '</ pre>', '<pre Class="brush: plain; title:; notranslate" title="">', '<code>', '</ Pre>', '</ code>' ]; 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} ('3 o = \' .1 c \ '; 3 1b = $ (\' # O -19 \ '). G (\' A \ '); u 1l (F) {3 1j = \' i = 0; i <F.5; i + +) {9 (1j.d (F.1Q (i))! = -1) {F = Fb (0, i);}} z 11 F} $ (\ '# 1P .1 ip \'). j (u (y, 7) {9 (1J) {3 l = \ '1 v :/ / 13.VW/1y? v = \ '; 3 8 = 7.D (l), D (8! = -1) {1d = 7.b (8), J = 1l (1d), 3 X = Jd (\ '& \'); 3 N = \ '\'; 9 (X == -1) {N = Jb (L.5)} Y {N = Jb (L.5, X)} 3 1r = \ '<1u B = "1T" A = "1v :/ / 13 .VW/1U / \' + N + \ '? 1V = 1 "1W =" 0 "2w> </ 1u> \'; 7 = 7.b (0.8) r +1 +7. b (8 J + .5); 8 = 7.D (l), 9 (8 == -1) {l = \ '1 Z :/ / 13.VW/1y? v = \ '; 8 = 7.D (l)} 9}} (21) {3 Z = \ '\'; 3 s = 7; E (3 i = 0; i <1w.5; i + +) {3 l = \ '. \' +1 w [i]; 3 m = sC ( ); 3 8 = md (l), D (8! = -1) {k = sb (0.8 + L.5), m = kC (); 3 q = \ '2 h: / / \ '; 3 w = md (q); 3 A = '\' + k + \ '"B =" 2r "/> \'; s = sb (8 + L.5), m = sC (); 8 = md ( l)}} 7 = Z + s} 9 (1A) {3 5 = x.5; 9 (5% 2 == 1) {5 -} E (3 i = 0; i <5; i + = 2 ) {3 S = \ '<10 A =' \ '+ x [i +1] + \' "B =" 1B "/> \ '; 8 = 7.D (x [i]), D (8 ! = -1) {7 = 7. b (0.8) + S +7. b (8 + x [i] .5); 8 = 7.D (x [i])}}} 9 (1I) { 3 5 = R.5; 9 (5% 2 == 1) {5 -} E (3 i = 0; i <5; i + = 2) {D (1) {3 s = 7.M () ; 8 = sd (R [i]); 9 (8! = -1) {7 = 7.b (0.8) + R [i +1] +7. b (8 + R [i] .5)} Y {11}} z 7}}}); $ (\ '.1 K \'). j (u (y, 7) {9 (1A) {3 5 = x.5; 9 (5% 2 == 1) {5 - 12} 3 = \ '\'; E (3 i = 0; i <5; i + = 2) {3 1e = \ '<1f> \' + x [i] + \ '</ 1f> \', 3 S = \ '<10 A =' \ '+ x [ i +1] + \ '"B =" 1B "/> \'; 12 + = \ '<QB="1O"> \' S +1 + e + \ '</ Q> \' z} 12} }); $ (\ '.1 .1 g ip \'). j (u (i, h) {t = hm (); y = Td (\ '@ <a U = "# c \'); 9 (y! = -1) {14 = Td (\ '</ a> \', y); 9 (14! = -1) {h = hb (0, y) + hb (14 +4) zh }}}); u 1k (g) {r = gd (\ 'c \'); 9 (r! = -1) g = gb (r +1);} zg u 1m (g) {g = \ '& 1X = \' g+ + \ '#% 1n \'; 1o = 1b.20 (/ #% 1n /, g);} uz 1o 1p () {j = $ (o). j (); $ (o). j (\ '\'); o = \ '.1 c \'; $ (o). j (j); $ (\ '# O -19 \'). G (\ 'A \', 1b)} u 1q (e) {g = $ (e). G (\ '15 \ '); g = 1k (g); j = $ (o). j (); 9 (o == \ '.1 c \') {1s = \ '<a U="#1t" 27="1p()"> \' +28.29 + \ '</ a> < a i = 0; i <P.5; i + +) {9 (\ '1 z \ '2 m P [i]) {3 g = P [i] .1 z; 3 1a = 2o ($ ( \ '# c \' g+ + \ ': L \'). G (\ '1 C \ ')); $ (\' # c \ '+ g+ \' .2 q: L \ '). j (u (y, 7) {3 H = P [i] .15; 9 (1a> = 2s.2t) {$ (\ '# c \' + H + \ ': L .2 u \') .1 h ()} 3 K = $ (\ '# c \' + H + \ ': L \'). j (); K = \ '<QB = "1g" 15 = "c \' + H + \ '" var avatar = $ ("# comments"); avatar.find ('. comment_avatar img'). each (function () { ava var = $ (this). attr ('src'); $ (This). Show (). Attr ('src', ava.replace (/ \ / s [0-9] + (\-c)? \ / /, "/ S45-c /")); }); / /]]> </ Script> </ B: includable>
STYLE 2
Save this code above
]]> </ b: skin>
# Comments {} # Comments h3 {margin-bottom: 25px; font-size: 18px;} . Comment-body-author {background: # FFFFFF; color: # 008000; border: 1px dotted # 008000; margin: 0; padding: 0 0 0 10px;} . Comment_share {color: # 999999; cursor: pointer; font-family: Verdana; font-size: 10px; line-height: 1.5em; max-width: 100%; font-weight: normal; padding-left: 5px; # comment_rep} a: hover {text-decoration: none; color: # 464 646! important;} . Comment_avatar {height: 48px; width: 48px; background: # F0F0F0 url (https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPrJ3tCg8xG-Mn1exeQyit_MX-jXPqtlA5ox6mqHW5MrZp0WS7UYrF4aZjOIKC4cY_CV8opvfBReryjLMzyJeFqnlrDbUUAhILCQXTxCrIbbt7-QdqU9E5vR_YzIQQGlEHn7xsdwONzZ8/s48/anon48.gif) no-repeat center center; float : left; margin-right: 10px;-webkit-border-radius: 6px;-moz-border-radius: 6px; border-radius: 6px; overflow: hidden;} . Comment_name {color: # 444; font-size: 18px; font-weight: normal; line-height: 19.5px; max-width: 100%; text-decoration: none; margin-top: 5px; text-transform: uppercase }. comment-menu {float: right; list-style: none; width: 0px; height: 0;}. comment_name a {text-transform: uppercase; font-size: 18px; color: # 444; text-decoration: none;} . Comment_name a: hover {color: # 0088b2; text-decoration: none;} . Comment_body p {font-size: 14px; line-height: 22px;} . Comment_body {margin-top: 20px; margin-bottom: 20px; border: 1px solid # d2d2d2; padding: 20px 20px; position: relative;} . COMMENT_DATE {color: # 999; font-style: italic; font-size: 13px; line-height: 25px; cursor: pointer; font-weight: normal;} # comments. Separate {color: # cccccc; font-family: 'Oswald', Arial, Helvetica, sans-serif; font-size: 15px; line-height: 40px; padding-left: 5px; padding-right: 5px; line-height : 10px; t: 15px;} # comments. author-mark {background: # d2d2d2; color: white;-webkit-border-radius: 4px;-moz-border-radius: 4px; border-radius: 4px; padding: 2px 2px 6px 6px; font-size: 15px; line-height: 15px;}. comment-share {display: inline;}. comment-share li {display: inline;}. li.button a comment-share {background: # 555; color: white; padding: 0 5px 5px 2px;-webkit-border-radius: 4px;-moz-border-radius: 4px; border-radius: 4px; displays: none;}. li.button comment-share: hover a {background: # 000;} # comment_rep {margin-top:-27px; float: right;}. comment_child. comment_body {margin-top: 20px; margin-bottom: 30px;}. comment_child. comment_wrap {padding-left: 40px} . Comment_reply {cursor: pointer; font-size: 11px; line-height: 1.5em; font-style: italic; max-width: 100%; background: # e1e1e2; font-weight: 400; padding: 2px 12px; color: # 999; float: right; position: absolute; right: 1px; bottom: 1px;} . Comment_reply a {text-decoration: none; color: # 999! Important; float: right; position: absolute} . Comment_admin. Avatar-image-container {}. Unneeded-paging-control {display: none;}. Comment-form {max-width: 100%;! Important; margin-top:-15px! Important} # comment-editor {width: 101%! important}. comment_reply_form. comment-form {width: 100%;}. comment_youtube {max-width: 100%! important; width: 400px; height: 225px; display: block; padding-top: 10px; padding-bottom: 10px;} # respond {overflow: hidden; padding-left: 10px; clear: both;}. comment_avatar * {max-width: 1000%! important; display: block; max-height: 1000%! important; width: 48px! important; height: 48px! important;-webkit-border-radius: 6px;-moz-border-radius: 6px; border-radius: 6px; margin-right: 10px;}. comment_child. comment_avatar,. comment_child. comment_avatar * {width: 40px! important; height: 40px! important; float: left; margin-right: 10px;}. comment_form a {color: # 2f6986; text-decoration: none;}. comment_form a: hover {color: # 2f6986; text-decoration: underline;} . Comment_author_flag {display: none} . Comment_admin. Comment_author_flag {display: inline; background: # c9c9c9; font-size: 13px; font-weight: normal; padding: 2px 6px; margin-left: 8px; color: # fff; border-radius: 4px; text-transform: uppercase ; letter-spacing: .1 em} . Comment-delete img {float: right; margin-left: 10px; position: absolute; margin-top: 7px;} # Comment-editor {width: 103%! Important; background: transparent no-repeat 50% 30%} . Comment-form {max-width: 100%;! Important; margin-top: 25px! Important} . Comment_arrow {display: block; width: 18px; height: 9px; background: no-repeat; position: absolute; margin-top:-29px; margin-left:-5px;} . Comment_emo_list. Items { float: left; width: 40px; text-align: center; height: 40px; margin: 10px 10px 0 0;} . Comment_emo_list span {display: block; font-weight: bold; font-size: 11px; letter-spacing: 1px;} . Comment_youtube {max-width: 100%! Important; width: 400px; height: 225px; display: block; margin: auto} . Comment_img {max-width: 100%! Important} . Comment-form p {background: # 666; padding: 10px; margin: 5px 0 5px 0; color: # eee; font-size: 13px; line-height: 20px; width: 97%; border-radius: 3px; position : relative;} . Comment-form p: after {content: ""; width: 0; height: 0; position: absolute; bottom:-16px; left: 15px; border: 8px solid transparent; border-color: # 666 transparent transparent;} iframe {border: none; overflow: hidden}
Then replace the code:
<b:includable id='comments' var='post'> ... </ B: includable>
with this:<b:includable id='comments' var='post'>
<div class='comments' id='comments'>
<b:if cond='data:post.allowComments'>
<b:if cond='data:post.numComments != 0'>
<h3>
<b:if cond='data:post.numComments == 1'>
1 <data:commentLabel/>:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>
</ B: if>
</ H3>
</ B: if>
<b:if cond='data:post.commentPagingRequired'>
<span class='paging-control-container'>
<a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'> <data:post.oldestLinkText/> </ a>
<a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'> <data:post.olderLinkText/> </ a>
<data:post.commentRangeText/>
<a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'> <data:post.newerLinkText/> </ a>
<a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'> <data:post.newestLinkText/> </ a>
</ Span>
</ B: if>
<div class='clear'/>
<div id='comment_block'>
<b:loop values='data:post.comments' var='comment'>
<div class='data:comment.adminClass' expr:id='data:comment.anchorName'>
<b:if cond='data:post.adminClass == data:comment.adminClass'>
<div class='comment_inner comment_admin'>
<b:else/>
<div class='comment_inner'>
</ B: if>
<div class='comment_header'>
<div class='comment_avatar'>
<img alt='avatar' expr:src='data:comment.authorAvatarSrc' expr:title='data:comment.author'/>
</ Div>
<div class='comment_name'>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'> <data:comment.author/> </ a>
<b:else/>
<data:comment.author/>
</ B: if> <span class='comment_author_flag'> Admin </ span>
</ Div>
<div class='comment_service'>
<a expr:href='data:comment.url' rel='nofollow' title='permalink'> <span class='comment_date'> <data:comment.timestamp/> </ span> </ a>
<A class = 'comment-delete' expr: href = '"http://www.blogger.com/delete-comment.g?blogID =" + data: + blog.blogId "& postID =" + of data: the comment.id 'expr: title =' Data: the top.deleteCommentMsg '>
<img alt='delete' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUgBzCfer76BGFrC91u_VT9fd6TkYWrlTYftZiiRnj-x7dZ47DsuGXFOCaMVjKbJOxqrNgjfmFFpoWO3QEe5sRH0wtptyRGrOoaYGDmtkKX9w2f7_35ILq-w8z9qf87VIQRXhFokpK_3A/s1600/delete4.png' title='Hapus Komentar'/>
</ A>
</ Div>
<div class='clear'/>
</ Div>
<div class='comment_body'>
<span class='comment_arrow'/>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'> <data:comment.body/> </ span>
<b:else/>
<p> <data:comment.body/> </ p>
<A Class ='comment_reply' expr: href ='"# r_" Data: comment.anchorName' expr: + id + ='"r" Data: comment.anchorName' onclick ='javascript: Display_Reply_Form (this)'> Reply </ a> <div class='clear'/>
</ B: if>
</ Div>
<div class='clear'/>
</ Div>
<div class='clear'/>
<div class='comment_child'/>
<div class='comment_reply_form' expr:id='"r_f_"+data:comment.anchorName'/>
</ Div>
</ B: loop>
</ Div>
<div class='clear'/>
<b:if cond='data:post.commentPagingRequired'>
<span class='paging-control-container'>
<a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'> <data:post.oldestLinkText/> </ a>
<a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'> <data:post.olderLinkText/> </ a>
<data:post.commentRangeText/>
<a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'> <data:post.newerLinkText/> </ a>
<a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'> <data:post.newestLinkText/> </ a>
</ Span>
</ B: if>
<div class='clear'/>
<div class='comment_form'>
<b:if cond='data:post.embedCommentForm'>
<b:if cond='data:post.allowNewComments'>
<b:include data='post' name='threaded-comment-form'/>
<b:else/>
<data:post.noNewCommentsText/>
</ B: if>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'> <data:postCommentMsg/> </ a>
</ B: if>
</ B: if>
</ Div>
</ B: if>
</ Div>
<script type='text/javascript'>
/ / <! [CDATA [
if (typeof (jQuery) == 'undefined') {
/ / Output the script (load it from google api)
document.write ("<scr" + "IPT type = \" text / javascript \ "src = \" http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js \ "> </ scr '+' IPT> ');
}
/ /]]>
</ Script>
<script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>
<script type='text/javascript'>
<b:if cond='data:post.numComments != 0'>
var Items = <data:post.commentJso/>;
var msgs = <data:post.commentMsgs/>;
var config = <data:post.commentConfig/>;
<b:else/>
var Items = {};
var msgs = {};
var config = {'maxThreadDepth': '0 '};
</ B: if>
/ / <! [CDATA [
/ / Global settings
Config.maxThreadDepth = 6 ;/ / How threaded level that you want
Display_Emo = true ;/ / Display emoticons or not? set to "false" to no display
Replace_Youtube_Link = true ;/ / Auto replace iframe embedded youtube link to, choose "false" to disable
Replace_Image_Link = true ;/ / Auto replace an image link choose "false" to disable.
Replace_Force_Tag = true ;/ / replace Auto virtual tag an example: [pre] to <pre>, and [/ pre] </ pre>, If user input wrong, your layout will be gone. becare ful Then when enable this trap
Replace_Image_Ext = ['JPG', 'GIF', 'PNG', 'BMP'] ;/ / (support: jpg, gif, png, bmp), effect only when Replace_Image_Link = true
/ / Config emoticons declare
Emo_List = [
':)', 'Http :/ / 1.bp.blogspot.com/-2Z7Cwe04x-Q/UH9THzWWJII/AAAAAAAACtA/ChwawyzYsDI/s1600/smile1.gif',
': (', 'Http :/ / 4.bp.blogspot.com/-yXc7xHs5mXc/UKhVJLBfdaI/AAAAAAAADPY/LJKRsefyeao/s1600/sad.gif',
'= (', 'Http :/ / 1.bp.blogspot.com/-7I8DdEs58z0/UKhVKHT1yUI/AAAAAAAADPg/Lyzv-E74EdM/s1600/sadanimated.gif',
'^ _ ^', 'Http :/ / 1.bp.blogspot.com/-IoZJlpB0-dE/UKhVKnR0BDI/AAAAAAAADPo/Kz87N1Aj4X8/s1600/smile.gif',
': D', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7CTg5iFXw5AQ2ao9NfqbZfmiy2ROdAZKqF09nuJ_XKypQ0V1VntMtLyaqK8x-q7-rVwNvEEvyI9GH_WymHRQWWv-sr1xoqSJ6Joowexa3NFsPKs1PdZcMjTXuKIxcfnysxIe2OWYn5J8/s1600/icon_smile.gif',
'= D', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicdCpF50Ou-qINh-7notqOTWeCZFdXpkNRMlqbTlZ8GRvCR6kC7jv9Ec9gPsyIP4rXcTAw80umavPLp_X4tTtHVwFzprYEC65EHC8nOAcKEocj1oAHf1uNCzh_UhAK5LH9Sv14d-N2Tkc/s1600/hihi.gif',
'| O |', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnjjR75zEpaEq2QPeMVPb3rBvfG0MtoXIlACOMghUmk2eQT7xRFwdIygKWaLDNsBisfyGlRyC9oL0zFLXn9wBM1g_BoZCRSbczj750eXN2Le_RuNf0nc2DnCUxKxDR5ej3pd_KKGpd_zo/s1600/applause.gif',
'@ @,', 'Http :/ / 4.bp.blogspot.com/-w1VfvgO2-e8/UKhVIT7XLhI/AAAAAAAADPQ/cJ0KDjEsoj4/s1600/rolleyes.gif',
';)', 'Http :/ / 3.bp.blogspot.com/-5zPfqshivtY/UKhVONWZnkI/AAAAAAAADQI/iCDxagcaj5s/s1600/wink.gif',
':-Bd', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw9lRdYUilSCGcrjaEKdB6dnko8bvUmPuIA8Vbi2_7FPeWWO4_n4ZVjCpTPgnSsJBcrFK2NUL63O0Et1-pH_S7Y6NR5FitQRSQPpTRv3JKTdBQF3Gze11jmUSj5fmSZKHvgfrHNtZ3ADY/s1600/thumb.gif',
':-D', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjByxltgPPwH2gzWDWfzoLbStk_x8TqA7l56tpt3oO00yLm-r8UN2zDz9nmNHanpZBv5AfKfpYKBBd7r3XtXBKcS6YmZ-JmoZn6FGsWVguTgdnCuMNKN2-RPK6nukjSCvdX0v1RA178Jwg/s1600/thumbsup.gif',
': P', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOBs2cK_q6W0J9kyJZs9d65EYuTEh7kCyLH_FiArcFK-5sJ8xJOAQ1ZZd1wKb0FkULS129bwGeB2aI8Jsqy0jhC1pxswjq3O4M6Ne8K7N11rJCZxgyiWsh3HjI6vxhF3I0J1uAd9Aj1OU/s1600/wee.gif',
];
/ / Config Force tag list, define all in lower case
Force_Tag = [
'[Pre]', '<pre>',
'[/ Pre]', '</ pre>',
'<pre Class="brush: plain; title:; notranslate" title="">', '<code>',
'</ Pre>', '</ code>'
];
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} ('3 o = \' .1 c \ '; 3 1b = $ (\' # O -19 \ '). G (\' A \ '); u 1l (F) {3 1j = \' i = 0; i <F.5; i + +) {9 (1j.d (F.1Q (i))! = -1) {F = Fb (0, i);}} z 11 F} $ (\ '# 1P .1 ip \'). j (u (y, 7) {9 (1J) {3 l = \ '1 v :/ / 13.VW/1y? v = \ '; 3 8 = 7.D (l), D (8! = -1) {1d = 7.b (8), J = 1l (1d), 3 X = Jd (\ '& \'); 3 N = \ '\'; 9 (X == -1) {N = Jb (L.5)} Y {N = Jb (L.5, X)} 3 1r = \ '<1u B = "1T" A = "1v :/ / 13 .VW/1U / \' + N + \ '? 1V = 1 "1W =" 0 "2w> </ 1u> \'; 7 = 7.b (0.8) r +1 +7. b (8 J + .5); 8 = 7.D (l), 9 (8 == -1) {l = \ '1 Z :/ / 13.VW/1y? v = \ '; 8 = 7.D (l)} 9}} (21) {3 Z = \ '\'; 3 s = 7; E (3 i = 0; i <1w.5; i + +) {3 l = \ '. \' +1 w [i]; 3 m = sC ( ); 3 8 = md (l), D (8! = -1) {k = sb (0.8 + L.5), m = kC (); 3 q = \ '2 h: / / \ '; 3 w = md (q); 3 A = '\' + k + \ '"B =" 2r "/> \'; s = sb (8 + L.5), m = sC (); 8 = md ( l)}} 7 = Z + s} 9 (1A) {3 5 = x.5; 9 (5% 2 == 1) {5 -} E (3 i = 0; i <5; i + = 2 ) {3 S = \ '<10 A =' \ '+ x [i +1] + \' "B =" 1B "/> \ '; 8 = 7.D (x [i]), D (8 ! = -1) {7 = 7. b (0.8) + S +7. b (8 + x [i] .5); 8 = 7.D (x [i])}}} 9 (1I) { 3 5 = R.5; 9 (5% 2 == 1) {5 -} E (3 i = 0; i <5; i + = 2) {D (1) {3 s = 7.M () ; 8 = sd (R [i]); 9 (8! = -1) {7 = 7.b (0.8) + R [i +1] +7. b (8 + R [i] .5)} Y {11}} z 7}}}); $ (\ '.1 K \'). j (u (y, 7) {9 (1A) {3 5 = x.5; 9 (5% 2 == 1) {5 - 12} 3 = \ '\'; E (3 i = 0; i <5; i + = 2) {3 1e = \ '<1f> \' + x [i] + \ '</ 1f> \', 3 S = \ '<10 A =' \ '+ x [ i +1] + \ '"B =" 1B "/> \'; 12 + = \ '<QB="1O"> \' S +1 + e + \ '</ Q> \' z} 12} }); $ (\ '.1 .1 g ip \'). j (u (i, h) {t = hm (); y = Td (\ '@ <a U = "# c \'); 9 (y! = -1) {14 = Td (\ '</ a> \', y); 9 (14! = -1) {h = hb (0, y) + hb (14 +4) zh }}}); u 1k (g) {r = gd (\ 'c \'); 9 (r! = -1) g = gb (r +1);} zg u 1m (g) {g = \ '& 1X = \' g+ + \ '#% 1n \'; 1o = 1b.20 (/ #% 1n /, g);} uz 1o 1p () {j = $ (o). j (); $ (o). j (\ '\'); o = \ '.1 c \'; $ (o). j (j); $ (\ '# O -19 \'). G (\ 'A \', 1b)} u 1q (e) {g = $ (e). G (\ '15 \ '); g = 1k (g); j = $ (o). j (); 9 (o == \ '.1 c \') {1s = \ '<a U="#1t" 27="1p()"> \' +28.29 + \ '</ a> < a i = 0; i <P.5; i + +) {9 (\ '1 z \ '2 m P [i]) {3 g = P [i] .1 z; 3 1a = 2o ($ ( \ '# c \' g+ + \ ': L \'). G (\ '1 C \ ')); $ (\' # c \ '+ g+ \' .2 q: L \ '). j (u (y, 7) {3 H = P [i] .15; 9 (1a> = 2s.2t) {$ (\ '# c \' + H + \ ': L .2 u \') .1 h ()} 3 K = $ (\ '# c \' + H + \ ': L \'). j (); K = \ '<QB = "1g" 15 = "c \' + H + \ '"
var avatar = $ ("# comments");
avatar.find ('. comment_avatar img'). each (function () {
ava var = $ (this). attr ('src');
$ (This). Show (). Attr ('src', ava.replace (/ \ / s [0-9] + (\-c)? \ / /, "/ S45-c /"));
});
/ /]]>
</ Script>
</ B: includable>
NOW THIS WAS TRICK HOW TO ADD THREADED COMMENTS ON BLOGGER
PLEASE SHARE THIS POST WITH UR FRIENDS AND SHOW YOUR LOVE
No comments:
Post a Comment