Favicon generator for WordPress
Upload favicon files to your theme or use the Site Icon feature with custom assets.
WordPress
Generate your favicon package first, then follow the steps below to integrate with WordPress.
Installation steps
- 1
Generate your favicon package and upload files via FTP/SFTP to your theme or site root.
- 2
Option A: Upload favicon.ico to the WordPress root (same level as wp-config.php).
- 3
Option B: Use Appearance → Customize → Site Identity → Site Icon (512×512 source).
- 4
For full control, add link tags to header.php or a child theme functions.php hook.
- 5
Clear WordPress cache plugins and browser cache after updating icons.
Code & configuration
Copy and adapt for your WordPress project
<?php
// child theme functions.php
add_action('wp_head', function () {
?>
<link rel="icon" type="image/png" href="<?php echo get_site_url(); ?>/favicon-96x96.png" sizes="96x96" />
<link rel="icon" type="image/svg+xml" href="<?php echo get_site_url(); ?>/favicon.svg" />
<link rel="shortcut icon" href="<?php echo get_site_url(); ?>/favicon.ico" />
<link rel="apple-touch-icon" sizes="180x180" href="<?php echo get_site_url(); ?>/apple-touch-icon.png" />
<link rel="manifest" href="<?php echo get_site_url(); ?>/site.webmanifest" />
<?php
}, 1);Pro tips
- Site Icon in Customizer auto-generates sizes — our package gives you finer control.
- Use wp_enqueue style hooks only for CSS; favicons belong as <link> tags in head.
Files to deploy
favicon.icofavicon.svgfavicon-96x96.pngapple-touch-icon.pngandroid-chrome-192x192.pngandroid-chrome-512x512.pngsite.webmanifest