Dipublikasikan tanggal 31 Jul 2008
Ditulis dalam kategori Tip Lain, Tutorial Photoshop Dasar, oleh Sadewo

Postingan ini saya gunakan untuk menulis tentang cara membuat gambar avatar. Sebenarnya bukan benar-benar cara untuk membuat gambarnya, tapi lebih tepat disebut sebagai cara menyiapkan sebuah avatar. Karena untuk membuat gambar tentunya itu kembali pada keinginan, kreativitas beserta imajinasi Anda.

Avatar bisa diartikan sebagai sebuah ikon gambar yang melambangkan sesuatu. Secara standar, wordpress menggunakan Gravatar. Gampangnya, silahkan dilihat pada beberapa blog yang mempunyai tempat komentar pengunjung. Pada tempat komentar, biasa terdapat gambar-gambar kecil yang menunjukkan foto orang yang berkomentar. Misalnya pada blog yang bagus ini. ( glodak! )

Beberapa hari kemarin waktu saya mampir ke “rumah” ibunya Aisalwa, saya melihat ada avatar-avatar pengunjung yang berkomentar. Setelah itu saya timbul keinginan untuk menampilkan juga avatar pengunjung di blog ini.

Cara menampilkan avatar pada wordpress

Dari tempat aslinya, themes yang saya gunakan ini tidak menampilkan avatar pengunjung. Jadi agak susah untuk menampilkan avatarnya. Jika menggunakan wordpress versi 2.5 atau 2.6, ada pilihan baru pada menu Settings > Discussion. Tapi belum tahu juga apakah bisa digunakan langsung jika themes tidak mendukung.

Jika blog Anda dihosting di wordpress juga (misalnya NAMABLOG.wordpress.com), tidak perlu repot-repot lagi karena sudah langsung bisa muncul avatarnya jika Anda mempunyai fotonya.
Untuk menampilkan avatar, jika menggunakan wordpress dengan hosting sendiri, maka perlu menginstall plugin tentang avatar. Namun kita juga bisa menampilkannya hanya dengan menambahkan beberapa “mantera”, misalnya seperti dibawah ini:

Karena saya sendiri awam dalam hal CSS dan sebangsanya, maka kode-kode tersebut diatas saya contoh dari themes wordpress lain yang mendukung avatar. Kode-kode ini terdapat juga pada halaman implementasi gravatar.

Kode-kode tersebut di letakkan pada file comments.php, pada sekitar kode php comment_author_link, atau php comment_text.

Kemudian untuk mengatur penempatan gambar avatar, saya menggunakan kode < span style = " float: left " >. Hasilnya, gambar avatar bisa berada di sebelah kiri komentar. Namun ini hanya terjadi jika dibuka dengan browser Mozilla Firefox dan Opera. Di Internet Explorer 7, apalagi yang versi 6, gambar avatar tidak bisa terletak dikiri komentar, tapi tetap di atas komentar. Sepertinya masih ada kesalahan pada nilai margin yang saya gunakan. Bagi para pembaca yang masih menggunakan Internet Explorer versi 6, sudah saatnya Anda beralih ke versi 7. Kalau saran saya, gunakan Mozilla Firefox, atau Opera.

Apabila Anda ingin agar foto / gambar avatar Anda tampil di blog ini atau di situs lain yang mendukung gravatar, Anda harus menggunakan email yang sudah pernah Anda daftarkan avatarnya.

Kalau Anda belum mempunyai avatar, berikut ini cara untuk mendaftarkan foto / gambar Anda.

Langkah untuk membuat avatar di Gravatar

Langkah 1
Buatlah sebuah gambar dulu untuk dijadikan avatar. Misalnya foto Anda sendiri, baik yang masih asli ataupun yang sudah diedit dengan Photoshop. Gambar tersebut harus kita buat menjadi berukuran sama pada panjang dan lebarnya (membentuk bujur sangkar). Walaupun ini sebenarnya sudah akan tersedia juga saat Anda mendaftarkan foto Anda sebagai Avatar, namun akan lebih enak juga jika sejak awal sudah kita siapkan foto dengan ukuran yang sesuai.

