WordPress Favicon Not Showing or Updating? How to Fix It

Have you uploaded a favicon to your WordPress website, but it still does not appear in your browser tab or Google search results?

Maybe you changed your site icon several days ago, but your browser continues showing the old version. Or perhaps the favicon appears correctly in WordPress settings, yet visitors still see a generic globe icon next to your website’s name.

This can be confusing because a favicon may work in one browser but not another. It might appear on desktop but remain missing on mobile, or display correctly in browser tabs while Google continues using an outdated icon.

The problem is not always caused by WordPress itself. Browser caching, CDN settings, conflicting favicon tags, incorrect image paths, and Google’s crawling process can all affect how your site icon appears.

The good news is that most WordPress favicon problems can be diagnosed without changing your theme or rebuilding any part of your website.

In this guide, you will learn why your WordPress favicon is not showing or updating, how to fix common browser and caching issues, and what to check when Google displays the wrong favicon.

What Is a WordPress Favicon?

A favicon is a small image that represents your website in browsers and other interfaces.

WordPress typically refers to this image as the Site Icon.

Depending on the browser, device, and platform, a favicon may appear in:

• Browser tabs.
• Bookmarks and saved pages.
• Browser history.
• Mobile shortcuts.
• Google search results.

Your favicon is different from your website logo.

A website logo usually appears in the header and may contain a symbol, text, or both. A favicon is designed to remain recognizable at much smaller dimensions.

For example, a business might use its complete logo in the website header but display only its brand symbol in the browser tab.

Simple shapes, clear contrast, and recognizable branding generally work better than detailed graphics.

What Size Should a WordPress Favicon Be?

WordPress recommends using a square image that is at least 512 × 512 pixels when setting a Site Icon.

This gives WordPress a suitable source image for generating smaller icon sizes.

Common favicon dimensions include:

• 16 × 16 pixels for small browser interfaces.
• 32 × 32 pixels for browser tabs and bookmarks.
• 48 × 48 pixels for certain browser and search applications.
• 192 × 192 pixels for some mobile and web app uses.
• 512 × 512 pixels as a high-resolution source image.

You do not necessarily need to upload each size manually.

WordPress can generate the appropriate image sizes from your original Site Icon, depending on your setup.

For most websites, a square PNG image with a simple design is a reliable starting point.

1. Check Whether Your Favicon Is Properly Set in WordPress

Before investigating technical issues, confirm that your favicon is actually configured.

Depending on your WordPress theme, the Site Icon setting may be located in different areas.

For Classic WordPress Themes

Navigate to:

Appearance → Customize → Site Identity

Look for the Site Icon option.

Confirm that the correct image is selected.

If no image is assigned, upload your favicon and publish the changes.

Some themes may place this setting in a slightly different location.

For Block Themes

If your website uses a modern block theme, the Site Icon may be managed through the Site Editor.

Navigate to:

Appearance → Editor

Open the relevant header template or template part and check the Site Logo block settings.

WordPress supports using the Site Logo block to configure the site icon in supported setups.

The exact controls depend on your WordPress version and theme.

Check Theme-Specific Settings

Some premium themes provide their own favicon or branding settings.

If you previously configured a favicon through your theme, check whether that option is still active.

Ideally, your website should have one clear source responsible for its favicon configuration.

Multiple plugins or theme settings attempting to manage the same icon can create conflicting HTML declarations.

After confirming the settings, open your website in a new browser tab and check whether the favicon appears.

2. Clear Your Browser Favicon Cache

Browser caching is one of the most common reasons a favicon does not update.

Browsers often store favicon files locally so they do not need to download them every time you visit a website.

This improves browsing performance, but it can also cause an outdated favicon to remain visible after you replace the original image.

Unlike ordinary website images, favicon caching can sometimes persist even after a standard page refresh.

Test in Incognito Mode

Start with a simple test:

• Open your browser.
• Launch a new incognito or private window.
• Visit your WordPress website.
• Check the favicon in the browser tab.

If the correct icon appears in private browsing but not in your regular browser session, local browser caching is a likely explanation.

However, private browsing does not guarantee that every cache layer has been bypassed.

Try Another Browser

Open your website in a different browser, such as Firefox, Chrome, Edge, or Safari.

If the favicon appears correctly in one browser but not another, the problem may be browser-specific.

You can also try clearing cached images and files in the affected browser.

