How to Configure Favicons for PHP Websites (Main Domain & Subdomains) – Complete Technical Guide
This article provides a technical implementation guide for configuring favicons on PHP-based websites, including main domains and subdomains, ensuring proper...
This article provides a technical implementation guide for configuring favicons on PHP-based websites, including main domains and subdomains, ensuring proper display in:
-
Browser address bars
-
Tabs & bookmarks
-
Mobile home screen icons
-
Google Search results
The document is intended for:
-
IT professionals
-
System administrators
-
Web developers
-
Support engineers
Environment focus:
-
PHP websites
-
Shared hosting (Hostinger-compatible)
-
Apache / LiteSpeed servers
System / Feature Overview
What is a Favicon?
A favicon ("favorite icon") is a small website icon used by browsers and search engines for visual identification.
Favicons are consumed by:
| Component | Usage |
|---|---|
| Browsers | Address bar, tabs, bookmarks |
| Operating Systems | Desktop shortcuts, pinned tiles |
| Mobile Devices | Home screen icons |
| Google Search | Site icon beside results |
Technical Explanation
How Browsers Detect Favicons
Browsers locate favicons via:
-
Explicit
<link rel="icon">tags -
Default
/favicon.icorequest
Example automatic request:
https://example.com/favicon.ico
If missing → browser shows generic icon.
How Google Detects Favicons
Google:
-
Crawls
/favicon.ico -
Reads
<link rel="icon"> -
Requires minimum 48×48 resolution
-
May cache aggressively
Google treats subdomains as separate entities.
Architecture & Behavior
| Domain Type | Favicon Handling |
|---|---|
| Main Domain | Independent favicon |
| Subdomain | Separate favicon OR inherited |
| CDN Sites | Requires public access |
Favicons are not inherited automatically unless explicitly referenced.
Use Cases & Environments
Favicons should be configured when:
-
Deploying new websites
-
Creating subdomains (knowledgebase, portal, CRM)
-
Fixing missing search result icons
-
Rebranding websites
Implementation Guide
Step 1 – Generate Favicon Assets
Use a generator:
https://realfavicongenerator.net
Recommended source image:
-
PNG format
-
Square ratio
-
512×512 resolution
Generated files typically include:
favicon.ico
favicon-96x96.png
apple-touch-icon.png
site.webmanifest
web-app-manifest-192x192.png
web-app-manifest-512x512.png
Step 2 – Upload Favicon Files
Main Domain
Upload into root:
public_html/
Correct structure:
public_html/favicon.ico
public_html/favicon-96x96.png
public_html/apple-touch-icon.png
public_html/site.webmanifest
Subdomain
Upload into subdomain root:
public_html/subdomain_folder/
Example:
public_html/knowledgebase/favicon.ico
Step 3 – HTML Head Configuration
Insert inside <head>:
<link rel="icon" href="/favicon.ico" type="image/x-icon">
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
Centralized Favicon (Multi-site Best Practice)
Reference main domain favicon:
<link rel="icon" href="https://example.com/favicon.ico">
Benefits:
-
No duplication
-
Consistent branding
Verification Steps
Manual validation:
https://example.com/favicon.ico
https://sub.example.com/favicon.ico
Expected result → icon renders in browser.
Cache Invalidation
Favicons are heavily cached.
Perform:
-
Hard refresh →
CTRL + F5 -
Incognito test
-
Clear browser cache
Google Reindexing Procedure
Use Google Search Console:
-
URL Inspection
-
Enter homepage URL
-
Click Request Indexing
Note: Updates may take days to weeks.
Common Errors & Fixes
Error 1 – Favicon Not Visible
Root Causes
-
Incorrect folder location
-
Wrong filename
-
Cached browser
Fix
Verify file path:
/public_html/favicon.ico
Error 2 – 404 Favicon Requests
Diagnosis
Browser console → Network tab
Example:
GET /favicon.ico → 404
Fix
Upload file into root directory.
Error 3 – Works in Browser, Not Google
Causes
-
Google cache delay
-
Robots.txt blocking
-
Low-resolution icon
Fix
Ensure:
User-agent: *
Allow: /favicon.ico
Error 4 – Subdomain Missing Icon
Cause
Subdomain treated independently.
Fix
Upload favicon OR reference root favicon.
Security Considerations
Favicons present minimal risk but:
✔ Must be publicly accessible
✔ Avoid executable formats
✔ Use static image formats only
Recommended MIME types:
image/x-icon
image/png
Performance Considerations
Best practices:
✔ Keep favicon size small (<100KB)
✔ Prefer ICO + PNG formats
✔ Avoid oversized assets
Best Practices & Recommendations
✔ Always include /favicon.ico
✔ Use high-resolution source image
✔ Match filenames with HTML tags
✔ Validate via direct URL access
✔ Centralize favicon when branding identical
✔ Use Search Console for faster updates
Conclusion
Correct favicon configuration requires:
-
Proper asset generation
-
Correct server placement
-
Accurate
<head>references -
Cache awareness
Subdomains require explicit handling.
When implemented correctly, favicons improve:
-
Visual branding
-
User recognition
-
Search result appearance
#favicon #webdevelopment #php #hostinger #seo #technicalguide #systemadmin #webserver #apache #litespeed #websiteconfiguration #branding #webdesign #troubleshooting #googlesearchconsole #searchengine #html #weblogo #deployment #hosting #subdomain #knowledgebase #itpro #supportengineer #devops #websiteadmin #metadata #webarcitecture #performance #security #cache #browser #chrome #firefox #edge #safari #android #ios #manifest #webmanifest #debugging #validation #webenvironment #sharedhosting #technicalseo #siteicon #websiteicon #phpdevelopment #websupport #itadministrator
Was this guide useful?
Your answer helps us keep BISONKB accurate and practical.