Cara yang mudah untuk membuat sebuah foto berukuran sama panjang dan lebarnya adalah dengan menggunakan Crop Tool. Pilihlah Crop Tool, kemudian buat sebuah gambar kotak menggunakan crop tool tersebut pada foto. Perlu diingat, agar ukuran kotak crop tersebut sama panjang dan lebarnya, maka saat membuat gambar kotak harus sambil menekan tombol Shift.

Sesuaikan ukuran dan letak daerah Crop, kemudian tekan Enter untuk memotong gambar sesuai ukuran kotak crop. Ukuran panjang dan lebar keseluruhan gambar tidak terlalu berpengaruh, karena ukuran avatar hasil jadi biasanya sudah tertentu.

Langkah 2
Simpan file-nya dengan fromat jpeg / jpg.

Langkah 3
Sekarang buka www.gravatar.com

tutorial photoshop buat avatar 1

Langkah 4
Klik tulisan Sign up Now!
Isikan alamat email Anda, kemudian klik tombol Signup.

Langkah 5
Buka inbox email Anda, kemudian carilah email yang datang dari Gravatar. Setelah Anda buka email tersebut, klik tautan yang ada di email tersebut untuk mem-verifikasi pendaftaran Anda. Secara otomatis, Anda akan masuk ke account Anda di gravatar dan harus mengisikan beberapa data.
Data yang harus diisikan tersebut, adalah Nickname (silahkan cepat-cepat mendaftar, sebelum nama yang Anda inginkan dipakai orang lain), Password (diisikan sebanyak dua kali). Kemudian klik Signup.

Langkah 6
Untuk memilih gambar avatar, caranya dengan klik pada tulisan Add one by clicking here!. Kemudian pilih sumber gambar. Untuk membuka gambar yang sudah tersimpan di komputer, maka pilihlah My computer’s hard drive.
Setelah itu, klik Browse, cari file yang akan Anda gunakan sebagai avatar. Kemudian klik Next.

Langkah 7
Ubahlah ukuran kotak yang berwarna terang sesuai dengan ukuran foto yang anda inginkan. Apabila foto ini sebelumnya belum di-crop, langkah ini adalah untuk menyesuaikan panjang dan lebarnya.

tutorial photoshop buat avatar 2

Setelah ukuran sesuai, klik tombol Crop and Finish!

Langkah 8
Pilihlah tingkat penilaian sosial tentang avatar Anda ini.

tutorial photoshop buat avatar 3

Terdapat empat pilihan, berikut ini penafsiran saya sendiri:

  1. G = Bisa dilihat oleh semua umur, dari anak kecil sampai mbah-mbah. Saya sarankan untuk menggunakan foto/gambar yang sopan, dan memilih tingkat penilaian ini.
  2. PG = Ada sedikit unsur kekerasan, dan atau pakaian yang menantang. Gampangnya, saat Anda melihat gambar ini kening Anda agak berkerut, dan mikir sedikit “apakah adik kecil Anda pantas melihatnya”.
  3. R = Terdapat gambar yang bisa membuat Anda malu dan atau takut-takut saat menonton ini dihadapan orang tua, mertua, atau pimpinan Anda.
  4. X = Jika gambar Anda pampang di papan pengumuman kampung, bisa membuat para tetangga Anda melaporkan Anda ke Pak RT.

Langkah pembuatan avatar di gravatar sudah jadi. Setelah ini, jika Anda ingin avatar Anda muncul pada blog-blog yang mendukung gravatar, Anda tinggal menggunakan email yang Anda daftarkan tadi saat memberikan komentar.

Tutorial yang terkait

    Kembali ke atas   



Beriklan 468px disini

Pencarian Pengunjung


RSS feed | Trackback URI

45 Comments »

Comment by ozan
2008-08-01 16:06:29

bermanfaat lah!

 
Comment by aisalwa
2008-08-01 17:30:03

PertamaX !!!

*celingak-celinguk … bener nih yang pertama ? ( tumben … )

*set mode on malu-malu (tersanjung nih namaku di link )

GLODAK !!!

 
Comment by Sadewo
2008-08-01 19:59:15

Buat ozan: Terima kasih atas komentarnya.
Buat aisalwa: Maaf, hari ini saya sedang sakit, jadi tidak bisa segera meng-approve komentar.
Malu-malu banget, sampai avatarmu nggak dipasang.

 
Comment by Ronggo
2008-08-02 01:08:54


mbah
baca
koment
praktek

 
Comment by Sadewo
2008-08-02 08:31:51

Buat Ronggo: Ya.

 
Comment by mascayo
2008-08-03 17:32:26

thx elmunya .. sempet lupa nih hehehe.. salam kenal mbah

 
Comment by Sadewo
2008-08-03 20:19:12

Buat mascayo: Salam kenal juga.

 
Comment by tiafri
2008-08-04 20:42:49

wah… nambah 1 nih pengetahuan aq

 
Comment by Sadewo
2008-08-04 23:48:59

Buat tiafri: Silahkan langsung dicoba juga.

 
Comment by sujianto
2008-08-09 16:14:05

makasih bgt ya mas atas tutorialnya!!!! semoga mendapatkan balasan yang besar dari Tuhan Yang Maha Esa!

 
Comment by Sadewo
2008-08-09 16:44:06

Buat sujianto: Terima kasih atas doa Anda.

 
Comment by aha
2008-08-12 11:49:58

pagi mbah… he2. numpang baca. lam kenal

 
Comment by Sadewo
2008-08-12 17:05:57

Buat aha: Salam kenal juga.

 
Comment by Benny
2008-08-22 11:58:44

makasih mas infonya, langsung praktekin nich

 
Comment by Benny
2008-08-22 12:17:53

hoereee.. langsung berhasil..

 
Comment by Sadewo
2008-08-22 13:55:49

Buat Benny: Iya, avatarnya sudah muncul.

 
Comment by andi sukri
2008-08-25 08:41:58

Tengkiyu banget dah mas, jadi bertambah lagi neh ilmu, makasih yah mas, sekalian mencoba apa gravatarnya dah muncul

 
Comment by Sadewo
2008-08-25 14:00:48

Buat andi sukri: Gravatarnya sudah muncul. Terima kasih atas komentarnya.

 
Comment by rendra
2008-08-29 16:47:04

Mas mkasih atas smua ilmunya.Ini saya coba test foto avatar saya.

 
Comment by Sadewo
2008-08-29 23:19:27

Buar rendra: Terima kasih kembali. Tesnya berhasil.

 
Comment by bill
2008-08-30 13:55:26

tq tq bos

 
Comment by Qisthon
2008-09-03 20:41:47

Makasih tutorialnya, dah saya praktekkan langsung berhasil avatarnya.

Untuk wordpress, aku pakai hosting sendiri, bisa langsung muncul tanpa nambah “mantera” :)
Apa ini karena dukungan theme yang aku pakai. Harap maklum aku baru mulai ngeblog dan belum tahu banyak :)

 
Comment by Sadewo
2008-09-03 21:53:41

Buat Qisthon: Memang ada beberapa theme yang sudah mendukung avatar. Kode2 php tersebut juga saya adaptasi dari theme lain.

 
Comment by divar
2008-09-12 10:53:54

makasih yah………….

 
Comment by nunue19jul
2008-09-12 14:19:05

aq lagi coba neh buat avatar jadi ngga ych…?? berkat mbah neee!! aq jd bisa buatnya…thanx infonya yupzzz…

 
Comment by Sadewo
2008-09-12 16:06:46

Buat divar: Terima kasih kembali.
Buat nunue19jul: Avatarnya jadi kok.

 
Comment by noer
2008-09-17 12:50:59

mas, gimana kalo mo nambahin gravatar nya ke side bar,.misalnya ke about box gitu???
AKu blum paham gimana ngegunainnnya

 
Comment by Sadewo
2008-09-17 13:10:04