Keep in mind that clearing browsing data may sign you out of websites or remove locally stored information, depending on the options selected.

Use a New Favicon Filename

If you replaced an existing favicon file while keeping the same URL, the browser may continue requesting the cached version.

For example, instead of reusing:

/wp-content/uploads/favicon.png

you could upload the updated icon under a new filename:

/wp-content/uploads/favicon-v2.png

Then assign the new image as your WordPress Site Icon.

A new URL can help browsers and caching systems recognize that the resource has changed.

This is often more reliable than repeatedly replacing a file at the same address.

3. Clear Your WordPress Cache

Even when the favicon image itself is correct, your WordPress caching plugin may continue serving an older version of the page’s HTML.

The HTML document may still reference the previous favicon URL.

If that happens, clearing your browser cache alone may not resolve the problem.

Clear LiteSpeed Cache

If you use LiteSpeed Cache, navigate to:

LiteSpeed Cache → Toolbox → Purge

Clear the relevant cached content.

Then reload your website in an incognito window.

Clear WP Rocket Cache

If your website uses WP Rocket, open:

Settings → WP Rocket

Use the Clear Cache option.

You can also access the cache controls through the WordPress admin toolbar.

Other Caching Plugins

The same principle applies to plugins such as:

• W3 Total Cache.
• WP Super Cache.
• FlyingPress.
• Other performance and caching solutions.

Clear the relevant page cache, then check whether your website’s HTML references the updated favicon.

If the favicon remains unchanged, continue with the next steps rather than repeatedly purging the cache.

4. Check Cloudflare and CDN Caching

If your website uses Cloudflare or another content delivery network, the favicon file or HTML document may be cached outside your WordPress hosting server.

A CDN stores website resources on distributed servers to improve loading performance.

However, outdated cached resources can sometimes remain available after you update the original file.

How to Check Cloudflare

Log in to your Cloudflare dashboard and select your domain.

Review the caching configuration and any custom Cache Rules.

If necessary, purge the affected favicon URL and relevant HTML cache.

A full cache purge is usually unnecessary when the problem affects only one resource.

If you use Cloudflare’s cache rules to cache HTML, verify that the updated page markup is reaching visitors.

Check Other CDN Providers

The same troubleshooting approach applies to other CDN services.

Look for features such as:

• Purge URL.
• Invalidate cache.
• Clear edge cache.
• Cache rules.

After clearing the relevant cached resources, test the favicon again.

Remember that a CDN purge does not necessarily clear the favicon already stored in a visitor’s browser.

5. Check Whether the Favicon URL Is Accessible

Sometimes the favicon is correctly assigned in WordPress, but the image file cannot be loaded.

This may happen after a website migration, domain change, media library modification, or server configuration update.

Find the Favicon URL

Open your website in Chrome.

Right-click the page and select:

View Page Source

Search for:

rel="icon"

You may find HTML similar to:

<link rel="icon" href="https://example.com/wp-content/uploads/site-icon.png" sizes="32x32">

The exact markup may differ depending on your theme and WordPress configuration.

Copy the URL from the href attribute and open it directly in a new browser tab.

What Should Happen?

The image should load successfully.

If you see a 404 error, the referenced file may have been deleted, moved, or renamed.

If you see a 403 error, a security rule or file permission issue may be preventing access.

If the URL redirects unexpectedly, investigate your domain and HTTPS configuration.

You can also inspect the request in your browser’s Network tab.

A successful image request normally returns an HTTP 200 response with an appropriate image content type.

Fix a Broken Favicon URL

If the favicon URL is incorrect:

1. Open the WordPress Site Icon settings.
2. Remove the existing image selection.
3. Upload or select the correct image.
4. Save the changes.
5. Clear the relevant caches.
6. Check the new favicon URL.

If the file itself is missing, upload a replacement rather than manually editing database references without understanding their dependencies.

6. Check for Duplicate or Conflicting Favicon Tags

Some WordPress websites output multiple favicon declarations.

This can happen when the favicon is configured through WordPress, a theme settings panel, and a third-party plugin at the same time.

For example, your page source might contain:

<link rel="icon" href="/uploads/old-icon.png">
<link rel="icon" href="/uploads/new-icon.png">

Browsers may select different icons depending on declared sizes, formats, and their own selection behavior.

Multiple favicon declarations are not automatically wrong.

Websites can legitimately provide several icon sizes and formats.

