Home > Ekspresi > Bikin Kartu

Bikin Kartu

December 27th, 2010 Leave a comment Go to comments

Kalau bicara tentang gambar atau image memang dilema, khususnya untuk yang koneksi internetnya lambat atau yang spacenya terbatas. Tapi sampai kapan kita alergi masang gambar?.

Bagi sahabat yang nggak mau pusing mikir loading dan nggak takut space bangkrut, kali ini saya akan berbagi tentang bagaimana bikin kartu ucapan animasi seperti yang terpasang di sidebar itu. Kelebihan dari teknik ini adalah suport di sembarang blog. Di wordpress.com dan blogspot dipastikan jalan dengan normal.

Lagi2 saya katakan bahwa layanan gratis untuk bikin kartu banyak tersedia dan nggak ribet. Tapi kekurangan dari layanan gratis itu biasanya muncul logo sponsor milik penyedia, lagi pula yang namanya gratisan pasti banyak yang menyamai. Kalau bikin sendiri kan limited edition.

Pakai software photoshop juga bisa, tapi saya berani taruhan hasilnya pasti beda dengan bikinan saya. Photoshop sich biasa. Sekali2 perlu nyoba yang anti biasa

Yang perlu kita siapkan adalah gambar animasi yang bisa kita download dari banyak sumber. Kalau yang saya pakai ini ngambil dari www.cellsea.com. Gambar tersebut akan menjadi background kartu. Langkah selanjutnya adalah menambah kode untuk bikin teksnya.

ini backgroundnya

ini setelah ditambah teks

METAMARSPHOSE

mengucapkan
Selamat Tahun Baru

© Blog Tjap Koepoe Biroe™

Kode untuk menggabungkan gambar dan teksnya adalah sbb :

<center><div style="background-image: url('url background'); background-repeat: no-repeat; background-position: center center; padding: 0px;">
<p style="text-align: center;padding-top:40px;padding-bottom:30px;line-height:130%;font-size:140%;color: #ffffff;">teks baris pertama</p>
<p style="text-align: center;padding-top:20px;padding-bottom:10px;line-height:130%;font-size:120%;color: #ffffff;">teks baris kedua</p>
</div></center>

Gantilah kode warna merah dengan isian yang sesuai. Tujuannya adalah agar letak teks proporsional dengan background imagenya. Kalau mau mudah, sahabat bisa copy paste kode berikut lalu ubah teks warna merah dengan nama sendiri…

<center><div style="background-image: url('http://metamarsphose.files.wordpress.com/2010/12/wp4d003ae3bf680.gif'); background-repeat: no-repeat; background-position: center center; padding: 0px;">
<p style="text-align: center;padding-left:0px;padding-bottom:0px;padding-top:50px;padding-right:0px;line-height: 120%;font-size:180%;color: #ffffff;"><b>METAMARSPHOSE</b></p>
<p style="text-align: center;padding-bottom:10px;padding-top:10px;line-height: 130%;font-size:140%;color: #ffffff;"><b>mengucapkan<br />Selamat Tahun Baru</b></p><p style="text-align: center;padding-bottom:20px;padding-top:130px;line-height: 120%;font-size:100%;color: #ffffff;">&#169; Blog Tjap Koepoe Biroe&#8482;</p>
</div></center>

Untuk yang berkenan, mari silakan dicoba, untuk yang nggak suka ya nggak apa2. Tak ada yang disuka semua, dan tak ada yang nggak disuka semua. Selamat menyambut tahun baru 2011…

~ Grazie ~
Categories: Ekspresi
  1. December 30th, 2010 at 15:46 | #1

    notepad, kemarin sudah saya kirim via gmail, pa 🙂


    OK…

    [Reply]

Comment pages
1 2 10395
  1. January 1st, 2011 at 08:34 | #1

silakan buka katalog untuk melihat postingan lainnya
~ terima kasih ~