Cara Mengganti Favicon di Joomla Secara Mudah

Favicon adalah sebuah icon atau gambar kecil yang tampil di pojok kiri address bar di browser. Ketika Anda menginstal Joomla untuk pertama kalinya, favicon di situs Anda akan secara default menggunakan favicon Joomla, sesuai dengan yang terdapat dalam template bawaannya. Dalam artikel ini, kami akan berbagi cara mengganti favicon di Joomla secara mudah.

Sebelum kami bahas cara mengganti favicon di Joomla, terlebih dahulu kami akan menjelaskan tentang apa itu favicon dan fungsinya. Simak informasi berikut ini.

Apa itu Favicon

Favicon adalah singkatan dari Favorite Icon yang bisa diartikan sebagai sebuah gambar atau icon untuk menujukkan identitas dari sebuah website. Favicon biasanya ditemukan di sitebar website terutama bagian kiri dan berukuran kecil. Anda dapat melihat contohnya seperti berikut

Favicon dapat Anda buat atau edit sesuai dengan website yang Anda pakai. Pada artikel ini kami akan fokus pada cara mengganti favicon joomla. Untuk joomla yang kami gunakan adalah versi latest atau terbaru yaitu Joomla 5. Silahkan menyimak informasi langkah-langkahnya.

Baca juga artikel : Favicon: Arti, Fungsi, hingga Cara Menambahkannya di Website

Mengganti Favicon Joomla

Berikut adalah cara mengganti favicon Joomla versi 5 secara mudah.

Step 1. Membuat file favicon

Pastikan Anda telah menyiapkan logo website Anda. Logo bisa berupa gambar dengan ekstensi .jpg atau .png. Setelah logo siap, silahkan akses favicon generator untuk membuat file favourite icon.

Klik ‘Choose image to upload‘ lalu pilihlah ukuran icon 16×16 px atau 32×32 px dan klik tombol create favicon untuk pembuatannya. Setelah itu tunggu sebenar, dan akan muncul tombol download. Secara otomatis, anda akan dibuatkan file dengan nama favicon.ico yang bisa Anda gunakan sebagai favicon pada website. Jangan lupa untuk mendownload hasilnya ke komputer.

Step 2. Mengganti favicon di Joomla

Setelah file favicon.ico siap, selanjutnya Anda dapat mengupload file tersebut ke hosting melalui cPanel. Langkahnya sebagai berikut :

1. Login ke cPanel hosting Anda.
2. Klik menu File manager di cPanel lalu masuk ke directory public_html.

3. Sebelum menuju lokasi folder template, silahkan login dahulu ke halaman admin Joomla dengan mengakses namadomain-Anda/administator lalu masuk ke menu System > Site Template Styles untuk melihat nama template yang aktif.

4. Pada panduan ini, template yang aktif bernama Cassiopeia. Setelah ditemukan template aktif, silahkan kembali ke cPanel di bagian File Manager.

5. Upload gambar favicon.ico yang baru ke folder template yang digunakan dan replace (hapus) favicon.ico yg lama. Pastikan upload juga di folder template yang berada di dalam folder administrator. Letak upload file favicon:

/templates/namatemplate/

dan

/administrator/template/namatemplate/

Pastikan upload file favicon.ico sesuai dengan nama templates yang Anda gunakan.

6. Setelah diupload, dapat dicoba akses website. Jika favicon yang baru belum tampil, maka bisa mencoba dengan masuk ke templates/nama-template-Anda/index.php dan perhatikan baris seperti berikut:

Pada informasi gambar di atas, terdapat lokasi dimana favicon berada. Jika dari template yang kami gunakan, favicon lain bernama joomla-favicon.svg dan joomla-favicon-pinned.svg.

Untuk menemukannya, Anda dapat mencarinya di kolom pencarian dan upload file baru dengan nama yang sama dengan informasi di baris.

// Browsers support SVG favicons

Setelah mendapatkan lokasi file berada, silahkan upload file gambar untuk favicon di lokasi tersebut. Jika pada templates yang kami gunakan menuju ke directory /media/system/images

7. Opsi lain jika setelah upload file favicon tambahan dan tidak kunjung berubah tampilan faviconnya, Anda dapat masuk kembali ke file index.html di folder templates Anda. Klik kanan dan pilih edit.

8. Cari baris seperti panduan nomor 6 bernama // Browsers support SVG favicons dan tambahkan tanda # di depan $this->addHeadLink. Pastikan yang ada tulisan favicon.ico jangan diberi tanda # di depannya. Contoh jelasnya seperti berikut:

9. Jika sudah, silahkan mencoba refresh atau akses dari tab baru atau mode incognito atau browser lain untuk melihat hasilnya.

Demikian panduan mengganti favicon pada Joomla, semoga bisa membantu.