The problem occurs when different declarations point to outdated or inconsistent branding.

How to Identify Conflicts

Open your website’s page source.

Search for:

rel="icon"

Also look for:

rel="shortcut icon"

Review the URLs associated with these declarations.

Check whether they all belong to the intended favicon set.

Where Conflicting Tags May Come From

Common sources include:

• WordPress Site Icon settings.
• Theme branding options.
• Custom code added to the header.
• Header and footer code plugins.
• Older favicon plugins.
• Custom child theme modifications.

If you find conflicting declarations, identify which feature is generating each one.

Remove outdated or unnecessary declarations while preserving the valid icon configuration.

Avoid deleting favicon-related code without confirming its purpose.

7. Check the Favicon Image Format and Design

Not every image is suitable for use as a favicon.

A large, detailed logo may look good in your website header but become unreadable when reduced to a small browser icon.

Likewise, an image with excessive transparent padding may appear almost invisible.

Recommended Favicon Characteristics

Use an image that is:

• Square.
• At least 512 × 512 pixels for the WordPress Site Icon source.
• Visually simple.
• Easy to recognize at small sizes.
• High contrast.
• Free from unnecessary empty space.

PNG is a practical choice for WordPress Site Icons because it supports transparency and is widely compatible.

SVG and ICO formats can also be used for favicon implementations, but compatibility and WordPress upload support depend on the setup.

Do not install an SVG upload plugin solely to solve a favicon issue unless SVG is genuinely required.

Test Your Icon at Small Sizes

Before uploading your favicon, preview it at approximately 16 × 16 and 32 × 32 pixels.

If the design becomes unclear, simplify it.

For example, use a single brand symbol rather than your entire business name.

Also check how the icon looks against both light and dark browser interfaces.

A white icon with a transparent background may be difficult to see against a light tab background.

8. Fix HTTP and HTTPS Favicon Problems

Incorrect HTTP and HTTPS configuration can prevent a favicon from loading properly.

For example, your website may use HTTPS while the favicon is still referenced through an old HTTP URL.

Depending on browser behavior and server configuration, this can cause blocked requests, redirects, or inconsistent loading.

Check WordPress URLs

Navigate to:

Settings → General

Review:

• WordPress Address (URL).
• Site Address (URL).

Both should use the correct domain and HTTPS configuration for your website.

Do not change these settings casually, especially if WordPress is installed in a subdirectory or uses a custom configuration.

Check Mixed Content Errors

Open Developer Tools and select the Console tab.

Look for mixed content warnings related to the favicon.

If your favicon is requested over HTTP, update the source reference to HTTPS.

You should also verify that the HTTPS image URL loads correctly.

Check Domain Redirects

Make sure your preferred domain is consistent.

For example:

https://example.com

and

https://www.example.com

should not serve inconsistent website configurations.

If your website recently changed domains, ensure the favicon points to the current domain rather than an old staging or production URL.

For additional guidance, see our WordPress migration guide.

9. Check Whether Security Rules Are Blocking the Favicon

Security plugins, hosting firewalls, and CDN protection rules can sometimes prevent browsers or search engine crawlers from accessing image resources.

This is less common than caching problems, but it is worth investigating when the favicon URL returns an error.

Check the HTTP Response

Open the favicon URL directly.

If the server returns a 403 response, review:

• WordPress security plugin settings.
• Hosting firewall logs.
• Cloudflare WAF events.
• File access restrictions.
• Hotlink protection settings.

Some security rules may treat automated requests differently from normal browser requests.

A favicon might load for you but fail when requested by a search engine crawler.

Avoid Disabling Security Completely

Do not turn off your entire firewall just to make the favicon accessible.

Instead, identify the specific rule blocking the resource.

If the problem originates from hosting-level security, contact your hosting provider with the favicon URL, response status, and approximate request time.

10. WordPress Favicon Not Showing in Google Search Results

A favicon that works correctly in your browser may still be missing from Google search results.

This is an important distinction.

Google does not simply copy the favicon from your browser tab in real time.

Google discovers and processes favicon information while crawling websites.

It also applies its own eligibility and presentation requirements.

As a result, updating your favicon in WordPress does not guarantee an immediate change in Google search results.

Check Google’s Favicon Requirements

Google’s favicon documentation explains several important requirements.

Your favicon should:

