Add a Favicon to Your WordPress Site (The Right Way)
A missing favicon makes your site look unfinished. Here's how to add one properly in WordPress — covering browser tabs, bookmarks, and mobile home screens.
Open 10 browser tabs. The sites without favicons are instantly obvious — they show a generic globe or blank icon. It’s a small detail that signals “this site isn’t finished” or “nobody’s paying attention.”
WordPress has built-in favicon support since version 4.3, but many sites still miss it — either because the owner didn’t know about the setting, or because their theme doesn’t support it properly.
What is a favicon?
A favicon (short for “favorites icon”) is the small icon that appears in browser tabs, bookmark lists, history, and mobile home screens when someone saves your site. It’s usually 16×16 or 32×32 pixels in browser tabs, but modern devices use larger sizes (180×180 for Apple, 192×192 for Android).
The quick fix — use WordPress’s built-in feature
WordPress has native Site Icon support. Go to Appearance → Customize → Site Identity → Site Icon. Upload a square image at least 512×512 pixels. WordPress automatically generates all the required sizes.
That’s it. No code needed. WordPress handles the <link> tags for different devices.
If your theme doesn’t support the Customizer or you want code-level control:
// Add favicon via code
add_action( 'wp_head', function() {
$icon_url = get_theme_file_uri( 'images/favicon.png' );
echo '<link rel="icon" href="' . esc_url( $icon_url ) . '" sizes="32x32" />';
echo '<link rel="icon" href="' . esc_url( $icon_url ) . '" sizes="192x192" />';
echo '<link rel="apple-touch-icon" href="' . esc_url( $icon_url ) . '" />';
});The one-click solution
Ovanap Admin Toolkit includes Custom site favicon under Admin Toolkit → Features → Admin UI for cases where the Customizer isn’t accessible. Upload a square image (512×512 PNG recommended) and save. If the image is in your Media Library, the toolkit also sets it as the WordPress Site Icon; it adds the icon tags on the front end and in the admin.
What happens after you fix this?
- Your brand icon appears in browser tabs — instant recognition
- Bookmarks and favorites show your icon — professional appearance
- Mobile home screen icons work when visitors save your site
- No more generic globe icon signaling an unfinished site
FAQ
What format should my favicon be?
PNG is the safest choice — universally supported. ICO format is legacy but still works. SVG favicons are supported in modern browsers but not universally. For maximum compatibility, use a 512×512 PNG and let WordPress generate the sizes.
Why isn’t my favicon showing up?
Clear your browser cache — favicons are aggressively cached. Try visiting your site in an incognito window. If it still doesn’t show, verify the file exists at the URL WordPress generated (usually in /wp-content/uploads/).
Do I need different sizes for different devices?
WordPress’s Site Icon feature handles this automatically when you upload a 512×512 image. It generates 32×32, 180×180, 192×192, and other required sizes. If you’re doing it manually, provide at least 32×32 (browsers) and 180×180 (Apple devices).
Related reads: