Despite following the instructions, when uploading a favicon in the supported ICO format, we receive the following error message: “File validation failed.”
I don’t want to use any code
Generally, we need to upload the favicon only once. Using a different supported format, such as PNG, will do the trick. The favicon will look just the same. No need to modify any code.
I want to fix the error
But what if we would like to fix this issue to allow the client to upload a favicon in the ICO format (as expected)? First, we need to find what causes this bug in the source code.
The file we are looking for is located in vendor\magento\module-media-storage\Model\File\Validator\Image.php
The array $imageMimeTypes contains the list of supported file formats for the favicon. Note that “ico” is associated with “image/vnd.microsoft.icon”. This is the part that is not recognized when we upload our ICO file.
In theory, browsers should have no issue with this MIME type. But to make it work, we need to replace it with the commonly accepted “image/x-icon”.
Since this is core Magento code, we need to create a patch to fix it. Our patch would look like this:
diff --git a/Model/File/Validator/Image.php b/Model/File/Validator/Image.php
index a8bce7c..eb43e95 100644
--- a/Model/File/Validator/Image.php
+++ b/Model/File/Validator/Image.php
@@ -25,7 +25,7 @@ class Image extends \Zend_Validate_Abstract
'jpg' => 'image/jpeg',
'gif' => 'image/gif',
'bmp' => 'image/bmp',
- 'ico' => 'image/vnd.microsoft.icon',
+ 'ico' => 'image/x-icon',
];
/**
Apply the patch. It is now possible to upload a favicon in the ICO format.
Replace the favicon in a custom theme
When creating a custom theme, replace the favicon in Magento (or the default Magento favicon will be displayed). If the client did not provide one, we can simply replace it with a blank one.
We save the custom theme favicon in the folder app/design/frontend/<Vendor>/<theme>/Magento_Theme/web (Replace <Vendor> and <theme> with your own). The file must be named “favicon.ico”.
Redeploy. The default Magento favicon has been replaced with our own.
There we have it. This is how we can upload a favicon with the ICO file format in Magento 2.4.
Watch the answer to this question on YouTube!
Here are a few more error messages that can be fixed in Magento 2.4:
How to fix the jQuery Migrate warning in Magento 2?
https://www.cyberic.net/how-to-fix-the-interpreting-unsafe-inline-as-a-hostname-warning-in-magento-2-4/