Cara Menambahkan Favicon ke Situs WordPress Anda

Favicon, atau ikon favorit, adalah gambar kecil di sebelah judul halaman pada tab browser. Ikon situs ini memainkan peran penting dalam membangun identitas situs web Anda.

Jika Anda memiliki situs web profesional, pertimbangkan untuk menggunakan favicon jika Anda belum melakukannya. Di sini, kita akan membahas pentingnya itu dan hal-hal yang perlu dipertimbangkan saat menyiapkannya. Kami juga akan menunjukkan kepada Anda tiga metode tentang cara menambahkan favicon ke situs web WordPress Anda.

Mengapa Anda Harus Menggunakan Favicon?

Untuk menunjukkan pentingnya favicon, lihat tangkapan layar di bawah ini.

Seperti yang Anda lihat, setiap tab memiliki ikon berbeda yang membedakan halaman web yang Anda kunjungi. Ketika Anda memiliki banyak tab di browser Anda, favicon membantu Anda mengidentifikasi halaman ini. Hasilnya, ini menciptakan pengalaman pengguna yang lebih baik.

Favicon tidak hanya berguna di tab browser. Saat pengguna menambahkan pintasan halaman ke layar beranda seluler atau desktop, favicon akan ditampilkan di layar. Selain itu, favicon dapat bekerja mirip dengan logo. Saat orang melihatnya, mereka akan langsung mengenali situs web dan merek Anda.

Mempersiapkan Favicon Anda

Cara tercepat dan termudah untuk membuat favicon adalah dengan menggunakan generator favicon. Tidak perlu memiliki pengetahuan teknis karena kebanyakan dari mereka menyediakan gambar siap pakai yang hanya perlu Anda ubah sedikit.

Pertimbangkan untuk menggunakan logo merek Anda juga, tetapi pastikan logo tersebut dapat dipotong menjadi ikon persegi. Itu juga harus terlihat cukup sederhana sehingga Anda dapat melihatnya dengan jelas meskipun ukurannya kecil. Gunakan program pengeditan gambar seperti Photoshop, DesignWizard, atau GIMP untuk memodifikasi dan mengubah ukuran logo Anda.

Untuk format gambar, disarankan untuk menggunakan file ICO karena sebagian besar browser mendukungnya. Namun, tidak semua perangkat lunak pengedit foto memungkinkan Anda membuat file ICO. Oleh karena itu, lebih baik menggunakan generator favicon online yang menyediakan opsi tersebut. Atau, simpan gambar Anda sebagai PNG dan gunakan konverter ICO online. Biasanya, ukurannya harus 16 x 16 piksel.

Jika Anda menggunakan fitur Ikon Situs WordPress 4.3, Anda tidak perlu khawatir untuk mengonversi gambar Anda terlebih dahulu. Sekarang Anda dapat mengunggah file gambar apa pun sebagai favicon Anda. Apapun, selalu pastikan bahwa itu dapat dilihat di browser apa pun setelah mengunggahnya.

3 Cara Menambahkan Favicon ke Situs WordPress Anda

Ada tiga metode di mana Anda dapat menambahkan favicon ke situs web Anda, pilih opsi mana pun yang Anda inginkan.

Opsi 1: Penyesuai WordPress

Untuk pengguna WordPress 4.3, menggunakan fitur Ikon Situs adalah cara yang paling nyaman dan direkomendasikan untuk menambahkan favicon Anda.

Siapkan gambar persegi dengan tinggi dan lebar minimal 512 piksel. File tidak boleh melebihi 128 MB. Jika Anda memiliki gambar persegi panjang, mereka akan memungkinkan Anda untuk memotongnya saat Anda mengunggah favicon Anda.

Setelah gambar Anda siap, ikuti langkah-langkah ini:

1. Buka Dashboard WordPress Anda, pergi ke Appearance, dan pilih Customize.

2. Cari tab yang berisi Ikon Situs. Sebagian besar tema akan memilikinya di Identitas Situs, tetapi beberapa mengganti nama tab menjadi Judul Situs, Nama Merek, Logo dan Tajuk Situs, dll.

3. Pilih Ikon Situs dan pilih gambar dari Pustaka Media Anda atau unggah file baru.

