How can I change the favicon of a Magento 2 store by code in my custom theme? without using admin backend interface.
Add a comment
|
3 Answers
Magento will get the default favicon from Magento_Theme module.
vendor/magento/module-theme/Model/Favicon/Favicon.php
public function getDefaultFavicon()
{
return 'Magento_Theme::favicon.ico';
}
So, in your custom theme, we can add favicon.ico:
app/design/frontend/Vendor/Theme/Magento_Theme/web/favicon.ico
If we want to know how Magento gets favicon in depth, we should take a look:
--vendor/magento/module-theme/Model/Favicon/Favicon.php
public function getFaviconFile() { ... }
public function getDefaultFavicon() { ... }
protected function prepareFaviconFile() { ... }
--vendor/magento/framework/View/Page/Config/Renderer.php
public function prepareFavicon() { ... }
answered Aug 30, 2016 at 14:40
To override the default 16px x 16px favicon manually, add your custom favicon.ico in the /Magento_Theme/web/directory.
To add favicon icons of other sizes, take the following steps:
Add your icons in the /Magento_Theme/web/ directory. In the /Magento_Theme/layout/default_head_blocks.xml layout file specify the paths to the icons and their sizes.
For example, if you added a favicon-32x32.png icon and want it to be used as a 32px x 32px favicon, your default_head_blocks.xml would be like following:
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<link src="Magento_Theme::favicon-32x32.png" rel="icon" sizes="32x32" />
</head>
</page>
Please try below code
app/code/VendorName/ModuleName
registration.php
<?php
use Magento\Framework\Component\ComponentRegistrar;
ComponentRegistrar::register(ComponentRegistrar::MODULE, 'VendorName_ModuleName', __DIR__);
app/code/VendorName/ModuleName/etc
module.xml
<?xml version="1.0" ?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
<module name="VendorName_ModuleName">
<sequence>
<module name="Magento_Theme"/>
</sequence>
</module>
</config>
app/code/VendorName/ModuleName/etc
di.xml
<?xml version="1.0" ?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
<preference for="Magento\Theme\Model\Favicon\Favicon" type="VendorName\ModuleName\Model\UpdateFavicon" />
</config>
app/code/VendorName/ModuleName/Model
UpdateFavicon.php
<?php
namespace VendorName\ModuleName\Model;
use Magento\Theme\Model\Favicon\Favicon as ParentClass;
class UpdateFavicon extends ParentClass
{
/**
* Get updated Favicon Icon
*
* @return string
*/
public function getDefaultFavicon()
{
return 'VendorName_ModuleName::favicon.ico';
}
}
Once you've added the above file, move your favicon icon to this path with the name favicon.ico.
app/code/VendorName/ModuleName/view/frontend/web/favicon.ico
app/code/VendorName/ModuleName/view/adminhtml/web/favicon.ico
Note: You need to remove the favicon icon from the store configuration. If the icon is not added to the store configuration, the above-added icon will be visible on the frontend.
