Cara membuat favicon (animasi) versi 2 pada blogger

Pada halaman ini saya akan berbagi informasi mengenai cara membuat favicon animasi atau favorite icon, sebelum memulainya sebagai ilustrasi favicons adalah kotak kecil yang bisa berisi gambar, huruf ataupun angka dan juga logo atau lambang website yang terletak tepat di sebelah kiri address bar pada web browser yang anda gunakan untuk mengakses internet, kalau masih bingung silahkan perhatikan gambar di bawah ini :



klik untuk memperbesar

Perhatikan betul letak gambar huruf W di atas itulah yang di maksudkan dengan favicon, apabila anda sudah paham silahkan ikuti langkah-langkahnya untuk membuat favicon animasi :

1. Buat folder di drive D pada komputer anda dengan nama folder favicon

2. Silahkan anda kunjungi situs www.3dtextmaker.com atau langsung klik di sini

3. Kemudian klik tombol atau button bertuliskan click here to create 3d text atau langsung klik di sini

4. Ini hanya untuk menyamakan persepsi anda dan saya saja kalau anda sudah paham anda bisa mengubahnya sesuai dengan selera anda sendiri, kemudian di bawah tulisan
Step 1 - Select A Font
di kotak sebelah kanan tulisan serif silahkan anda klik panah ke bawah dan pilih type brighton bold

5. Kemudian di bawah tulisan step 2 - select color silahkan anda pilih warna kuning untuk lebih tepatnya kotak di sebelah kanan tulisan R adalah FF, G adalah FF dan B adalah 00, ini hanya untuk menyamakan persepsi saja antar anda dan saya

6. Langkah selajutnya di bawah tulisan step 3 - set yuor dimensions, di dalam kotak di samping kanan tulisan custom dimensions silahkan anda ketikkan angka 125 X 125 pixel


7. Berikutnya di bawah tulisan step 4 - set other variables di dalam kotak di samping kanan tulisan effect silahkan anda pilih type rotate right, di dalam kotak di samping kanan speed pilih type slow, di dalam kotak di samping kanan tulisan font size ketikkan angka 25

8. Langkah selajutnya di bawah tulisan step 5 - enter text di dalam kotaknya silahkan anda ketikkan huruf A kemudian kllik tombol atau button make 3 d text, hasil awalnya akan seperti ini :


Klik untuk memberbesar

9. Berikutnya arahkan kursor mouse anda di dalam kotak di bawah tulisan Here is your free 3 d text, klik kanan mouse anda pilih save image as,pilih lokasi penyimpanan gambarnya pada contoh kali ini gunakan folder pada drive d komputer anda dan gunakan nama folder favicon, tunggu beberapa saat sampai proses mengunduh gambar selesai

10. Kemudian silahkan anda kunjungi situs www.online-image editor.com atau langsung klik di sini

11. Langkah berikutnya, setelah anda mengunjungi situs www.online-image-editor.com, di bawah tulisan upload yang letaknya persis di bawah tulisan get started klik tombol atau tulisan browse, pada langkh ini anda akan di minta untuk menunjukkan lokasi keberadaan file yang akan di unggah atau di upload dari komputer anda ke situs online-image-editor.com, silahkan anda tunjukkan keberadaan file yang berupa gambar animasi untuk favicon blog anda, pada contoh ini gambar telah anda unduh dan anda simpan di drive D komputer anda dengan nama folder penyimpanan adalah favicon, silahkan anda tunjukkan gambar tersebut lalu klik tombol atau button bertuliskan upload, tunngu beberapa saat sampai proses upload gambar selesai

12. Setelah proses upload gambara favicon selesai silahkan anda klik button atau tombol yang bertuliskan add border, kemudian silahkan anda klik di dalam kotak kecil di sebelah kanan tulisan color lalu pilih warna hitam atau kodenya adalah 000000, lalu klik tombol close atau tanda silang, kemudian klik tombol atau button preview, setelah anda merasa sesuai dengan warna latar dari gambar favicon blog anda lalu klik tombol atau button apply