• Represent your website clearly.
• Use a supported image format.
• Be accessible to Googlebot-Image.
• Be available at a stable URL.
• Have a square aspect ratio.
• Be at least 8 × 8 pixels.

Google recommends using a favicon larger than 48 × 48 pixels, with dimensions that are multiples of 48, for better appearance.

A 48 × 48 or 96 × 96 favicon can therefore be suitable for Google, while a 512 × 512 source image remains appropriate for WordPress.

Google also expects a consistent favicon for each hostname.

For example, different subdomains may have different favicons, but individual directories on the same hostname do not receive separate favicons in Google Search.

Check Your Homepage HTML

Google looks for favicon declarations in the homepage’s HTML.

A typical declaration looks like:

<link rel="icon" href="https://example.com/favicon.png">

The exact image location is flexible, provided the URL is valid and accessible.

You do not have to place the favicon in your website’s root directory.

WordPress often stores Site Icon files inside the uploads directory, which is normally acceptable.

Check Robots.txt Restrictions

Make sure your favicon file is not blocked from crawling.

For example, a robots.txt rule that blocks the directory containing your favicon could prevent Google from accessing it.

Also confirm that your homepage can be crawled.

You can review Google’s official guidance here:

Google Search Central: Favicon in Search Results

Can You Force Google to Update Your Favicon?

No. There is no guaranteed way to force Google to display a new favicon immediately.

However, you can help Google discover the update.

Open Google Search Console and inspect your homepage URL.

If the page is eligible, use Request Indexing to ask Google to recrawl it.

This does not guarantee immediate crawling or a favicon change.

Google may take several days or longer to process the update, and displaying a particular favicon is not guaranteed.

If your website has broader indexing problems, read our guide to fixing WordPress pages not indexed by Google.

11. Favicon Updated in WordPress but Google Still Shows the Old One

This is a slightly different problem from a completely missing favicon.

If Google displays your previous icon, it may already have an older version associated with your website.

Start by confirming that your homepage now references the correct image.

Then verify that the new favicon URL is accessible and not blocked.

Use a New Favicon URL

If you replaced the image at the same URL, Google or an intermediate caching layer may continue retrieving an older version.

Using a new filename and URL can make the update easier to detect.

For example:

Old URL:

https://example.com/favicon.png

New URL:

https://example.com/favicon-new.png

Update the WordPress Site Icon or relevant favicon declaration to reference the new resource.

Avoid repeatedly changing the URL every day.

Choose a stable final URL and allow Google time to process it.

Request Homepage Reindexing

After confirming the new favicon declaration, request indexing for your homepage through Google Search Console.

You do not need to request indexing for every page simply because the favicon changed.

Google’s favicon discovery is primarily associated with the website’s homepage.

Be Patient With Search Results

Even after Google recrawls the homepage, the search result favicon may not update immediately.

Google’s search appearance systems operate independently from your WordPress dashboard.

Repeatedly submitting indexing requests does not guarantee faster processing.

If the favicon meets Google’s requirements and remains accessible, waiting is often the appropriate next step.

12. Favicon Not Showing on Mobile Devices

A favicon can behave differently across desktop and mobile environments.

Mobile browsers may use different icon sizes or rely on additional metadata when a website is saved to the home screen.

For example, iOS home screen icons commonly use Apple touch icon declarations.

These are related to favicon functionality but are not identical to the small icon displayed in a browser tab.

Check Mobile Browser Behavior

Open your website on a mobile device.

Check whether the icon appears in the browser interface.

Then compare it with the desktop version.

If the icon appears on desktop but not mobile, investigate:

• Cached mobile browser data.
• Missing mobile icon declarations.
• Incorrect image sizes.
• Theme-specific mobile settings.
• Progressive Web App configuration.

Check Apple Touch Icons

Your website may include a declaration such as:

<link rel="apple-touch-icon" href="/apple-touch-icon.png">

This can help supported Apple devices identify the icon used when a website is added to the home screen.

Some WordPress configurations generate suitable touch icons automatically from the Site Icon.

If you use a PWA plugin, check its icon settings separately.

A PWA manifest can define its own icons, which may differ from the standard favicon.

13. Check for Favicon Problems After a WordPress Migration

Website migrations can introduce favicon problems even when the rest of the website appears to work normally.

This often happens when the favicon still references an old domain, staging environment, or upload path.

For example, the live website might load from:

https://example.com

while its favicon still points to:

https://staging.example.com