Buat noer: Setahu saya gravatar itu sebagai tanda pengenal saat kita berada “di tempat orang lain” (sedang komentar di blog lain misalnya). Kalau about itu kan milik yang punya blog, tentunya kita tidak login sebagai pembaca bukan? Kalau di blog ini, about itu saya pasangi gambar sendiri, tidak menggunakan gravatar. Mungkin ada juga kode2 untuk menampilkan gravatar sebagai foto pemilik blog, seperti blog di wordpress yang id kita bisa dipasangi foto, tapi saya sama sekali tidak paham bahasa PHP / CSS.
Barangkali ada pembaca lain yang bisa membantu menjawab pertanyaan noer? Silahkan di-sharing disini.

 
Comment by noer
2008-09-17 13:39:55

Udah mas,.udah terpecahkan,.ternyata cuman nambahin email or ID.
Thanks

 
Comment by maulana
2008-09-29 23:05:05

wah keren tapi kasih tutorial yang lain donk,
terima kasih

 
Comment by Sadewo
2008-09-30 23:15:07

Buat maulana: Tutorial tentang apa ya?
Tapi yang ini saja kok belum dipraktekkan? Itu belum muncul avatarnya.

 
Comment by diper
2008-10-14 18:48:06

makasih mbah dewo saya jadi bisa belajar dengan cepat adobe photoshopnya…
habis kalo baca help / buku nya males nerjemahin bhs inggrisnya…he he..

he.
semoga ilmunya jadi amal yang langgeng ngalir ke account amal ente..

siplah orang orang baik..kayak mbah dewo pasti banyak temenne.

wasalam

Comment by Sadewo
2008-10-14 22:23:34

Amiin. Agar lebih banyak referensinya, tetap harus belajar bahasa Inggris juga ya.

 
 
Comment by blue
2008-10-16 15:53:17

Mbah,jgn bosen ya ama aku… aku mau tanya,kalo ga punya blog apa masih bisa bikin avatar buat muncul dikomen box? apa bisa cuma dgn modal email mbah?krn aku ga punya blog di wordpress ini mbah…minta pencerahannya ya mbah…
-regards-

Comment by Sadewo
2008-10-16 16:59:05

Bisa saja. Memang modalnya cuma email kok. Kalau sudah membuat, setiap mengisi komentar di blog, gunakan email yang sudah diberi gravatar tersebut.

 
 
Comment by dyatmika
2008-10-20 19:22:04

coba dulu ah.. thanks mbah

Comment by Sadewo
2008-10-20 20:34:21

Sudah muncul gravatarnya.

 
 
Comment by Bamswebid
2008-10-23 20:49:45

Comment tanpa avatar bagaikan bumbu tanpa garam………

Comment by Sadewo
2008-10-23 22:01:45

Tepat sekali.
Dengan menggunakan avatar bisa lebih menunjukkan identitas penulis komentar. Dan yang pasti bahwa penulis komentar benar2 menggunakan email yang sesungguhnya, bukan email bohongan.

Bagi para pembaca dan teman2 yang belum mempunyai avatar saya persilahkan segera membuat, gratis kok, dan tidak usah malu2 kalau wajah cakep Anda kelihatan di blog ini ataupun di tiap blog yang Anda komentari (yang ada fasilitas avatarnya).

 
 
Comment by woody
2008-10-26 11:59:32

Terima kasih banyak mbah Dewo,photoshop tips memang good dan mudah di mengerti semoga mbah Dewo makin banyak rejekinya dan cepat dapat pendamping

wassallam

Comment by Sadewo
2008-10-26 13:31:10

Amiin

 
 
Comment by allagan
2008-10-31 10:05:40

Thank’s
Coba avatar nih

 
Comment by allagan
2008-10-31 10:17:13

Thanks

 
Name (Wajib diisi)
E-mail (Wajib diisi - tidak akan ditayangkan)
URI
Your Comment (smaller size | larger size)
Anda boleh menggunakan <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> dalam penulisan komentar.
Anda tidak boleh menggunakan alat tulis seperti pensil / alat tulis bertinta, gunakan keyboard saja.

Trackback responses to this post

edit foto vektor
Beriklan 468px disini