Cara Menambahkan Favicon di WordPress

Sejak WordPress 4.3, core menyediakankan fitur Site Icon yang memotong, mengubah ukuran, dan memasukkan tag <link> yang benar untuk Anda. Tidak diperlukan plugin untuk situs standar.

Ikon yang diunggah disimpan di Perpustakaan Media dan direferensikan melalui wp_site_icon() di ujung depan. WordPress menghasilkan beberapa ukuran di sisi server saat Anda mempublikasikan.

Fitur ini menggantikan unggahan manual favicon.ico untuk sebagian besar blogger, agensi, dan toko WooCommerce.

Use our favicon generator, PNG to ICO converter, SVG to ICO converter, and live favicon tester to build and verify your icon set, and read the companion guide for a condensed walkthrough.

Di wp-admin, buka Penampilan → Kustomisasi → Identitas Situs → Site Icon.

Klik Pilih Site Icon dan unggah persegi PNG minimal 512×512 piksel. WordPress menampilkan pemangkas langsung — pusatkan tanda logo Anda di dalam area aman berbentuk persegi.

Klik Publikasikan. Core mengeluarkan ikon sentuh apel, berbagai ukuran PNG, dan tag meta pada pemuatan halaman front-end berikutnya.

Untuk ikon per bagian atau merek subdirektori, filter get_site_icon_url() di tema anak Anda functions.php.

Contoh kasus penggunaan: jaringan multisitus di mana setiap subsitus memerlukan tanda berbeda namun berbagi satu tema. Kembalikan URL yang berbeda berdasarkan blog_id.

Tim tingkat lanjut dapat menghapus meta ikon situs default dan mencetak tag <link> khusus di header.php, tetapi inti kerja duplikat tersebut sudah berfungsi dengan baik.

Blog tunggal: unggah 512×512 PNG melalui Customizer. Selesai — tanpa FTP, tanpa pengeditan .ico.

Toko WooCommerce: aliran yang sama; verifikasi ikon di halaman checkout dan akun, bukan hanya halaman beranda. Plugin cache terkadang menunda CSS tetapi jarang memblokir tag ikon.

WordPress tanpa kepala: Tag Site Icon hanya muncul di halaman yang dirender dengan PHP. Front end Next.js Anda harus mendeklarasikan tag <link> miliknya sendiri dalam arsitektur tersebut.

Pementasan → produksi: unggah ulang atau migrasikan ID media. URL ikon absolut hardcode hanya jika Anda memahami pembatalan cache CDN.

Plugin SEO populer juga dapat menampilkan pengaturan favicon. Hindari mengonfigurasi plugin SEO dan Site Icon secara berbeda — pilih satu sumber kebenaran.

Plugin caching (WP Rocket, W3 Total Cache) tidak boleh memblokir file ikon, tetapi mereka dapat melakukan cache HTML tanpa tag baru hingga pembersihan.

Plugin Favicon masuk akal sebelum WordPress 4.3. Pada tahun 2026, ikon tersebut mubazir kecuali Anda memerlukan pertukaran ikon animasi atau terjadwal.

Jenis file apa yang harus saya unggah? PNG paling aman. WordPress menerima JPG, tetapi Anda kehilangan transparansi.

Ukuran minimal? 512×512 secara resmi; sumber yang lebih besar menurunkan skalanya dengan baik.

Apakah WordPress membuat favicon.ico? Ini memancarkan ukuran PNG dan tag meta. Browser masih mendapatkan keuntungan dengan menempatkan .ico asli di root web melalui hosting atau tema anak.

Multisitus: setiap situs memiliki Site Icon-nya sendiri di Customizer-nya sendiri. Admin jaringan menetapkan per situs kecuali tema memfilter URL secara global.

Browser menyimpan cache favicon secara terpisah dari HTML. Setelah dipublikasikan di WordPress, muat ulang atau uji di jendela pribadi.

Tambahkan ?ver=2 ke URL ikon hanya jika Anda menggunakan tag secara manual. URL Site Icon menyertakan argumen kueri yang berubah saat Anda mengunggah ulang.

Hapus cache objek WordPress dan CDN apa pun (Cloudflare, Jetpack Boost) jika HTML masih mereferensikan URL lampiran lama.

