Sabtu, 27 Juli 2013
Menambahkan Gaya Warna-Warni adalah cara untuk menghiasi komentar agar
lebih menarik untuk dipandang. Gaya Warna-warni pada komentar ini dibuat
dengan menambahkan kode pelengkap yaitu CSS, dengan adanya kode CSS ini
anda dapat mengkreasikan blog atau website anda, salah satu menghiasi
komentar ini. Dengan menghiasi komentar ini pengunjung juga lebih
tertarik untuk berkomentar.
Komentar Gaya Warna-warni ini mempunyai beberapa fitur seperti,
Memberikan gaya latar warna pada nama, tombol Balas(reply), dan tanggal,
dan mempunyai fungsi yaitu, jika latar berwarna orange berarti
pengunjung, dan jika latar berwarna ungu muda berarti pemilik blog, dan
sebagai pelengkap yaitu font.
Cara Menambahkan Gaya Warna-Warni Pada Komentar Blogger Dengan CSS
- Silahkan Masuk Ke Akun Blogger Anda.
- Setelah itu, Klik Menu Template, --> Simpan terlebih dahulu template anda, --> Setelah itu, Klik Tombol Edit HTML.
- Cari Kode ]]></b:skin> dengan menekan CTRL+F.
- Masukan Kode berikut ini diatas kode ]]></b:skin> :
<!-- Start Colorful Stylish Comments -->
@font-face {
font-family: 'Philosopher';
font-style: normal;
font-weight: 400;
src:
local('Philosopher'),
url(http://themes.googleusercontent.com/static/fonts/philosopher/v4/OttjxgcoEsufOGSINYBGLYbN6UDyHWBl620a-IRfuBk.woff)
format('woff');
}
.comment .avatar-image-container {
border: 1px solid #B6B6B6;
max-height: 70px !important;
margin-top: -5px;
width: 70px !important;
position: relative;
z-index: 50;
}
.comment .comment-block {
margin-left: 75px !important;
}
.comment .comment-header {
background: none repeat scroll 0 0 #A9F5D0;
color: #333;
font-size: 15px;
font-weight: bold;
margin-left: 60px;
}
.comment .comment-header a {
color: white !important;
text-decoration: none;
}
.comment .comment-content {
background: none repeat scroll 0 0 #FEFFF9;
border-bottom: 2px solid #E6E6E6;
font-size: 14px;
margin: 0 0 30px;
padding: 5px 5px 10px 10px;
}
.comment .comment-actions a {
background: none repeat scroll 0 0 #DDD;
color: #333;
display: inline-block;
line-height: 1;
margin: 0 3px;
padding: 3px 6px !important;
text-decoration: none;
}
.comment .comment-actions a {
background: none repeat scroll 0 0 #DDD;
color: #333;
display: inline-block;
line-height: 1;
margin: 0 3px;
padding: 3px 6px !important;
text-decoration: none;
}
.comment-header cite {
background: none repeat scroll 0 0 #DF7401;
border: 1px solid white;
color: white;
padding: 2px 20px;
position: relative;
z-index: 99;
margin-left: -20px;
}
cite.blog-author {
background: none repeat scroll 0 0 #8181F7 !important;
}
.icon.blog-author {
display: none !important;
background: url("") no-repeat scroll 0 0;
margin-left: 90px;
width: 60px !important;
height: 60px !important;
position: absolute;
right: 5px;
bottom: 5px;
top: 10px;
}
.comment .comment-header {
color: #333;
font-size: 15px;
font-weight: bold;
}
.comment .avatar-image-container img {
border: medium none !important;
height: 70px !important;
width: 70px !important;
max-height: 70px !important;
max-width: 70px !important;
}
.comment .comment-actions a {
background: none repeat scroll 0 0 #DDD !important;
color: #333 !important;
display: inline-block !important;
line-height: 1 !important;
margin: 0 3px !important;
padding: 3px 6px !important;
text-decoration: none !important;
font-size:16px;
}
.comment .comment-actions a:hover {
background: #CCC !important;
text-decoration: none !important;
}
.comments {
font-family: 'Philosopher', arial, serif !important;
font-size: 1em;
color: black;
}
.comments .continue a {
display: block !important;
font-weight: bold !important;
padding: .5em !important;
color:#E34600;
font-size:16px;
}
.comments .continue a:hover {
color:#4D3123;
text-decoration:none;
}
.item-control {
display: none !important;
}
.comments .continue {
border-top: 2px solid transparent !important;
}
<!-- End Colorful Stylish Comments -->
- Kemudian, Klik Tombol Simpan Template.
BARU Backlinks
|
URL
|
|
Code For Forum
|
|
HTML Code
|
Posting Komentar