Membuat button reply comment di Blogger New Threaded Comments dengan css3 diharapkan membuat button reply comment menjadi levih mudah dikenali, terutama oleh pengunjung yang belum begitu akrab dengan fungsi reply comment di Blogger New Threaded Comments. Membuat button reply comment dengan kode css3 juga memberi banyak kemungkinan bagi blogger untuk menciptakan effek menarik layaknya sebuah effek animasi. Mengingat kemampuan lebih yang dimiliki css3, tentu saja menggunakan button comment seperti ini membuat blog menjadi lebih menarik. Beberapa kode css3 yang bisa digunakan antara lain css3 transition, css3 box-shadow dan text shadow dan css3 border radius (rounded corners).
Kode CSS Button Reply Comment Blogger New Threaded Comments :
.continue a,.comment-actions a{
position:relative;
top:0;
display:inline-block !important;
font-family:Arial;
font-size:12px;
padding:2px 8px !important;
text-decoration:none;
color:#ccc !important;
border-radius:3px;
border:1px solid #333;
margin-right: 10px;
text-shadow:1px 1px 1px #000;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGD8tbOkHZccsyIUjBJFRLkXg7PI8iys-8aV-WuOFJj8nHQGjAvLstIQaO6T_qlfVJhQgR_wwwWlT-vxb0iYqDhCS9nxg_bG9QW7LIcLXuxNQyD8UevMGMMxX4tx7qr78pxMVuLz4eNzf_/s128/bgHovJQAccordionBlueV30H1.gif.png) 0 0 repeat-x;
transition:0.6s;
-o-transition:0.6s;
-moz-transition:0.6s;
-webkit-transition:0.6s;
-ms-transition:0.6s;
}
.continue a:hover,.comment-actions a:hover{
text-decoration: none;
color:#fff !important;
border:1px solid #eee;
box-shadow:-1px -1px 1px #222, 1px 2px 2px #000;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGD8tbOkHZccsyIUjBJFRLkXg7PI8iys-8aV-WuOFJj8nHQGjAvLstIQaO6T_qlfVJhQgR_wwwWlT-vxb0iYqDhCS9nxg_bG9QW7LIcLXuxNQyD8UevMGMMxX4tx7qr78pxMVuLz4eNzf_/s128/bgHovJQAccordionBlueV30H1.gif.png) 0 100% repeat-x;
}
.continue a:active,.comment-actions a:link:active{
background:#555;
border-radius:4px;
top:2px;
}Cara menggunakan kode CSS :
- Login ke Blogger.
- Dasbor/Dasboard.
- Rancangan/Design.
- Edit HTML.
- Cari kode ]]></b:skin> .
- Letakkan kode CSS di atas ]]></b:skin>
Pilih salah satu kode css di atas, atau silahkan edit terlebih dahulu. - Simpan Template/Save Template.
- Selesai.
