Highlight Author And Threaded Commenting Levels

Bagi Anda pengguna Thesis For Blogspot, sangat mudah sekali melakukan modifikasi dan memperindah threaded comment pada comment bar blogger.

Cukup dengan meletakkan CSS ini dalam  /*-- :[ START THEREADED COMMENT STYLE BY FORBLOGGER.NET]: --*/ pada template Thesis For Blogspot.

Dalam tutor ini, terdapat dua bagian penting pada threaded commenting blogspot, yaitu Highlight Author Threaded Comment dan Threaded Comment Levels.

Dengan meletakkan css3 code ini pada template Anda, maka threaded comment default Thesis For Blogspot Anda akan menjadi seperti screenshot berikut:

Highlight Author And Threaded Comment Levels For Thesis For Blogspot

Highlight Author Dan Thread Comment Bertingkat Dengan CSS



.comment-block{position:relative;padding:8px;background:rgba(255,255,255,.7);border:1px solid #ddd;border-radius:4px;box-shadow:4px 4px 4px #444;text-shadow:0 1px 0 #dbdbdb;}
.comment-block .icon.blog-author{position:absolute;right:0;bottom:0;background:rgba(0,0,0,.3) url(http://2.bp.blogspot.com/-sTLnLHWJok8/UBUsV2ZjfxI/AAAAAAAABa4/V5JOMhS744Y/s1600/author.png) bottom right no-repeat !important;width:100% !important;height:100% !important;margin:0 !important;border-radius:4px;}
.comment-block:hover{box-shadow:0 10px 10px -10px #444;}
.comment-block:hover .icon.blog-author{width:60px !important;height:22px !important;background:url(http://3.bp.blogspot.com/-RU1Q-HwrfsU/T2CyurPWOtI/AAAAAAAABmY/S0uNp_lWCNw/s1600/admin2.png) bottom right no-repeat !important;background-size:60px 22px !important;}

.comments .thread-toggle {margin-bottom:10px;}
.comments .comment-thread.inline-thread .comment .comment-block {margin-left:52px;}
.comments .comment-thread.inline-thread .comment {margin:0px 0px 5px 30%;padding:10px 15px;color:#222;}
.comment .comment-thread.inline-thread .comment:nth-child(6) {margin:0px 0px 5px 25%;}
.comment .comment-thread.inline-thread .comment:nth-child(5) {margin:0px 0px 5px 20%;}
.comment .comment-thread.inline-thread .comment:nth-child(4) {margin:0px 0px 5px 15%;}
.comment .comment-thread.inline-thread .comment:nth-child(3) {margin:0px 0px 5px 10%;}
.comment .comment-thread.inline-thread .comment:nth-child(2) {margin:0px 0px 5px 5%; }
.comment .comment-thread.inline-thread .comment:nth-child(1) {margin:0px 0px 5px 0%; }

Terimakasih yang tak terhingga kepada:
Blogonol: http://blogonol.blogspot.com/2012/06/highlight-author-threaded-comments.html
Rahmadika Kuniawan: http://blog.uad.ac.id/rahmadika/2012/06/27/cascading-style-sheet-4/

{ 31 comments.. read them below or add one }

Fara Fara 2 August 2012 at 07:48
copy paste mcm tu saje ke?
Fara Fara 2 August 2012 at 07:55
BTW,tak jumpa lak dlm template utk code /*-- :[ START THEREADED COMMENT STYLE BY FORBLOGGER.NET]: --*/ ni
MUS LIM MUS LIM 2 August 2012 at 18:50
Betul sekali, Kak Fara. Cukup copy dan paste saja.

Kalau tak ada tulisan macam tu, silahkan letakkan dibawah kode:

< b:includable id='threaded_comment_css' >
< style>
Letakkan kode Highlight Author Dan Thread Comment Bertingkat Disini.
< /style>
Anonymous Anonymous 3 August 2012 at 00:11
terima kasih templatnya, elok sekali.
< b:includable id='threaded_comment_css' > ---> letakna dimana?
Anonymous Anonymous 3 August 2012 at 00:12
terima kasih templatnya, elok sekali.
< b:includable id='threaded_comment_css' > ---> letakna dimana?
Fara Fara 3 August 2012 at 08:08
tekan CTRL + F kat bahagian template tu..
Fara Fara 3 August 2012 at 08:18
soalan lagi..dah jumpa
< b:includable id='threaded_comment_css' >
< style>
Letakkan kode Highlight Author Dan Thread Comment Bertingkat Disini.
< /style>

tp di antara < style> < /style> tu mmg dh ade coding yg asal utk threaded comment..nk kene delete yg tu dan gantikan dengan coding baru ni ke??then sy dh try tp bila preview,takde ape2 perubahan
MUS LIM MUS LIM 3 August 2012 at 09:38
jangan didelete code yang sudah ada tu, Kak. tetapi tambahkan dengan css code yang ada diatas tu.
Fara Fara 3 August 2012 at 12:33
tambah di bawah code atau di atas code sedia ada?? tp stil dlm < style> < /style> la kan
MUS LIM MUS LIM 3 August 2012 at 19:58
Ya. Betul sekali, Kak Fara.

Boleh diletakkan dimana saja dan masih dalam < style> content < /style>
Iza Teratak Usang Iza Teratak Usang 5 August 2012 at 15:18
Assalam..
Cantik design screen shoot tu..
MUS LIM MUS LIM 5 August 2012 at 22:05
Wa`alaikumussalam Kak Iza.

Ya betul sekali, Cantik screenshot tu, ada gambar Kak Iza didalamnya :D

Boleh lah dicoba :D
Dicas Cozinhar Dicas Cozinhar 8 August 2012 at 01:50
Thank you, by the time you devoted to this topic!
I wonder if it is equal to its subject (ForBlogger), with two extended post and the other in two columns?
How can I do this in Thesis.2?
MUS LIM MUS LIM 20 August 2012 at 15:19
if you want to make two columns in thesis template, you may insert the css style before the < /head>:

< b:if cond='data:blog.pageType == "index"'>
< style>
.blog-posts .post{display:inline-block;width:280px;min-height:10px;margin-left:10px;margin-right:10px}
.post-body h2{font-size:1.25em}
#outer-wrapper{font-family: 'Franklin Gothic Medium',Arial,sans-serif;font-size:0.75em;line-height:1.275em;}
.sidebar h2{font-size:2.5em}
< /style>
< /b:if>

and then, create two sticky posts above the post area.
MUS LIM MUS LIM 20 August 2012 at 15:19
pasti dong mas laku :)

silahkan coba template ini, templatenya bagus loh.
Tutorial Blog WordPress Tutorial Blog WordPress 22 August 2012 at 12:04
woww verry nice gan.salam dr blogger indonesia.
tengok blog ku jg,running with Thesis :D
MUS LIM MUS LIM 28 August 2012 at 21:21
heheheh terimakasih atas kunjungannya mas Tutorial Blog Wordpress :)
ata Quincy ata Quincy 14 September 2012 at 19:53
This comment has been removed by the author.
Dorothy R Brown Dorothy R Brown 2 October 2012 at 10:16
Hello admin,
I am very appreciate your work. Currently I am using in one of my blogs. But still did not get any changed when I applied threaded comment code. As you can see in my url: http://pembayarankomisiamazon.blogspot.com/2012/09/biaya-payooner.html. There is a comment from blog visitor, and I also replied it. But threaded comment style does not appear. Need your help to fix this. I love this theme. As your preference, I am adding the code after comment code but still in the style quote.
Screenshot of the code http://prntscr.com/gm4jg

THanks
Bayu Bayu 22 November 2012 at 08:13
masih gak jalan mas threaded commentnya
kira2 kenapa ya? padahal udah diantara < style> < /style>
Berita Terbaru Berita Terbaru 29 November 2012 at 04:01
Hello Dorothy,

Anda hendaklah aktifkan theaded comment blogspot dengan memasukkan kod pada template.

Find on google : Threaded comment for blogspot.
Sharidawati Shahrudin Sharidawati Shahrudin 10 January 2013 at 18:07
agak sukar utk fhm cara2 untuk letak code itu...
Mentari Minda Mentari Minda 13 January 2013 at 02:38
saya tak jumpa code < b:includable id='threaded_comment_css' >
Syaifuddin Alias Syaifuddin Alias 16 January 2013 at 18:54
kenapa ya saya dah letak diantara code yg dibagi .. lepas tu tak jadi pun .. huhu
syazrin syazrin 24 January 2013 at 16:39
Salam....

stylish la thread comment yg ney, elegant....

Tnx atas tuto ini, dah berjaya pasang dekat blog sy =)
Ema Johari Ema Johari 30 April 2013 at 13:29
salam, saya baru saja tukar kepada template yg baru ini..setiap kali cari kos tak jumpa...kenapa yer...
Ema Blog Ema Blog 30 April 2013 at 16:44
seharian saya cuba...last-last tab menu comment saya entah ke mana...siapa boleh tolong saya..tq.

Spamming will report.