Favicon on MediaWiki

From TechWiki

Jump to: navigation, search

Contents

Introduction

This artical discusses the setup of a favicon on MediaWiki - for general favicon setup please see Favicon

Setup

Steps 1, 2 and 4 of the setup are the same as those of the general favicon setup. Step 3 however is slightly different. All steps are included here for completeness.

Step 1

First off create a favicon for your website. The default size of a favicon is 16px by 16px. The image itself needs to be in ico format. There are a couple of photoshop extensions that allow you to save a file in ico format.

This Site allows you to create a favicon from scratch and

This Site allows you to convert images in various formats into favicons.

Also keep a copy of your favicon in a non ico format.

Step 2

Name the favicon image in ico format 'favicon.ico' and upload it to your domain root. - This is the favicon that will be used by your RSS feeds if you have any.

Name the non ico favicon image anything you want and put it anywhere on your domain (we will assumes its called favicon.png and is located in your document root as well)

Step 3

Now you need to ensure that the following meta data is added to the headers of each of your web pages.

<link rel="bookmark icon" href="/favicon.ico">
<link rel="shortcut icon" href="/favicon.ico">
<link rel="icon" href="/favicon.png" type="image/png">

This is slightly tricky - within the mediawiki root directory should be a folder called 'skins'. Within that folder are the various skins that you can use open the skin that you are using (if you have not changed anything open MonoBook.php)

WARNING: You need to repeat this process when updating your skins.

Just above </head> add the above lines.

Now open LocalSettings.php and add the line

$wgFavicon = "$wgScriptPath/favicon.ico";

For those using Short URLS

If you happen to be using Short URLS you need to additionally do the following. If not ignore it.

Within your .htacess add the following line just after the line 'RewriteEngine On'

RewriteRule .*\.ico$ - [L]

Step 4

Clear your browser Cache, and reload your website - you should see the favicon.

Note: ie6 does not display favicons.

See Also

Personal tools