Rabu, 01 Agustus 2012

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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuLAkBtjCsFuVASMdm_lPZga8_v8gaFI-_naemxieLvSQ0a-0DvlMDxUzHqwfjZGglF7sNXCwRG-KyhzNZUcokq4cqCuzA8WND6SULCrVKVzj6hbzLm-OJYU9O2llVYqgU3lYjT2nBFG7j/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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFqf6ggU1k-KzPoYiAMK0E_CmeEsvsGwkpp38a0jNvllmKGB-VqORZAgNtUfbGR5LtY7Q5902y0DIxUBWFx7j6B1qb1Dh3DLLLrtzQz9UO-FlqVUxKX0kZtdpYZ6VgNoge7aqPM-U-XnM/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/

Tidak ada komentar:

Posting Komentar

Label