HOTLINE

(0275) 2974 127

CHAT WA 24/7
0859-60000-390 (Sales)
0852-8969-9009 (Support)
Wordpress

Membuat Favicon pada Website WordPress & Blog

Tahukah Anda apa itu favicon? Mungkin diantara Anda ada yang belum mengetahui tentang favicon. Baik Anda sebagai pelaku blogger atau bahkan pelaku bisnis yang harus berkecimpung di dunia internet tapi belum mengetahui apa itu favicon. Favicon merupakan kependekan dari favorite icon atau gambar ikon website yang berfungsi sebagai identitas visual website, favicon biasanya muncul di tab dan bookmark browser.

Pengguna website pasti memiliki logo sendiri yaitu dengan faviconnya sendiri. Jadi jika Anda ingin membuat website Anda setidaknya harus memiliki favicon yang akan menjadikan ciri dari website Anda. Terlebih dengan adanya favicon akan membuat website Anda menjadi lebih profeisonal.

 

Pengertian Favicon

Favicon menurut Wikipedia adalah ikon utama yang muncul pada address bar suatu laman web dan merupakan logo dari laman tersebut, juga dikenal sebagai shortcut icon, website icon, URL icon atau bookmark icon.

 

Cara Membuat Favicon pada WordPress

  1. Membiarkan browser secara otomatis mengambil favicon (tanpa mengubah code)

  • Anda harus memiliki gambar berukuran dimensi persegi 1:1 dengan format (jpeg, bmp, gif, png) .

Gambar tidak harus berbentuk persegi, namun tampilannya akan kurang professional.

  • Anda harus mengkonversi gambar menjadi format .ico.

Ada banyak tools yang dapat Anda gunakan untuk membuat gambar dengan format .ico

  • Jika Anda sudah mengkonversikan gambar Anda, maka selanjutnya adalah Anda tinggal mengupload file ke direktori dimana file website Anda.

Anda dapat menggunakan File Manager atau aplikasi FTP.

Pada hosting berbasis Linux, direktori biasanya adalah public_html, namun bisa juga berbeda tergantung konfirmasi Anda atau penyedia layanan hosting Anda.

Ketika file favicon.ico selesai di upload bersama dengan file website Anda lainnya, browser akan langsung mengenali file tersebut dan menampilkan di browser.

  1. Menggunakan gambar umum dan memanggilnya di dalam kode website

Jika dengan mengkonversi gambar terlalu repot, Anda dapat menggunakan gambar umum sebagai favicon untuk website Anda.

  • Gambar Anda harus berukuran dimensi persegi 1:1 (format jpeg, bmp, gif, png).
  • Upload ke direktori dimana website Anda berada

Jika hosting berbasis Linux, direktori biasanya adalah public_html.

  • Anda harus menentukan gambar yang ingin Anda gunakan sebagai facvion, di kode website Anda. Tambahkan tag <head></head> seperti kode dibawah ini.

Kode HTML akan terlihat seperti dibawah ini

Jika sudah maka akan muncul favicon seperti ini pada website Anda

 

Cara Membuat Favicon Blog

  1. Anda siapkan gambar yang akan Anda jadikan sebagai favicon
  2. Masuk ke favicon.co.uk
  3. Masukkan gambar Anda pada menu Browser
  4. Ukuran favicon 16×16 pixel
  5. Klik Generate Favicon

  1. Download favicon pada menu Download Your Favicon Here kemudian tersimpan dengan nama favicon.ico

  1. Pasang favicon pada blog Anda
  • Login ke blogger, kemudian pilih layout atau tata letak
  • Upload gambar favicon.ico Anda tadi kemudian klik Save

 

Diatas adalah cara membuat favicon pada website blog dan WordPress yang dapat Anda coba untuk membuat favicon Anda sendiri. Dengan adanya favicon yang menarik akan menjadikan website Anda menjadi lebih professional. Semoga artikel ini menambahkan wawasan dan perpustakaan Anda.

 

Terimakasih

 

Semoga Bermanfaat 😀

Jadilah yang pertama untuk memberi nilai
Inu R

Recent Posts

Ingin Membuat Website E-Commerce Yang Menarik? Perhatikan Tips Ini

Design website toko online tidak hanya soal estetika, tapi juga UX yang bagus secara keseluruhan.…

22 hours ago

Apa Saja Jenis Proyek yang Bisa Dikerjakan UX Designer? Yuk Simak Di Sini

Sebelum memulai karir Anda sebagai desainer UX, Anda harus membuat portofolio yang mencakup semua pengalaman…

2 days ago

Aktifkan Keep-Alive Untuk Meningkatkan Performa Website Anda

Keep-Alive memungkinkan browser pengunjung Anda mendownload semua konten (JavaScript, CSS, gambar, video, dll) melalui koneksi…

3 days ago

Baca Ini Untuk Pelajari Apa Saja Job Description Web Developer

Job description seorang web developer adalah membuat situs web menggunakan berbagai bahasa pemrograman. Tanggung jawab…

4 days ago

Rekomendasi Tools A/B Testing untuk Meningkatkan Conversion Rate

Secara default, WordPress tidak mendukung A/B testing. Tapi jangan khawatir. Di bawah ini, kami telah…

5 days ago

Ingin Menjadi UX Designer? Coba Pelajari Apa Saja Tugasnya!

UX design merupakan singkatan dari User Experience design atau desain pengalaman pengguna. Istilah ini sering…

7 days ago