Jika Anda memigrasikan domain, telusuri database untuk URL ikon lama dalam opsi serial — beberapa importir kehilangan siteicon_id.

Ikon buram setelah diunggah: gambar sumber lebih kecil dari 512×512 atau tidak persegi. Regenerasi dari master yang lebih besar.

Tidak ada ikon di hasil Google: Google menggunakan cache-nya sendiri; meminta pengindeksan ulang di Search Console setelah memperbarui Site Icon.

Ikon di desktop tetapi bukan iPhone: iOS memerlukan ikon sentuh apel; konfirmasi Site Icon diterbitkan, tidak hanya disimpan sebagai draf di Customizer.

Kotak putih di sekeliling logo: diunggah JPG dengan latar belakang putih, bukan PNG transparan.

Host WordPress yang dikelola (WP Engine, Kinsta, SiteGround) menyimpan cache HTML di edge. Setelah mengubah Site Icon, bersihkan semua cache dari dasbor host.

Proksi cloudflare oranye-awan dapat melakukan cache HTML tanpa melakukan cache /wp-content/uploads/ ikon — biasanya baik-baik saja, tetapi akan dihapus ketika URL lampiran ikon berubah.

Plugin multibahasa (WPML, Polylang) tidak menduplikasi Site Icon per bahasa secara default. Satu ikon melayani semua lokal kecuali Anda memfilter URL.

Penyiapan batuan dasar atau tanpa kepala dapat memindahkan lokasi unggahan. Konfirmasikan URL media di titik front-end HTML di mana CDN Anda mengharapkannya.

Jika Anda melayani ekspor statis (Simply Static, WP2Static), buat ulang ekspor setelah ikon berubah sehingga HTML offline mengambil ID lampiran baru.

Hanya pengguna dengan kemampuan penyesuaian (biasanya Administrator dan Editor pada instalasi standar) yang dapat mengubah Site Icon. Penulis tidak dapat menukar merek tanpa hak yang lebih tinggi.

Di multisitus, Admin Super dapat mengunggah tema seluruh jaringan tetapi Site Icon tetap per situs kecuali kode khusus membagikan satu URL lampiran.

Audit tema admin pihak ketiga yang menyembunyikan Penampilan → Sesuaikan. Anda mungkin perlu mengaktifkan kembali Customizer atau menggunakan deep link Customizer ?autofocus[section]=title_tagline.

Saat menyerahkan situs ke klien, dokumentasikan bahwa perubahan favicon ada di Sesuaikan, bukan di Perpustakaan Media saja — mengunggah PNG di sana tanpa menetapkan Site Icon tidak akan menghasilkan apa-apa.

Pembayaran WooCommerce menggunakan kepala tema yang sama dengan toko lainnya. Site Icon muncul di halaman keranjang dan terima kasih secara otomatis.

Plugin keanggotaan yang menggantikan templat front-end harus tetap memanggil wp_head() sehingga keluaran meta Site Icon.

Portal klien berlabel putih terkadang menghilangkan kaitan pencitraan merek — verifikasi bahwa kemampuan penyesuaian tidak dinonaktifkan pada peran pelanggan jika klien mengunggah ikon mereka sendiri.

Template email tidak menggunakan Site Icon. Logo email WooCommerce adalah pengaturan terpisah di bawah Penampilan → Kustomisasi → WooCommerce.

Jika sebelumnya Anda mengunggah favicon.ico melalui FTP ke root web, Site Icon tidak akan menghapusnya. Browser mungkin lebih memilih satu sumber dibandingkan sumber lainnya secara tidak terduga.

Pilih satu pendekatan: andalkan keluaran Site Icon PNG atau pertahankan ICO buatan tangan dengan desain yang serasi. Hapus duplikat setelah QA.

Tema klasik dengan tautan hardcode rel=icon di header.php mungkin melawan inti Site Icon. Hapus tag manual saat mengaktifkan Site Icon.

Setelah migrasi, bersihkan cache dan uji dalam penjelajahan pribadi untuk melihat ikon mana yang menang.

Dokumentasikan pendekatan yang dipilih di runbook Anda sehingga pengembang berikutnya tidak menambahkan plugin favicon kedua yang bertentangan.