Letakkan Author Info ~ fitri1986

21 November 2010

Letakkan Author Info

Korang pernah nampakkan kat wordpress,selalunya kat bawah setiap pos ada tulis author info.Korang berminat nak letakkan info tentang korang di bawah setiap pos kat blogger gak?Caranya amat mudah,ikut je step ni

Ops,lupa tengokla screenshot ni

Nak tengok Demo pun boleh

Ok,lepas korang ikut step ni,pada setiap pos korang akan automatik ada kotak info pasal korang sama macam wordpress.

1. Log in ke akaun blogger korang.

2. Lepas tu pergi ke Dashboard >> Design >> Edit HTML

3. Klik pada kotak Expand Widget Templates

4. Back up le dulu template korang.

5. Cari kod ]]></b:skin> dan letakkan kod CSS dibawah ni SEBELUM/DI ATAS kod ]]></b:skin>

.author_info {
float: left;
width: 533px; /* Set Lebar Kotak Info */
padding: 10px;
border: 1px solid #a1cb26; /* Border Kotak Info*/
margin-bottom: 15px;
margin-top: 15px;
background: #F0FDC6; /* Warna Background*/
}
.author_info h3 {
font-size:17px;
color:#001530; /* Warna Teks "This Post is Written" by */
margin-bottom: 5px;
}
.author_photo {
float: left;
margin: 0 10px 0 5px;
}
.author_photo img {
border: 3px solid #ccc; /* Warna Border Gambar*/
height: 100px; width:100px; /*Tinggi dan Lebar Gambar Avatar Author */
}

6. Cari kod <data:post.body/> dan letakkan kod dibawah ni SELEPAS/DI BAWAH kod <data:post.body/>

<b:if cond='data:blog.pageType == "item"'>
<div class='author_info'>
<div class='author_photo'>
<img alt='author' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8BvDYx2HfeTjKGkHDTdl_9aqwC3At0XdknKD5kf82CmHXD2syhMyXweohGO2IuvWNDddLd9lq-V-0Yl3H_p_B013NFj63wA_N85A0qqKkan9jLV7V_36FQFf2tyz4mnKndv97koYaTqpg/s1600/user_anonymous.png'/></div>
<h3>This post is written by:<a href='#'>Aideal Fitri</a> </h3>

<p>I am Aideal Fitri.This is my demo blog. <a href='Any Link'>Click Here</a> to Know more about Author.</p><p>Follow my blog on <a href='Any Link'><b>Twitter</b></a> or Be fan on <a href='Any Link' target='_blank'><b>Facebook</b></a>.</p>
</div>

</b:if>

7. Klik Save Template dan korang dah hampir siap

8.Ubah teks hijau mengikut info yang korang inginkan.Letakle sebarang penerangan mengenai korang ataupun bolehla letak alamat emel korang.Kod hijau cair untuk gambar author.

*Kod dengan penerangan warna merah adalah jika korang ingin ubah penampilan kotak info supaya sesuai dengan blog