13. Kemudian di bawah tulisan upload new picture terdapat tool bar yang bertuliskan save atau gambar disket,klik pada gambar tersebut, kemudian di bawah tulisan save klik pada gambar di sebelah kanan tulisan save image local, lalu akan muncul kotak dialog yang menanyakan di folder dan drive mana anda akan menyimpan gambar favicon untuk blog anda ?, silahkan anda pilih dengan meng klik dalam lobang di sebelah kiri tulisan save lalu pilih tujuan penyimpanan gambar favicon anda di drive D komputer anda dan di dalam folder dengan nama folder favicon, tunggu beberapa saat sampai proses download selesai

14. Setelah proses download selesai, silahkan anda klik untuk melihat gambar yang sudah anda buat tadi pada drive D komputer anda dan di dalam folder dengan nama folder favicon, hasilnya akan tambak seperti gambar di bawah ini :




Silahkan di klik untuk memperbesar
Pada contoh ini saya mengalami perubahan ukuran gambar, yang semula saya setting dengan ukuran 125 X 125 pixel ternyata setelah jadi ukurannya berubah menjadi lebih besar yaitu 131 X 131 pixel, tapi ini tidak menjadi masalah asalkan gambarnya tetap berbentuk bujur sangkar

15. Langkah berikutnya silahkan anda kunjungi situs www.photobucket.com atau langsung klik di sini

16. Setelah anda mengunjungi situs photobucket.com, silahkan anda mendaftar pada situs tersebut, jangan kuatir, gratis kok !!!

17. Setelah anda mendaftar pada situs photobucket.com, buat nama album untuk gambar anda dan kemudian silahkan anda sign in pada situs tersebut

18. Setelah anda sign in pada situs www.photobucket.com, langkah selanjutnya adalah silahkan anda klik tombol atau button bertuliskan upload now, kemudian klik tombol atau button bertuliskan select photos and videos dan pilih gambar yang telah anda buat tadi yang tersimpan dalam folder favicon di drive D komputer anda tunggu beberapa saat sampai proses unggah gambar favicon blog anda selesai di lakukan kemudian klik tombol atau button save

19. Kemudian setelah proses upload atau pengunggahan selesai di lakukan silahkan klik pada gambar yang telah anda upload tadi kemudian klik di dalam kotak di sebelah kanan tulisan direct link, setelah anda klik dalam kotak maka otomatis akan melakukan perintah copy

2o. Berikutnya adalah pastekan kode tersebut di atas pada notepad atau microsoft window terserah anda

21. Langkah selanjutnya adalah silahkan anda kunjungi situs www.blogger.com, kemudian login, setelah anda login silahkan anda pilih blog yang akan anda pasang favicon ini tentu saja kalau anda mempunyai banyak blog dengan banyak tulisan, namun kalau anda hanya mempunyai satu blog saja lanjutkan dengan meng klik button atau tombol bertuliskan rancangan lalu klik tulisan edit HTML, kemudian centang dalam kotak di sebelah kiri tulisan expand template widget, kemudian tekan tombol CTRL+F pada keyboard komputer anda dan copy serta pastekan kode di bawah ini :


<body>


tepat di dalam kotak di sebelah kanan tulisan find, setelah kode yang di maksud yaitu
<body>ketemu silahkan anda klik tepat di bawah
<body> langkah selajutnya adalah silahkan anda copy kode di bawah ini :


<link href='http://ganti dengan kode link yang telah anda pastekan pada notepad ( langkah no 20)' rel='shortcut icon'/>


dan pastekan tepat di bawah <body> kode akhirnya akan menjadi seperti di bawah ini :


<link href='http://ganti dengan kode link yang telah anda pastekan pada notepad ( langkah no 20)' rel='shortcut icon'/>
<body>


22. Kemudian klik tombol atau button pratinjau dan pastikan gambar favicon yang telah anda buat sendiri telah terpasang dengan baik, kalau sampai pada langkah ini anda berhasil maka gambar faviconnya akan tampak seperti gambar di bawah ini :



Silahkan and klik untuk memperbesar dan perhatikan betul keberadaan gambar tersebut di atas tepat di dalam kotak kecil di sebelah kiri address bar dari web browser anda kemudian klik tombol atau butto simpan template

23. Selesai silahkan and sign out semua akun yang tadi anda buka, selamat mencoba dan semoga bermanfaat