Adding a favicon to the admin/CMS

a-ok · January 15, 2015

Hi folks,

Quick one. Is it possible to add a favicon to the admin/CMS area? Without messing with anything core?

Thanks,

R

a-ok · January 15, 2015

I worked it out. Go to /site/templates/admin.php and add in (above the controller.php require)

<?php $config->styles->add($config->urls->templates . "favicon.ico?t=" . time()); ?>

a-ok · January 19, 2015

I decided to mark this as unsolved as adding this caused a few loading issues on the CMS on the pages dashboard (see screenshot) – any other thoughts?

thmsnhl · January 12, 2016

Hi Richard, I don't know if you still need this, but I managed to use a favicon without any issues.

First: install the Reno admin theme
Second: navigate to wire/modules/AdminTheme/AdminThemeReno/default.php
Third: paste your favicon links into the <head>-area in my case line 56

    <!-- Favicons -->
    <link rel="apple-touch-icon" sizes="57x57" href="<?php echo $config->urls->templates?>favicons/apple-touch-icon-57x57.png">
    <link rel="apple-touch-icon" sizes="60x60" href="<?php echo $config->urls->templates?>favicons/apple-touch-icon-60x60.png">
    <link rel="apple-touch-icon" sizes="72x72" href="<?php echo $config->urls->templates?>favicons/apple-touch-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="76x76" href="<?php echo $config->urls->templates?>favicons/apple-touch-icon-76x76.png">
    <link rel="apple-touch-icon" sizes="114x114" href="<?php echo $config->urls->templates?>favicons/apple-touch-icon-114x114.png">
    <link rel="apple-touch-icon" sizes="120x120" href="<?php echo $config->urls->templates?>favicons/apple-touch-icon-120x120.png">
    <link rel="apple-touch-icon" sizes="144x144" href="<?php echo $config->urls->templates?>favicons/apple-touch-icon-144x144.png">
    <link rel="apple-touch-icon" sizes="152x152" href="<?php echo $config->urls->templates?>favicons/apple-touch-icon-152x152.png">
    <link rel="apple-touch-icon" sizes="180x180" href="<?php echo $config->urls->templates?>favicons/apple-touch-icon-180x180.png">
    <link rel="icon" type="image/png" href="<?php echo $config->urls->templates?>favicons/favicon-32x32.png" sizes="32x32">
    <link rel="icon" type="image/png" href="<?php echo $config->urls->templates?>favicons/favicon-194x194.png" sizes="194x194">
    <link rel="icon" type="image/png" href="<?php echo $config->urls->templates?>favicons/favicon-96x96.png" sizes="96x96">
    <link rel="icon" type="image/png" href="<?php echo $config->urls->templates?>favicons/android-chrome-192x192.png" sizes="192x192">
    <link rel="icon" type="image/png" href="<?php echo $config->urls->templates?>favicons/favicon-16x16.png" sizes="16x16">
    <link rel="manifest" href="<?php echo $config->urls->templates?>favicons/manifest.json">
    <link rel="mask-icon" href="<?php echo $config->urls->templates?>favicons/safari-pinned-tab.svg" color="#5bbad5">
    <link rel="shortcut icon" href="<?php echo $config->urls->templates?>favicons/favicon.ico">
    <meta name="msapplication-TileColor" content="#ffffff">
    <meta name="msapplication-TileImage" content="<?php echo $config->urls->templates?>favicons/mstile-144x144.png">
    <meta name="msapplication-config" content="<?php echo $config->urls->templates?>favicons/browserconfig.xml">
    <meta name="theme-color" content="#ffffff">

LostKobrakai · January 12, 2016

Maybe the admin themes could feature a hook in that place so it could be edited without modifying core files.

matjazp · January 12, 2016

How about replacing PW logo with my company's logo (branding) without modifying the admin theme?

kongondo · January 12, 2016

Maybe the admin themes could feature a hook in that place so it could be edited without modifying core files.

Or maybe search in a /site/somefolder/ first for a favicon and use that if one found?

Jonathan Lahijani · May 9, 2016

You could do this in admin.php (above the line that brings in controller.php):

$wire->addHookAfter('AdminTheme::getExtraMarkup', function($event) {
  $extras = $event->return;
  $extras['head'] .= '<link rel="shortcut icon" href="'.wire('config')->urls->templates.'favicon.png">';
  $event->return = $extras;
});

hansv · February 7, 2017

I don't know is this topic is still alive?

Just put this line in the header of _main.php, close your browser and restart or refresh (CTRL-F5) a few times and the favicon appears.

	<link rel="icon" href="<?=urls()->templates?>styles/images/favicon.ico">

godmok · February 7, 2017

@hansv The admin backend is not working with _main.php. What you mean is to set the favicon in the frontend.

Jonathans example looks good for me.

bernhard · May 30, 2019

Thank you @Robin S for that snippet!

One can also use fontawesome icons with this service: https://gauger.io/fonticon/

Just download the .ico to your website and include it like robin showed above:

$this->addHookAfter('AdminTheme::getExtraMarkup', function($event) {
	$extras = $event->return;
	$extras['head'] .= '<link rel="shortcut icon" href="/site/templates/img/favicon.ico">';
	$event->return = $extras;
});

?

wbmnfktr · May 30, 2019

It's even easier.

Just add a favicon.ico (backend) to and a favicon.png (website) to your web root.

For the real website you define something like <link rel="shortcut icon" href="/favicon.png" type="image/png">

While the website shows your .png the backend will show your .ico.

bernhard · May 30, 2019

Sorry, don't get what you are saying... Where do we have to add the favicon.ico to be desplayed in the backend? ?

wbmnfktr · May 30, 2019

Into the web/document root of your site. The same level as index.php.

bernhard · May 31, 2019

Thx for clarifying. That doesn't work here on Win10 + Chrome ? I don't find any occurances of "favicon.ico" in the wire folder, so I guess your browser is making you see the favicon, not ProcessWire?

wbmnfktr · May 31, 2019

Weird... the favicon.ico thing works like this:

The browser looks in certain places for certain files.

The favicon.ico is expected here: https://www.domain.tld/favicon.ico and will be displayed if it exists.

You can... nonetheless... define an alternative file as described above to change default behaviour or to show another file like a .png

Sometimes browsers are kind of lazy and don't look for new files they either haven't found for a while or have already cached. So using another browser or adding a bookmark to your bookmark bar can help to trigger a reload/refresh.

hansv · May 31, 2019

@wbmnfktr thx, this is working (in Chrome, Win10). fine after cleaning browser-cache and closing browser-tabs,

bernhard · May 31, 2019

I've of course tried it in an incognito window... I'll try that next time with another installation ?

Sign In

Adding a favicon to the admin/CMS

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Recently Browsing 0 members

Similar Content