Search

Memuat...

Berlanggan Via Email

Enter your email address:

My Friend

Cara Membuat Kotak Profil Dibawah Postingan Blog

Postingan kali ini saya akan berbagi cara membuat Kotak profil  atau bisa juga di sebut Author box di bawah postingan blog atau di atas form komentar blog seperti contoh hampir sama dengan kotak profil yang ada di postingan blog ini , dan sekarang langsung saja pada cara memasang nya di bawah postingan blog dengan cara sebagai berikut :

1. Login ke akun Blogger sobat.
2. Klik Template >> Edit HTML >> Lanjutkan >> centang Expand Template Widget.
3. Cari kode ]]></b:skin> di HTML template blog.
4. hapus kode ]]></b:skin> lalu ganti dengan kode di bawah ini

.author-box {
background: #f0f0f0;
margin: 20px 0 40px 0;
padding: 10px;
overflow: auto;
color:#888;
font-family:verdana, sans-serif;
}
.author-box p {
margin: 0;
padding: 0;
}
.author-box a{
color:#666;
}
.author-box img {
background: #FFFFFF;
float: left;
margin: 0 10px 0 0;
padding: 4px;
}
]]></b:skin>


5. selanjut nya cari kode <div class="post-footer-line post-footer-line-1"> hapus lagi kode ini ganti dengan kode di bawah ini

<div class="post-footer-line post-footer-line-1">
 cond='data:blog.pageType == &quot;item&quot;'>
<div class='author-box'>
<p><img alt='avatar' class='avatar avatar-70 photo' height='70' src='URL Foto Profil ' width='70'/><b>About Me</b><br/>
Isi dengan Bio Data sobat dll <br/></p>
</div>
</b:if>

Keterangan :Ganti tulisan berwarna hijau dengan URL Foto Profil Ganti dengan Url Photo yang mau ditampilkan , About Me bisa di ganti dengan lain nya , Isi Dengan Bio Data dll ganti dengan sekilas diri sobat dan sebagainya .

6. Terakhir simpan template untuk melihat hasil nya di bawah postingan blog .
Klik tombol berbagi :

2 komentar:

tutorial komputer mengatakan...

terima kasih gan, ini bisa membuat blog kita lebih keren lagi gan, hehe

anak nelayan mengatakan...

terima kasih tutornya gan