Mwkhi54l4AT71A9SPj2FMDVTdJ7sCX4vtnoXHfCo
Cara Membuat Favicon Blogger Agar Tidak Pecah atau Burik

Iklan 728x90

Cara Membuat Favicon Blogger Agar Tidak Pecah atau Burik

Blogger profesional pasti ngga mau kan kalo icon yang sudah cape cape didesain buat bikin kece blog nya, eh pas dipasang malah burik, jadi rada culun begitu wkwkwk ngga ngatain dong, ini aja aku baru nemu caranya, sumpah di google jarang banget orang ngebahas ini, kebanyakan cuma ngasih tau cara mengubah favicon lewat tata letak, itu mah pasti kebanyakan orang sudah bisa, ini masalahnya burik sangat kalo cuma mengganti lewat situ, padahal resolusi icon yang kita buat udah lumayan gede jernih dan menggemaskan.



caratuh gini loh...

#1 Desain Favicon nya dulu

Yang ini pasti dong mas/mba, kalo ngga di desain, mau ngambil dimana? nyolong, gaboleh tau. kalau buat referensi bisa dicari di google, banyak banget, atau mau liat favicon punyakuh? wehehhe maskot baru loh.


Perlu diingat, untuk pembuatan favicon, usahakan tinggi dan lebarnya sama ya, misalnya seperti punyaku ini berdimensi 1080x1080 pixel dan format nya .png atau .ico biar background nya transparan. 

#2 Pakai www.favicon-generator.org


Disini kamu tinggal upload gambar .png mu dan langsung pilih create favicon nantinya bakal jadi kaya gini


tinggal kamu klik Download The Generated Favicon dan kamu bakal dapat file zip berisi foto favicon kamu yang sudah dijadikan berbagai macam ukuran, tapi disana banyak banget, jadi aku saranin seperti punyaku aja, pilih yang 
- android-icon 192x192.png
- apple-icon 180x180.png
- ms-icon 144x144.png
- favicon 32x32.png

#3 Upload ke Halaman Blog kamu

Gunanya agar nanti kamu bisa dapet link gambar faviconmu, soalnya bakal dimasukin kedalam template bagian meta tag nya.

Tinggal kamu upload gambar gambar yang sudah dipilih diatas, dan salin alamat link gambar tersebut.



#4 Masukkan kedalam Edit HTML Template kamu

Setelah dapat link link dari gambar favicon yang sudah kamu upload, selanjutnya kamu masukkan ke code html yang sudah aku sediakan ini


<link expr:href='data:blog.homepageUrl + &quot;favicon.ico&quot;' rel='icon' type='image/x-icon'/>
<link href='link foto favicon-32x32.png' rel='icon' sizes='32x32'/>
<link href='link foto android-icon-192x192.png' rel='icon' sizes='192x192'/>
<link href='link foto apple-icon-180x180.png' rel='apple-touch-icon' sizes='180x180'/>
<meta content='link foto ms-icon-144x144.png' name='msapplication-TileImage'/>


Caranya kamu buka Tema > Edit HTML dan letakkan dibawah kode <head>
kalau kesulitan menemukan kode tersebut kamu bisa pakai cara mudah dengam menekan ctrl + f maka akan muncul kolom search, tinggal di masukin deh kodenya lalu enter 


#5 Ganti Favicon di Tata Letak juga

ini penting juga sih, caranya kamu tinggal masuk ke dasboard blogger, pilih tata letak, diatas nanti ada kolom Favicon, tinggal edit, dan upload deh foto Favicon-32x32.png 




Selesai deh, sekarang Icon blog kamu ngga akan burik atau ngeblur, baik itu dibuka lewat smartphone ataupun laptop. yee selamat jadi profesional hahaha.

Baca Juga
SHARE
Man
seorang mahasiswa semester akhir yang suka mengumbar senyum, kemesraan, dan kebucinan bersama kucing. sangat menyukai nasi goreng, kota Bandung, dan kamu.

Related Posts

Subscribe to get free updates

Posting Komentar

Iklan Tengah Post

Iklan 300x250