UXDE dot Net Wordpress Themes

Cara membuat photo tagging di blog dan website

By

alt

Salah satu fungsi cool yang ada pada facebook ialah photo tagging, di mana kita boleh tanda nama orang pada gambar. Senang dan sangat convenient, walaupun kadang kala fungsi photo tagging tu disalah guna untuk tag pada gambar mengarut.

Kalau kat blog pula saya biasa tengok orang akan list satu persatu yang ada dalam gambar. Contohnya, dari sebelah kanan ialah @einztrigger, diikuti @fullfilth @eenrockstar dan seterusnya. Kalau yang dalam gambar tu 10 orang je takpe lagi nak mention satu persatu tapi kalau 20,30 atau lebih takkan nak mention semua kan?

Tutorial ini akan memberitahu beberapa cara untuk membuat photo tagging pada  blog dan website anda. Lepas ini boleh tag gambar ramai2 ya, boleh try hover pada gambar di atas sebagai demo.


1. Picmeleo Alive

picmeleo alive[11]

Picmeleo alive (link) membolehkan anda upload gambar ke dalam app picmeleo kemudian boleh add bubbles atau annotations pada gambar tersebut. Gambar pertama dalam entri ini adalah dibuat menggunakan picmeleo.

Apa yang best mengenai picmeleo;

- Senang gila nak guna

- Boleh embed di mana-mana website dan blog dengan html code

Apa yang kurang best;

- Menggunakan Adobe Flash; pengguna iphone/itouch/ipad tidak boleh tengok

- Gambar besar akan dicompress dan kualiti gambar akan dikurangkan sedikit

2. ImgNote WordPress Plugin

imgnote

ImgNote ialah plugin wordpress untuk menambahkan nota atau annotation pada gambar. Cara menggunakannya juga agak mudah, hanya perlu download dan install plugin pada wordpress. Kemudian masuk dashboard wordpress > edit posts > dan tekan pada butang edit image notes.

Download ImgNote.

3. Demon Image Annotations

demon image annotations

Fungsi lebih kurang sama dengan ImgNote, iaitu menambah annotations pada gambar. Ianya menggunakan Jquery plugin dan bukannya Adobe Flash jadi hasilnya lebih mantap dan laju. Interface lebih menarik berbanding ImgNote.

Download Demon Image Annotations.

4. Jquery Photo Tag Plugin

jquery photo tag plugin

Jika anda web developer, anda boleh gunakan Jquery Photo Tag plugin ini dan integrasikan di website anda.

Plugin Demon Image Annotation wordpress adalah dibuat berdasarkan Jquery Photo Tag Plugin.

Plugin ini sangat cool sebab anda boleh remove tag.

Tutorial untuk menggunakan plugin ini di website anda: http://karlmendes.com/2010/07/jquery-photo-tag-plugin/

5. Img Notes JQuery Plugin

img notes wordpress plugin

Plugin Imgnote wordpress adalah dibina berdasarkan plugin asal Jquery Img Notes.


Saya harap ramai blogger dan web developer dapat sedikit inspirasi daripada artikel ini. Serius bagi saya photo tagging sangat perlu dan cool, lebih2 lagi kepada photo blogger.

 

Dah lama tak tulis artikel mengenai html, website dll ini. Biasanya saya belajar benda2 macam ini hanya ketika idea muncul tiba-tiba. Memang niat nak tulis tu ada tapi kadang2 idea tak ada susah juga.

Incoming search terms:

Eins - penulis Jomphp, Eins.MY dan beberapa blog lagi. Suka benda kreatif, kuat main game dan hobi pada masa lapang ialah membaca komik serta bacaan berkaitan teknologi dan komputer. Follow twitter @einztrigger.

Discussion 28 Comments

  1. sankai

    sudah cuba imgnote dan demon image annotation, tapi dua-dua pun tidak menjadi. yang imgnote tu boleh pakai, tapi image kena betul-betul rezise ikut theme kita. kalau image saiz besar dan kita guna tag width=”100%”, dia cuma paparkan separuh gambar tu sahaja.

    • EiNS

      Well, terpaksa la ko resize image biar masuk ngan theme…baru try imgnote or demon image annotation…

      kalau faham javascript cuba try edit yg asal :)

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>