Post info

Label:


Comments 0


Author: nius blog

Lagi mau abisin draft dulu nih, kalu yang ini menjawab pertanyaan sahabat blogger yang bertanya bagaimana membuat kotak profil di bawah postingan yang bergaya box-shadow atau CSS3. Sebelumnya apakah kita perlu menambahkan profil di dalam blog kita?
Kalu saya bisa jawab itu semua tergantung pemilik blog, lalu apa keuntungannya kotak profil bergaya css3 ini? Keuntungannya sepertinya tidak eror di bandingkan kita memakai widget dan juga profil bisa di ganti sewaktu-waktu sesuai keinginan seperti gambar dan juga kata-kata yang ada di dalamnya. okeh... bagi yang tertarik silahkan di ikuti tahapannya:
1.Masuk ke edit html
2.Silahkan di centang Expand Widget Templates
3.Masukan kode di bawah di atas ]]></b:skin>  

#profil-ane {background : #EEE;margin : 0 0 10px 0;padding :11px 10px;
width : 608px;-moz-box-shadow : 4px 4px 4px rgba(0,0,0,0.3);
-webkit-box-shadow :4px 4px 4px rgba(0,0,0,0.3);
-moz-border-radius:10px;
-webkit-border-radius:10px;
font-size: 14px;
line-height: 15px;}
#profil-ane p {margin : 0 0 5px 0;}
#profil-ane img {float: left;width:100px;margin : 4px 10px 2px 0;}
4.Kemudian cari kode <data:post.body/>
5. kalu sudah ketemu masukan kode di bawah tepat di bawah <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<h4>About the Author</h4>
<div id='profil-ane'>
 <img alt="hendro prayitno" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHALIXhdGRgTpUcm-kpThZc0H1yac4BqJDHm9lCOBIalkW36YJPLGeUJZu8on18t94X71SpVE9uP85WaH-zTwI8HGqztENF94tRmJpqkEDN47GUyWvFn1Yw1z8PNPSHEzJaQ0C1qrcyQ/s200/bolot+banget.jpg" />Assalamualaikum, nama ane: <a href="http://hendro-prayitno.blogspot.com/"> H.Bolot</a>
Banyak yang bilang nih kalo ane ganteng, ade juga yang bilang kalu ane mirip indra brugman. Ane asli orang betawi turunan gobang tanjakan ampera, hobi ane dengerin musik yang berbau metal!!
hehehehe
Makanan kesenengan ane semur jengkol sama lalap pete, apalagi makannya di samping jande, mantap dah...pokonya begitu dah..</div>
</b:if>
6.Save template dan lihat hasilnya

0 komentar:


Posting Komentar