Description

Dev Favicon Switcher helps you easily distinguish between your production and development environments. It automatically displays a different favicon based on the current URL, avoiding mistakes where you might accidentally edit the live site thinking it’s the development environment.

Key Features:

Automatic Environment Detection: Automatically applies the development favicon on common local domains (.local, .test, .dev).
Custom Development URLs: Specify exact URLs where the development favicon should appear (supports multiple URLs).
Easy Icon Management: Upload your own dev favicon using the WordPress media uploader, complete with built-in image cropping.
Restore Default Icon: Don’t have an icon handy? Easily apply our unified default development favicon with a single click.
Automatic Size Generation: Automatically generates all standard WordPress site icon sizes (32×32, 180×180, 192×192, 270×270) to ensure compatibility across all devices and browsers.
Admin Bar Styling: Customize the admin bar’s background and text colors to clearly identify your development environment at a glance, with a live preview and easy reset options.
No Frontend Bloat: Everything works efficiently via standard WordPress filters without adding unnecessary frontend scripts.

Perfect for developers working with local environments, staging servers, and migration tools like All-in-One WP Migration.

Development Source:
This plugin is developed using npm and webpack. You can find the human-readable source code and build tools in our public repository: https://github.com/karasunouta/dev-favicon-switcher

Screenshots

The settings screen showing the dev favicon and admin bar styling already active in the browser.
Clicking “Select Dev Favicon” opens the Media Library popup to choose a custom image.
Cropping the selected image to a square before setting it as the dev favicon.
The cropped image reflected in the settings screen and automatically applied in the browser tab bar.
Customizing the admin bar colors for easier environment identification, featuring a color picker with a live preview and quick reset options.

Installation

Upload the dev-favicon-switcher folder to the /wp-content/plugins/ directory.
Activate the plugin through the ‘Plugins’ menu in WordPress.
Configure the plugin by going to Settings > Dev Favicon.

FAQ

Does this modify my actual production site?: No. The plugin only overrides the favicon URL dynamically when it detects that you are accessing the site via one of your configured development URLs (or auto-detected extensions). Your live site will continue to load its normal configured site icon.
How does the auto-detect feature work?: If enabled, the plugin checks your current domain. If it ends with .local, .test, or .dev, it automatically considers the environment a development one and switches the favicon.
What if I don’t have a specific development favicon to upload?: You can simply click the “Restore Default” button in the settings, and the plugin will apply a built-in default development favicon for you.
Does it support image cropping?: Yes! When you upload or select a new development favicon from the media library, the plugin provides a cropping tool just like the native WordPress Site Icon feature.

Reviews

There are no reviews for this plugin.

Contributors & Developers

“Dev Favicon Switcher” is open source software. The following people have contributed to this plugin.

karasunouta

“Dev Favicon Switcher” has been translated into 1 locale. Thank you to the translators for their contributions.

Translate “Dev Favicon Switcher” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.

Changelog

1.5.4.7

Added .distignore to the exclusion list in .distignore.

1.5.4.5

Fixed a formatting issue in the readme.txt changelog.

1.5.4.4

Added .distignore to exclude development files from the distribution package.

1.5.4.3

Reduced the number of tags to 5 for WordPress.org compliance.

1.5.4.2

Added “admin bar” tag and improved feature descriptions in readme.txt.
Updated version numbering.

1.5.4.1

Updated readme.txt

1.5.4

Adjusted the naming conventions for JS files and translation files.

1.5.0

Added admin bar styling options.
Added “Force apply” option for admin bar styles.
Added “Restore Default” button for admin bar styles.
Added “Clear Settings” button for admin bar styles.

1.4.7

Published on WP.org

1.3.12

Added a refined settings UI with standard WordPress styling.
Added standard WP image cropping implementation.
Added “Restore Default” favicon capability.
Added automatic garbage collection for old unused favicons.
Fully prepared for translation.

1.0.0

Initial release.