If the staging website is password-protected or no longer accessible, the favicon request may fail.

What to Check After Migration

Inspect the homepage source and locate the favicon URL.

Confirm that it uses the correct production domain.

Then check:

• WordPress Site Icon settings.
• Theme branding settings.
• Hardcoded favicon declarations.
• CDN configuration.
• Old domain references.
• HTTP and HTTPS redirects.

If your migration involved a domain change, use a safe database search-and-replace process when necessary.

Do not perform a raw SQL replacement on serialized WordPress data without using a tool that handles serialization correctly.

Also make sure your staging website is not accidentally supplying assets to the live website.

14. Check Your Theme’s Header Output

WordPress normally outputs favicon-related markup through its standard frontend hooks.

However, heavily customized themes may omit or alter important parts of the document head.

This can prevent WordPress from outputting the expected Site Icon declarations.

Check for wp_head()

In a classic custom WordPress theme, the header.php file should normally include:

<?php wp_head(); ?>

This function is typically called before the closing </head> tag.

It allows WordPress and plugins to output necessary styles, scripts, metadata, and other head elements.

If it is missing, the problem may affect more than just the favicon.

Modern block themes handle document structure differently, so do not assume that every theme has a conventional header.php file.

Avoid Editing Theme Files Unnecessarily

If you use a commercial or regularly updated theme, avoid editing its core files directly.

Updates may overwrite your changes.

If custom modifications are required, use an appropriate child theme or supported customization method.

Before changing theme code, confirm that the missing favicon declaration is actually caused by the theme.

15. How to Verify That Your WordPress Favicon Is Working

After applying a fix, verify the result instead of relying only on what appears in one browser tab.

Use the following checks.

Check 1: WordPress Settings

Confirm that the correct Site Icon is assigned.

Check 2: Homepage Source

Open your homepage source and search for:

rel="icon"

Verify that the favicon declaration references the intended image.

Check 3: Image URL

Open the favicon URL directly.

Confirm that the image loads successfully.

Check 4: Browser Test

Test the website in a private browsing window and another browser.

Check 5: Mobile Test

Check the website on a mobile device.

Check 6: Cache Configuration

Confirm that WordPress, hosting, and CDN caches are no longer serving outdated favicon references.

Check 7: Google Search Console

If the problem affects Google results, inspect the homepage and request indexing when appropriate.

Remember that Search Console cannot guarantee which favicon Google will display.

Check 8: Wait for Google to Process Changes

Once the technical configuration is correct, allow time for Google to recrawl and process the updated favicon.

Quick WordPress Favicon Troubleshooting Checklist

If your favicon is missing or not updating, follow this order:

• Confirm that the correct Site Icon is configured in WordPress.
• Check whether the favicon appears in an incognito browser window.
• Clear browser, WordPress, hosting, and CDN caches where relevant.
• Inspect the homepage source for favicon declarations.
• Open the favicon image URL and confirm that it loads.
• Remove conflicting or outdated favicon declarations.
• Check image dimensions, format, and visibility.
• Verify HTTPS and domain consistency.
• Review security rules if the favicon request is blocked.
• Check Google’s favicon requirements if the issue affects search results.
• Request homepage indexing through Search Console when appropriate.
• Allow time for browsers and Google to recognize the update.

This process should help you determine whether the problem originates from WordPress, the browser, your hosting configuration, or Google’s search systems.

Final Thoughts

A WordPress favicon that does not show or update is usually a configuration, caching, or resource-loading problem rather than a major website error.

If the favicon is missing from browser tabs, start by checking your Site Icon settings, browser cache, favicon URL, and page source.

If the favicon appears correctly in browsers but remains missing or outdated in Google, focus on crawl accessibility, Google’s favicon requirements, and homepage indexing.

The most important distinction is that a working favicon in WordPress does not guarantee an immediate favicon update in Google search results.

Once your favicon is configured correctly, accessible, and consistently referenced, avoid making unnecessary repeated changes.

If you want to improve more than just your website’s appearance, the WP Flow Mastery WordPress eBook brings together more than 160 pages covering WordPress hosting, performance optimization, SEO, security, WooCommerce, and practical website maintenance.

Written by Nemanja Stosic

WordPress Developer & Website Optimization Specialist

Nemanja has worked on more than 200 websites and focuses on WordPress development, performance optimization, SEO, security, WooCommerce, and practical website improvements.