29 May 2010

Cara Membuat Animated Favicon

Bagaimana kabar sobat semua? pada hari ini rifweb akan membahas cara membuat favicon menggunakan animated favicon (How to create animated favicon). Banyak cara untuk membuat gambar icon alamat url blog kesayangan Sobat dan salah satunya dengan menggunakan Tools Animated Favicon ini ().

Ada dua kemudahan dalam tools ini, yaitu gambar dapat langsung Sobat pilih sendiri dengan gambar favorit yang ada di hardrive komputer sobat dan satu lagi yang lebih menarik adalah Sobat bisa juga memasukan tulisan berjalan ke icon  url blog Sobat.

Beberapa langkah untuk membuat favicon :

  1. Masuk ke halaman Animated Favicon
  2. Upload foto (gambar) yang Sobat inginkan.
  3. Jangan lupa untuk memasukan beberapa karakter text (tulisan) pesan yang bagus, agar nantinya favicon lebih menarik.
  4. Klik tombol Create Favicon.

Apabila langkah diatas sudah berhasil, geser ketengah halaman dan gambar serta text yang tadi dibuat akan diberikan preview. Lalu klik "Get It Now".

Setelah gambar berhasil di download dan disimpan pada direktori komputer Sobat, sekarang adalah langkah-langkah untuk mengupload ke hosting gambar gratis seperti photobucket dan yang lebih mudah lagi Sobat bisa menggunakan jasa http://tinypic.com/ gratis. Biasanya file favicon yang didownload berbentuk dalam folder ZIP , untuk meng-exstrac Sobat bisa menggunakan software IZArc yang bisa di download disini atau bisa juga meng - exstrac menggunakan software ZIP yang telah Sobat miliki.

Adapun upload ke hosting gambar adalah sebagai berikut :


  1. Masuk ke halaman http://tinypic.com/.
  2. Masukan gambar favicon yang extensinya (animated_favicon.gif).
  3. Klik Upload dan masukan verifikasi kode security-nya (Enter the code below to upload.).
  4. Copy alamat URL yang diberikan pada Direct Link for Layouts, contoh (http://i45.tinypic.com/2hq6w7s.gif).

 

gambar no2.
     gambar no3.
      gambar no.4
      Setelah itu ubah url no.4 menjadi kode :

       <link href='http://i45.tinypic.com/2hq6w7s.gif' rel='shortcut icon'/>


      dan simpan kode diatas sebelum Tag </head> pada template Sobat.

      Simpan template dan lihatlah hasilnya.

      Cara Membuat Animated Favicon Rating: 4.5 Diposkan Oleh: Sarifa Marwa

      5 komentar:

      1. Tutorial yang bermanfaat sob..
        Saya mO coba..

        Nice Post...

        ReplyDelete
      2. Manntappp...
        Langsung ane coba,,ya,,Mas.. :p
        Kotak follow di blog ini mana,,ea??? Mo aq follow...
        Hihi..

        ReplyDelete
      3. cara ngubah jadi kode nya gimana????

        ReplyDelete
      4. @yanar sahabat henshin Copas Aja kode diatas dan ikuti petunjuknya Sob.

        ReplyDelete
      5. tengkyu gan buat nice infonya....udah aq praktekin dan berhasil.....

        ReplyDelete

      Komentar Spam, Link Aktif, dan URL Blog Takkan Muncul. Tidak semua pertanyaan sempat/bisa dijawab.