https://DevOpsCloud.io -- Cloud Monk Losang Jinpa

DokuWiki Favicons

Return to DokuWiki Customization, DokuWiki Configuration, DokuWiki Logo Customization, DokuWiki

There are a number of types of favicons - the //favicon.ico// which combines a number of different size images into a single file used in the browser tab and bookmarks, individual PNG images used for various purposes (e.g. apple-touch/Web Clip), and animated favicon GIF images.

The default //favicon.ico// used with DokuWiki contains 8-bit PNG images of the dimensions 16x16px, 32x32px, and 48x48px.

DokuWiki uses the //favicon.ico// from //$DokuWiki/lib/tpl/images// to generate the image used for Opensearch if a viewer wishes to add a custom search engine for a DokuWiki site.

Custom favicons

Favicons for the browser tab

If you wish to replace the default DokuWiki //favicon.ico// with your own you can place it in any of these places:

the web root (often ///var/www//)
the root of the DokuWiki directory
in //$DokuWiki/data/media//
in //$DokuWiki/lib/tpl/dokuwiki/images// ¹⁾

By default DokuWiki has a //favicon.ico// file in //$DokuWiki/lib/tpl/dokuwiki/images//

The following rules apply:

a //favicon.ico// in the web root will **only** be used if there are **no** //favicon.ico// files in the //$DokuWiki// directory.

a //favicon.ico// in //$DokuWiki/data/media// will be used regardless of whether other //favicon.ico// files are beneath the web root directory.

a //favicon.ico// in //$DokuWiki/lib/tpl/dokuwiki/images// will **only** be used if there is **no** //favicon.ico// in //$DokuWiki/data/media// ²⁾.

Here you can find a tutorial how to generate a multi-resolution favicon with GIMP: catalyst.net

Animated Favicons for the browser tab

If you'd like to display an animated gif

instead of a static icon in the browser tab **and** you are using the default dokuwiki template (theme)³⁾:-

Edit doku.php and change

($conf['send404'] || preg_match('/^(robots\.txt|sitemap\.xml(\.gz)?|favicon\.ico|crossdomain\.xml)$/', $ID)) &&

to

($conf['send404'] || preg_match('/^(robots\.txt|sitemap\.xml(\.gz)?|animated_favicon\.gif|favicon\.ico|crossdomain\.xml)$/', $ID)) &&

Edit inc/template.php and change

* Returns <link> tag for various icon types (favicon|mobile|generic)

to

* Returns <link> tag for various icon types (favicon|mobile|generic|animated)

, and change

* @param  array $types - list of icon types to display (favicon|mobile|generic)

to

* @param  array $types - list of icon types to display (favicon|mobile|generic|animated)

, and finally, change

            case 'generic':
                // ideal world solution, which doesn't work in any browser yet
                $look = array(':wiki:favicon.svg', ':favicon.svg', 'images/favicon.svg');
                $return .= '<link rel="icon" href="'.tpl_getMediaFile($look).'" type="image/svg+xml" /$
                break;

to

            case 'generic':
                // ideal world solution, which doesn't work in any browser yet
                $look = array(':wiki:favicon.svg', ':favicon.svg', 'images/favicon.svg');
                $return .= '<link rel="icon" href="'.tpl_getMediaFile($look).'" type="image/svg+xml" /$
                break;
            case 'animated':
                $look = array(':wiki:animated_favicon.gif', ':animated_favicon.gif', 'images/animated_$
                $return .= '<link rel="icon" type="image/gif" href="'.tpl_getMediaFile($look).'" />'.N$
                break;

 - Edit ''lib/tpl/dokuwiki/main.php'' and change  to 
 - Edit ''lib/tpl/dokuwiki/mediamanager.php'' and change  
 - (Optional) Edit ''lib/tpl/dokuwiki/lang/en/style.txt'' and change will be automatically used. You can also upload a ''favicon.ico'' there. If you use a closed



wiki it is recommended to make the wiki (or root) namespace world readable in the ACL settings or your logo is not shown to not logged in users.</code> to

will be automatically used. You can also upload a ''favicon.ico'' or an ''animated_favicon.gif'' there.
If you use a closed wiki it is recommended to make the ''wiki'' (or root) namespace world readable
 in the ACL settings or your logo is not shown to not logged in users.

 - Place your ''animated_favicon.gif'' in any of locations DokuWiki looks for favicons.ico files and refresh your browser. 



If you'd like to help test how DokuWiki favicons are used for various things in different browsers you can download this zip archive containing //favicon.ico// files with Red, Yellow, and Green backgrounds. Each //favicon.ico// has a 16×16, a 24×24, a 32×32, a 64×64, and a 128×128 pixel PNG images in it. All are 24-bit, and display a number corresponding to their dimensions so you can see which size is used by various browser themes.


https://www.dokuwiki.org/tips:favicons



¹⁾
NOTES: only tested with the default DokuWiki theme/template; this location may be overwritten on upgrades
²⁾
NOTE: the same rules may not apply to the //favicon.ico// used to generate the image used for Opensearch
³⁾
NOTE: a similar process will probably work with other themes - I haven't tested

Table of Contents

DokuWiki Favicons

Custom favicons

Favicons for the browser tab

Animated Favicons for the browser tab