Cara Membuat dan Memasang Favicon di Blog

Cara membuat favicon blog sebenarnya sangatlah mudah bagi temen-temen yang mengerti aplikasi desain dengan baik. Tapi, tidak semua blogger punya kemampuan desain dengan baik.

 

Makanya, di panduan kali ini Pangeran akan membagikan cara membuat dan memasang favicon di blog dengan langkah-langkah yang dibuat sangat mudah diterapkan (khususnya buat blogger pemula).

 

Cara Membuat Favicon Blog

 

Favicon adalah sebuah identitas penting dari blog atau website. Favicon ini biasanya dalam bentuk Logo, Foto wajah sendiri atau Icon-icon lainnya yang kiranya berkaitan dengan blog itu sendiri. Karena bisa disebut sebuah identitas, tentunya perlu sekali untuk mengganti favicon kalian menjadi keren supaya pengunjung blog mudah mengenali blog kalian.

 

Memang, untuk membuat Favicon blog ini sangat banyak alternatif yang bisa temen-temen pilih. Jika temen-temen mengerti dengan baik aplikasi desain seperti : Adobe Ilustrator, CorelDraw dll. Mungkin tidak perlu mengikuti panduan ini. Nah, buat temen-temen yang belum mengerti aplikasi desain dan pengen yang instan, silakan buka web di bawah :

 

  1. favicon.cc
  2. animatedfavicon.com (Membuat Favicon Efek Animasi)
Website di atas bisa temen-temen gunakan untuk membuat Favicon dengan cara yang nggak sulit. Tinggal buat, download dan selesai.

 

Tapi, yang jadi masalahnya terkadang desain Faviconnya tidak sesuai keinginan sendiri. Makanya, di panduan ini Pangeran akan mengajarkan ke kalian tentang cara membuat favicon sendiri dengan aplikasi PhotoScape.
Buat yang nggak ada PhotoScape, bisa menggunakan Aplikasi lainnya. Intinya, konsepnya sama saja. Hanya penerannya saja yang berbeda. Mari kita mulai.

 

1. Buka aplikasi PhotoScape dan Klik Editor.

 

cara mengedit blog menggunakan photoscape

 

 

2. Klik Menu (pada bagian kanan bawah) dan pilih New Photo

 

cara membuat favicon di blog

 

 

3. Karena ukuran Image Favicon yang disarankan oleh blogger di bawah 100kb, maka ganti ukuran untuk favicon Width (Lebar) dan Height (Tinggi) menjadi 100×100 pixel. Pilih juga warna background yang sesuai dengan blog kalian. Lalu klik OK.

 

cara membuat favicon di blog

 

 

4. Klik Tab Object dan Klik ‘T’ untuk menambahkan Teks. Atur sesuai keinginan kalian (silakan berkreasi sendiri). Jika sudah selesai, klik OK.

 

cara membuat favicon di blog

 

 

5. Letakkan teks ke dalam background yang sudah kalian buat tadi. Sebaiknya letakkan di tengah.

 

cara membuat favicon bergerak di blog

 

 

6. Jika sudah, silakan klik Save > Save As (tentukan folder penyimpanan) > Save.

 

cara membuat favicon di blog

 

 

7. Selamat. Kalian sudah berhasil Membuat Favicon di Blog kalian sendiri.

 

Cara Membuat Favicon dengan Foto Wajah

 

Maksud favicon dengan foto ini adalah foto wajah kalian atau foto apapun. Mungkin kalian juga pengen supaya orang mengingat wajah kalian untuk mudah mengenali bahwa blog tersebut milik kalian. Untuk cara membuat foto wajah menjadi favicon, langkahnya sebagai berikut :

  1. Siapkan foto yang mau kalian gunakan untuk favicon
  2. Crop ukuran foto favicon kalian menjadi 100×100 pixel. Jika ukuran filenya masih di atas 100kb, silakan compress dengan mengikuti panduan Optimalkan Gambar.
  3. Jika sudah di bawah 100kb, maka silahkan lanjut ke panduan selanjutnya.

Setelah Favicon di blog kalian selesai, saatnya kita lanjut untuk cara mengganti favicon default Blogger menjadi Favicon dengan karya kalian sendiri.

 

Cara Mengganti (Memasang) Favicon di Blogger

 

1. Login ke Blogger.com > Tata Letak (Layout) > Klik Edit pada Favicon. Begini langkahnya :

 

cara mengganti favicon di blog

 

 

2. Setelah tampil pop up baru, Klik Choose File (untuk meng-upload image Favicon yang sudah kalian buat tadi). Klik Open untuk upload Image Faviconnya.

 

cara mengganti favicon di blog

 

cara mengganti favicon di blog

 

 

3. Jika berhasil, maka akan seperti gambar di bawah ini. Langkah selanjutnya Klik Simpan (Save).

 

Cara mengganti favicon di blog

 

 

4. Selamat! Kalian sudah berhasil mengganti Favicon di blog. Silakan buka blog kalian dan lihat Faviconnya apakah sudah sesuai dengan Favicon yang kalian buat.

 

—o0o—

 

Rasanya panduan di atas sudah Pangeran jelaskan dengan cukup lengkap supaya kalian bisa membuat favicon blog dan cara memasangnya..
Seperti biasa. Terimakasih sudah membaca. Semoga bermanfaat. Pangeran Wortel pamit. See you…

Heru Arya

Blogger kelahiran Bengkalis yang sudah jadi mantan Mahasiswa Pertanian. Sekarang sedang sibuk diam biar punya banyak emas.

5 thoughts to “Cara Membuat dan Memasang Favicon di Blog”

  1. tutorial yg sangat mudah, 😀
    Tapi nanti pasti akan timbul kendala. Pertama, ukuran 100×100 itu sangat kecil. Jika dibuat dari gambar yang besar, ketika dia diperkecil pasti akan pecah.
    Maka solusinya adalah, usahakan sumber gambar yg mau dipake (misal pake gambar) usahakan yg memang ukuran yg kecil. Atau bener2 bikin sendiri bagi yg bisa. 🙂

    nice share…

    1. Alahamdulillah, kendala seperti itu sudah bukan masalah lagi, Vin. Karena, setiap panduan yang dibuat di tulisan wortel, sudah diuji coba dulu. Alias, nggak bikin jebakan buat para panggunannya. 🙂

      Jika mengikuti dan membaca panduan ini dengan baik, dijamin kok, nggak akan mengalami kendala seperti yang dirimu sebutkan di atas.

      Nah, setuju banget tuh. Tapi sejauh ini, pergantian pixel di atas 1000 menjadi 100 tidak punya efek yang terlalu parah. Jika bentuk wajah, masih sangat jelas kok. 🙂

  2. Wah detail banget, gampang dipahami dan bisa langsung dipraktekin nih. 😀

    Beberapa waktu lalu aku pernah bikin favicon pake cara instan, pake favicon.cc itu, tapi gambarnya agak pecah. Aku gak pernah kepikiran buat ngedit di photoscape dan kayaknya aku harus coba edit pake photoscape. Tengkyu pange, heheu~

  3. wahhh kalo saya biasanya editnya pake photoshop untuk bikin logo logo kayak favicon itu soalnya lebih mudah, tapi kalau dari besar ke kecil pasti pecah di photoshop, kalo lebih bagus lagi bagusnya di coreldraww sih mantap lah…

Leave a Reply

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