4. Anda akan diarahkan ke editor Pangkas Gambar. Sesuaikan posisi dan proporsi yang Anda inginkan.

5. Selamat! Anda harus memiliki favicon baru. Jika belum muncul, WordPress merekomendasikan untuk mengosongkan cache dan memulai ulang browser Anda.

Opsi 2: Menggunakan Plugin

Jika Anda belum memperbarui WordPress, Anda dapat menggunakan plugin untuk menambahkan favicon .

Beberapa plugin memberi Anda kontrol lebih besar atas tampilan favicon Anda di perangkat non-desktop. Misalnya, Favicon oleh RealFaviconGenerator memberi Anda opsi untuk menyesuaikan tampilan ikon Anda di sistem operasi yang berbeda.

Untuk menggunakan plugin, lakukan langkah-langkah berikut:

1. Buka Plugin dan klik Add New di dashboard WordPress Anda.
2. Cari Favicon oleh RealFaviconGenerator, lalu Instal dan Aktifkan plugin.
3. Pilih Penampilan dan klik Favicon dari dasbor. Unggah gambar persegi yang lebih besar dari 70 x 70 piksel. Idealnya, gambar harus berukuran 260 x 260 piksel atau lebih.
4. Anda akan diarahkan ke halaman tempat Anda dapat mengatur tampilan favicon di iOS, Android Chrome, Windows, dan Safari. Kemudian klik Hasilkan Favicons dan kode HTML Anda.

Selain plugin tersebut, Anda dapat menggunakan All in One Favicon. Plugin ini memungkinkan Anda untuk mengatur favicon yang berbeda untuk back end dan front end. Dengan cara ini, Anda tidak akan bingung ketika situs web dan dasbor Anda terbuka.

Opsi 3: Instalasi Manual melalui Klien FTP

Metode lain adalah dengan mengunggah favicon Anda secara manual ke situs WordPress Anda. Untuk ini, Anda perlu menghubungkan situs web Anda ke klien FTP seperti FileZilla. Ikon Anda bisa dalam format ICO atau PNG dan harus diberi nama favicon.

Anda juga sangat disarankan untuk membuat tema anak untuk menggunakan metode ini. Dengan begitu, perubahan kode Anda tidak akan dihapus saat ada pembaruan tema baru.

Saat situs Anda terhubung, lakukan langkah-langkah berikut:

1. Unggah file favicon Anda ke folder tema Anda saat ini melalui klien FTP Anda. Jika Anda menggunakan tema anak, unggah ke folder itu.
2. Tambahkan file yang sama ke direktori root Anda. Itu harus berada di folder yang sama dengan wp-content dan wp-admin Anda. Ini untuk memastikan favicon Anda dapat dilihat di pembaca feed.
3. Di Dasbor WordPress Anda, buka Penampilan dan klik Editor Tema.
4. Sekarang, pilih file Tema Header dan tambahkan kode ini di bawah ini di dalam tag jika Anda memiliki file ICO:

<link rel=”ikon pintasan” href="<?php echo get_stylesheet_directory_uri(); ?>/favicon.ico” />

Ganti bagian setelah href= sampai /favicon.ico dengan path ke direktori root Anda. Ini akan terlihat seperti ini:

<link rel=”ikon pintasan” href=”<http://www.namadomainanda.com/favicon.ico” />

Jika Anda memiliki file PNG, cukup ganti format file. Kemudian Perbarui File.

5. Segarkan situs web Anda. Jika berhasil, Anda seharusnya sudah memiliki favicon baru sekarang.

Untuk semua metode, jangan lupa untuk memeriksa tampilan favicon Anda di perangkat seluler. Buka situs web Anda dari browser seluler dan tambahkan situs ke layar beranda.

Meskipun kecil, favicon dapat meningkatkan pengenalan merek dan menciptakan pengalaman pengguna yang lebih baik. Anda dapat menggunakan generator favicon online atau perangkat lunak pengedit gambar pilihan Anda untuk membuat favicon Anda sendiri. Jika Anda sudah memilikinya, tambahkan saja ke situs WordPress Anda menggunakan salah satu dari tiga metode di atas. Semoga beruntung!

Baca lebih lanjut Plugin dan Tema Populer untuk Situs Web LMS WordPress