Membuat kotak komentar blogger 2 kolom

embuat kotak komentar blogger menjadi 2 kolom ini saya post karena tertarik setelah melihat di catalog tutorial kotak komentar nya menjadi lebih elegan menurut saya,, atau bisa juga dilihat di blog saya ini.. klo pingin seperti itu langsung aja ikuti tutorial dibawah ini.

- buka blogger
- login dan klik ke tata letak n edit Html jangan lupa centang bagian expand widget
- setelah itu backup dulu blogg anda dengan cara download temlate bila nanti ada kesalahn kan aman. aman aja gitu
- Cari kode berikut :

- setelah itu ganti kode ini semua

- replace kode diatas dengan kode dibawah ini :

• 
  
  
  

  
  

  
  

  
  
  
  
  
  
  
  
  
  Said
  

  
  

  
  

  
  

  
  
  
  
  

  
  
  

  
  

  
  

  
  

  
  
  
  

  
  
  

  
  

  
  
  
  
  

  
  

  
  
  
  
  

  
  

  
  

- selanjutnya cari kode ini :

body {

dan kopi paste kode dibawah ini tepat diatas kode

body {

* {
margin: 0px;
padding: 0px;
}

- selanjutnya cari kode ini

]]>

dan kopi paste kode dibawah ini tepat diatas kode ini

]]>

#comments{background:#EBF3FB; border:solid #ccc 1px; margin-bottom:10px}
#comments h4{ margin:1em 0; padding:10px; font-weight:bold; line-height:1.4em; text-transform:uppercase; letter-spacing:.2em; color:$sidebarcolor}
#comment-list {margin-top: 10px;padding:10px;
background: transparent;border:
1px dotted #ddd;font-size: 1.75em;color: #666;}
.commentlistdiv {
margin-top: 10px;padding:10px;
background: #FFF;border:
1px dotted #ddd;font-size: 1.75em;color: #666;}
.commentlistdiv h1 {font-size: 1.3em;
color: #366799;border-bottom: 1px solid #eee;
line-height: 1.5em;}
.commentlist li {background: transparent;
border-bottom: 1px dotted #ddd;padding: 20px 10px 5px 10px;}
.commentlist li.alt {background: #fff;}
.pane_l {float: left;background:#fff;display: inline;
width: 110px;min-width: 110px;max-width: 110px;
border: 1px dotted #ddd;padding-right: 0px;margin-right: 0px;text-align:center;padding:15px 0}
* html .pane_l{margin-top:15px; }
.pane_r {display: block;line-height: 1.5em;margin-left: 125px;
padding:8px 15px 15px 15px;;background:#fff;
border-left:1px dotted #CCCCCC;
border-right:1px dotted #CCCCCC;
border-top:3px double #CCCCCC;border-bottom:3px double #CCCCCC;}
.c_author {font-size: 13px;font-weight: normal;height:30px;
overflow:hidden;margin: 0px 0px 7px 0px;}
.c_avatar {display: block;margin: 0px 0px 7px 0px;}
.c_date {color: #aaa;font-size: 0.9em;margin: 0px 0px 0px 0px;
padding-top:20px;}
.c_approved {color: #aaa;font-size: 0.9em;}
.comment-form { background:#EFEFEF; border:5px solid #cccccc;
margin:0 10px 20px 10px; padding:10px 0 0 15px;width:92%;}
* html .comment-form { width:87%; }
.owner-Body {display: block;line-height: 1.5em;margin-left: 125px;
background:#EFEBE0;padding:8px 15px 15px 15px;
border-left:1px dotted #fff;border-right:1px dotted #fff;
border-top:3px double #fff;border-bottom:3px double #fff;}
.owner-Body p {
font-size:100%;margin:0 0 0 0;color:#FF0000;
text-decoration:bold;
}
.deleted-comment {
font-style:italic; color:gray;
}

Posted in: