Cara Membuat Profil Disetiap Postingan Dengan CSS 3

Added Kamis, 02 September 2010 , Under: Blogger Tutorial, CSS3

Text Resizer: Click for Resizer

Beberapa Blogger Lebih Senang Membuat Profilnya Sendiri dibanding harus menampilkan
Profil dari Blogger.com, Nah, untuk itu, kali ini saya akan mengajak anda membuat Profil
Dibawah setiap postingan Dengan memanfaatkan CSS3. Tampilannya seperti gambar diatas atau
bisa anda lihat pada bagian bawah postingan blog ini.

Okeh untuk membuat Profil Disetiap Postingan Dengan CSS 3 Silahkan ikuti Tutorial Di bawah
ini:

1. Login ke Akun Blogger anda masing-masing

2. Klik Design atau Rancangan, kemudian pilih edit html
3. Centang Expand Widget Template (saya anjurkan download dahulu template anda)
4. Cari kode seperti dibawah ini:

]]></b:skin>

5. Jika sudah Ketemu, masukkan Script Dibawah Ini Diatas Kode ]]></b:skin> Tadi

#profil-ane {background : #EEE;margin : 0 0 10px 0;padding :11px 10px;

width : 508px;-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;}

6. Beralihlah Dan Cari Kode

<data:post.body/>

Atau

<p><data:post.body/></p>

Dan letakkan Script Dibawah ini Tepat Dibawah Kode Tersebut

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<h4>About the Author</h4>
<div id='profil-ane'> <img alt='Siapa Nie?'
src='http://i785.photobucket.com/albums/yy131/djnand/paramore.jpg'/>Annyonghaseyo, Jonen
<a href='http://dj-note.blogspot.com/'> Ferdinand</a> Imnida
Bukan Orang Berilmu apalagi Guru Besar Matematika, tapi cuma orang yang Enjoy Dan
nikmatin hidupnya
Bukan Pujangga Apalagi Sastrawan, tapi cuma orang yang Cinta sama Bahasa Jawa Dan Korea
Bukan Orang kaya apalagi Direktur perusahaan, tapi cuma orang yang mensyukuri Rahmat dan
Berkat Dari Sang Pencipta
Dan Untuk Foto yang disamping, wes ra sah tanya-tanya, yang jelas itu bukan aku(ya Iya lah aku
kan lelaki tulen wkwkwk). Nha Lho, nek udu kowe lah sopo toh kui? Kenalkan itu Halley
Williams Vokalisnya Paramore soal&#39;e aku niki Paramore Holic hehehehe....
Wes &#39;lah pokok&#39;e, Sonsaengnim bangmunhae jusyoso jongmal
gamsahamnida...Walah kowe ra ngerti toh? yo wes cukup &quot;Say&quot; Chonmaneyo hhe....
</div>
</b:if>

7. Setelah Itu Save Template anda dan Lihat hasilnya(akan seperti Diakhir postingan Blog ini)

* Yang saya beri warna Hijau silahkan Ganti Dengan Url Anda Dan kata-kata bisa anda ganti
sesuai kehendak anda
* Yang saya beri warna Merah jangan Diganti jika tidak diberi nama yang sama karena itu
merupakan perintah untuk memanggil.

About the Author

 Annyonghaseyo, Jonen Ferdinand
Imnida

Bukan Orang Berilmu apalagi Guru Besar Matematika,tapi cuma orang yang Enjoy Dan
nikmatin hidupnya

Bukan Pujangga Apalagi Sastrawan, tapi cuma orang yang Cinta sama Bahasa Jawa Dan Korea

Bukan Orang kaya apalagi Direktur perusahaan, tapi cuma orang yang mensyukuri Rahmat dan
Berkat Dari Sang Pencipta

Dan Untuk Foto yang disamping, wes ra sah tanya-tanya, yang jelas itu bukan aku(ya Iya lah aku
kan lelaki tulen wkwkwk). Nha Lho, nek udu kowe lah sopo toh kui? Kenalkan itu Halley
Williams Vokalisnya Paramore soal'e aku niki Paramore Holic hehehehe....

Wes 'lah pokok'e, Sonsaengnim bangmunhae jusyoso jongmal gamsahamnida...Walah

kowe ra ngerti toh? yo wes cukup "Say" Chonmaneyo hhe....