Manual:Interface/Sidebar

This page documents a system message, a wiki page that defines part of the MediaWiki interface. See also the default documentation.

MediaWiki:Sidebar defines the navigation bar, which provides links to the most important locations in the wiki and supplies site administrators with a place to add a persistent collection of links. For instance, most wikis will link to their community discussion page and some useful tools.

The Monobook skin places the navigation bar on the top-left (top-right for right-to-left languages) along with the search bar and toolbox, but the placement may be different in other skins.

Customize the sidebar

To customize the MediaWiki:Sidebar on a wiki, you need first to be logged in with a user that has the editinterface permission - for administrators this is enabled by default. (For information on assigning a permission to groups or users, see Manual:User rights.)

Then, use a link to a page on your wiki, but replace your wiki page's title (e.g. Main_Page) in the URL/Address bar with MediaWiki:Sidebar and load that page - you should now see the current content of the sidebar. (You may need to use the syntax //yourdomain/yourwiki/index.php?title=MediaWiki:Sidebar&action=edit if you use long URLs.)

If the content of the sidebar has already been modified, you can simply click on the Edit or Edit source link, otherwise you may need to create the page first by clicking on Create or Create source.

Note: If you have to create a new page, you will be presented with the default content for the sidebar in the editor. In order to successfully create a MediaWiki:Sidebar page, you need to change the content before saving.

Here is an example code for a sidebar:

* navigation
** mainpage|Accueil
** Special:RecentChanges|Recent changes
* new heading
** portal-url|portal
** http://www.mediawiki.org|MediaWiki home

This example will result in the following sidebar:

Headings

The navigation bar can be split into sections, each with a heading of its own. The heading for each section is taken from the first-level list element ("navigation" and "new heading" in the example above).

If this text corresponds to the name of an interface message (an existing page of that title in the MediaWiki namespace), then the text of that page is used as a label; otherwise, the header title is used as-is.

Bug: no sidebar is shown in the Nostalgia skin (bug 10794).

Links

Second-level list elements are links ("mainpage|mainpage" in the example above), where the format is:

** target|link text

target: The link target can be the name of an interface message (page in the MediaWiki namespace) or wiki page, or an external link. In either case, the link can be internal, interwiki, or external. In some cases (such as links with the "&" character), an interface message is necessary. The link target cannot be made dependent on the interface language set in the preferences.

Algorithm followed:

Get the target text.
If there is an existing or default interface message with that name, use the content of that message instead of the target text.
If the output from the previous step is a valid URL (beginning with http:// or other URL protocol), the link will point to that URL.
Else, it will treat it as the link target of a wikilink (linking to that page name or interwiki).
In case it would end up linking to '-', the whole entry is removed from the sidebar (that's useful for removing an entry on all languages by changing the message holding the link).

Examples:

"** portal-url|portal" uses the text of MediaWiki:Portal-url (which contains "Project:Community portal").
"** Special:RecentChanges|Recent changes" links to Special:RecentChanges, since there is no interface message of that name.
"** w:Foo|Some interwiki page" links to w:Foo for the same reason.
"** http://www.mediawiki.org|MediaWiki home" links to http://www.mediawiki.org for the same reason.

text

The link text can be the name of an interface message (page in the MediaWiki namespace) or plain text.

If the link text is the name of an existing or default interface message, the content of that message will be used. MediaWiki will check for localized versions; for example, if the current language is fr (French) and the link text is the interface message "forum", it will check for "forum/fr" before using "forum".
Otherwise, the link text is used as the target as-is.
Notice that the link text is not optional as in normal wiki links. If the link text is missing, the item is ignored.

Examples:

** Homepage|mainpage uses MediaWiki:Mainpage (which contains "MediaWiki").
** Special:Recentchanges|Recent changes uses "Recent changes", since there is no interface message of that name.

Order of elements

By default, the sidebar consists of elements in this order: navigation, search, toolbox, languages. The order can be changed (in MediaWiki 1.13+) by adding special keywords (SEARCH, TOOLBOX and LANGUAGES) to MediaWiki:Sidebar using the heading syntax. For example, the following code moves the search box to the top of the sidebar:

* SEARCH

* navigation
** mainpage|mainpage
** Special:Recentchanges|Recent changed
* new heading
** portal-url|portal
** http://www.mediawiki.org|MediaWiki home

Translations

You can translate the strings, which you use, by editing the according pages in the MediaWiki namespace.

Example: The string, which will replace the item named "mainpage", is taken from MediaWiki:Mainpage. To set/change this text for users, who display your wiki in German, you can put the according text on the page MediaWiki:Mainpage/de.

That way you can easily translate these texts through the MediaWiki interface.

Please note that MediaWiki will by default use the content of the Sidebar page in that language, which corresponds to the default language of your wiki. So, if your wiki e.g. uses French as its default language, edit MediaWiki:Mainpage/fr in order to show a modified sidebar to all users, who have not changed their language setting and to all anonymous users.

For more advanced translation, see Help:Extension:Translate/Unstructured element translation.

Advanced customization

The sidebar can be fully customized by implementing JavaScript or Cascading Style Sheets, or by editing the PHP files directly. Before using these methods, note that:

JavaScript is fragile: it will not work for users with JavaScript disabled, and scripts frequently fail in different browsers or skins.
Editing the PHP files can easily cause unexpected errors, and your changes will be lost in the next update unless you manually change the new files.

Force UI-messages to follow content

Some pages should sometimes follow the content language, especially for multilingual sites. This can be controlled with the setting $wgForceUIMsgAsContentMsg. Each message overridden in this way must be explicitly given, for example to let the sidebar link to versions given by the content language for the main page and the portal page add the following to LocalSettings.php

code

$wgForceUIMsgAsContentMsg = array( 'mainpage', 'portal-url' );

Add or remove toolbox sections (JavaScript)

The toolbox, which appears under the search bar, is a dynamic element and cannot be easily customized without the use of skinning extensions (otherwise it requires programming in PHP.) If you still want to do so, you can copy skins/MonoBook.php, creating a new skin. You can then make a custom skin to generate these links in your preferred fashion.

Another JavaScript solution is below.

For this solution to work on the entire MediaWiki site, this script has to be copied to MediaWiki:Common.js (MediaWiki:Common.js is available for MediaWiki 1.9 +).

For this solution to work only for a specific user, add this script to Special:MyPage/monobook.js (or another JS page, depending on your preferred skin).

Now simply configure which link should appear in which section. You also can remove some links if you want to.

code

function ModifySidebar( action, section, name, link ) {
	try {
		switch ( section ) {
			case 'languages':
				var target = 'p-lang';
				break;
			case 'toolbox':
				var target = 'p-tb';
				break;
			case 'navigation':
				var target = 'p-navigation';
				break;
			default:
				var target = 'p-' + section;
				break;
		}

		if ( action == 'add' ) {
			var node = document.getElementById( target )
							   .getElementsByTagName( 'div' )[0]
							   .getElementsByTagName( 'ul' )[0];

			var aNode = document.createElement( 'a' );
			var liNode = document.createElement( 'li' );

			aNode.appendChild( document.createTextNode( name ) );
			aNode.setAttribute( 'href', link );
			liNode.appendChild( aNode );
			liNode.className = 'plainlinks';
			node.appendChild( liNode );
		}

		if ( action == 'remove' ) {
			var list = document.getElementById( target )
							   .getElementsByTagName( 'div' )[0]
							   .getElementsByTagName( 'ul' )[0];

			var listelements = list.getElementsByTagName( 'li' );

			for ( var i = 0; i < listelements.length; i++ ) {
				if (
					listelements[i].getElementsByTagName( 'a' )[0].innerHTML == name ||
					listelements[i].getElementsByTagName( 'a' )[0].href == link
				)
				{
					list.removeChild( listelements[i] );
				}
			}
		}

	} catch( e ) {
		// let's just ignore what's happened
		return;
	}
}

function CustomizeModificationsOfSidebar() {
	// adds [[Special:CategoryTree]] to toolbox
	ModifySidebar( 'add', 'toolbox', 'CategoryTree', 'http://en.wikipedia.org/wiki/Special:CategoryTree' );
	// removes [[Special:Upload]] from toolbox
	ModifySidebar( 'remove', 'toolbox', 'Upload file', 'http://en.wikipedia.org/wiki/Special:Upload' );
}

jQuery( CustomizeModificationsOfSidebar );

Usage: function CustomizeModificationsOfSidebar() has to be customized for adding or removing links in specific sections:

ModifySidebar( "action", "section", "name", "link" );

parameter	value
`action`	add to add a link; remove to remove a link
`section`	navigation, toolbox, languages but also any other existing customized section; the given link will be added to or removed from this section
`name`	contains the text of the link
`link`	contains the URL of the link

restricting modifications to specific usergroups

If you want to restrict the modification of the links to a specific user group (e.g. bureaucrat), change

jQuery( CustomizeModificationsOfSidebar );

to

if ( isArray( wgUserGroups ) ) {
	if ( wgUserGroups.Contains( 'bureaucrat' ) ) {
		jQuery( CustomizeModificationsOfSidebar );
	}
}

and add

function isObject( obj ) {
	return typeof obj == 'object' && obj != null;
}

function isArray( obj ) {
	return isObject( obj ) && obj.constructor.toString().indexOf( 'Array' ) != -1;
}

Array.prototype.Contains = function( element, strict ) {
	for( i in this ) {
		if( this[i] == element && !strict || this[i] === element ) {
			return true;
		}
	}
	return false;
}

For restricting the modifications to IPs instead of a specific user group, use

if ( !isArray( wgUserGroups ) ) {
	jQuery( CustomizeModificationsOfSidebar );
}

Add or remove toolbox sections (PHP)

You can add in your file LocalSettings.php the hook described on this page. With this, you can modify via MediaWiki:Sidebar the links in the toolbox panel (remove some links, change their name) and add custom links (e.g. add the "Recent changes" link there instead of the navigation panel.

Remove toolbox sections (On Vector template) MW v 1.24.1

You can download the php file VectorTemplate.php from the folder /skins/Vector. Then comment out lines 270,271,272 and also lines 285,286,287 then you can re-upload the file to its original location. Remember always make a backup of the original file just incase. Also my assumption is that when you upgrade your wiki, the changes made to this file may be reverted. To then remove the text Tools on the Side bar, in your wiki, navigate to MediaWiki:Sidebar, when there, remove the text written Tools, that should remove it totally. Take note that when logged in, even as a bureaucrat, you wont be able to see the tools section, so its best you keep important links elsewhere so that you can reach the pages still.

Make expanding/collapsing sidebar for all users (Monobook skin only)

If you use the Monobook skin and don't want to miss the expandable menu bar from e.g. Vector skin, paste the following code into MediaWiki:Monobook.js of your wiki.

/////////////////////////////////////////////////////////
// Code snippet to make your sidebar items expandable  //
// Use this code ONLY for the Monobook skin.           //
/////////////////////////////////////////////////////////

$( document ).ready( function() {
	// Set the default expanded items by their headline
	var defaultExpandItems = ['Navigation', 'Orga'];
	// Set the basic-name for the cookies, which save the current state of expanding
	var expandCookieName = 'disdance_project_wiki_nav_expanded_';

	var maxHeights = [];
	var expandeds = [];
	var labels = [];
	initNav();
});

function initNav() {
	$( '#p-logo' ).css({'position': 'relative', 'display': 'block'});
	$( '.generated-sidebar h5,#p-tb h5 ').each( function( i ) {
		var id = $( this ).parent().attr( 'id' );
		maxHeights[id] = $( this ).next( 'div' ).height();
		var str = $( this ).html();
		labels[id] = str;

		if ( $.cookie( expandCookieName + id ) == 'false' ) {
			expandeds[id] = false;
			minimize( $( this ) );
		} else if ( $.cookie( expandCookieName + id ) == 'true' ) {
			expandeds[id] = true;
			maximize( $( this ) );
		} else if ( defaultExpandItems.indexOf( str ) == -1 ) {
			expandeds[id] = false;
			minimize( $( this ) );
		} else {
			expandeds[id] = true;
			maximize( $( this ) );
		}
		$( this ).css({'cursor': 'pointer'});
		$( this ).click( toggleNav );
	} );
}

function minimize( target ) {
	var id = $( target ).parent().attr( 'id' );
	// You can change the expires parameter to save the cookie longer/shorter than 7 days like in this code
	$.cookie( expandCookieName + id, 'false', { expires: 7} );
	var str = labels[id] + '  ►';
	$( target ).next( 'div' ).animate({'height': '0px'});
	$( target ).html( str );
}

function maximize( target ) {
	var id = $( target ).parent().attr( 'id' );
	// You can change the expires parameter to save the cookie longer/shorter than 7 days like in this code
	$.cookie( expandCookieName + id, 'true', { expires: 7} );
	var str = labels[id] + '  ▼';
	var newHeight = maxHeights[id];
	$( target ).next( 'div' ).animate({'height': newHeight + 'px'});
	$( target ).html( str );
}

function toggleNav( e ) {
	var id = $(e.target ).parent().attr( 'id' );
	expandeds[id] = !expandeds[id];
	if( expandeds[id] == true ) {
		maximize( e.target );
	} else {
		minimize( e.target );
	}
}

///////////////////////////////////////////////////////
///////////////////////////////////////////////////////

Sidebar width in Monobook skin (CSS)

You can change the width of your sidebar by adding the following CSS rules to your MediaWiki:Monobook.css, note that this is an article, not a file. This changes the width to 15em, the actions position and portlet width should be an em or so less, so I've set them to 14em in this example.

/* increase sidebar width */
#column-content { margin-left: -15em; }
#column-content #content { margin-left: 15em; }
#p-logo a, #p-logo a:hover { width: 15em; }
#p-cactions { left: 14.5em; }
.portlet { width: 14em; }
div#column-content { margin-left: -14em; }
div#content { margin-left: 14em; }

Sidebar width in Vector skin (CSS)

You can change the width of your sidebar by adding the following CSS rules to your MediaWiki:Vector.css. The standard width in vector skin is 10em. The following example changes the width to 12em:

/* increase Vector sidebar width */
div#mw-panel { width: 12em; }
div#footer, #mw-head-base, div#content { margin-left: 12em; }
#left-navigation { margin-left: 12em; }

Change sidebar content when logged in (PHP)

You can modify the sidebar using a hook. Create a small extension of your own or put the code directly into your LocalSettings.php file.

Some example code adding a 'navigation' sidebar block with a login link for logged out users.

Warning:

The sidebar's array is cached after this hook is run, if you use sidebar caching and do user specific things in this hook like something that only shows up when logged in or out it may end up cached and not look correctly for some users.

<?php
$wgHooks['SkinBuildSidebar'][] = 'lfHideSidebar';
function lfHideSidebar( $skin, &$bar ) {
	global $wgUser;
	// Hide sidebar for anonymous users
	if ( !$wgUser->isLoggedIn() ) {
		$bar = array(
			'navigation' => array(
				array(
					'text'   => wfMsg( 'login' ),
					'href'   => SpecialPage::getTitleFor( 'Login' )->getLocalURL(),
					'id'     => 'n-login',
					'active' => ''
				)
			)
		);
	}
	return true;
}

Parser functions in sidebar

Although it is not exactly recommended, the sidebar does support parser functions (such as ParserFunctions), provided the ** is outside the parser function, and the parser function does not span multiple lines. For example:

*Heading
**{{#ifeq:{{NAMESPACE}}|User|Page-to-link-to{{!}}text-to-show-on-user-page}}
**{{#ifeq:{{NAMESPACE}}|Talk|Another-Page-to-link-to{{!}}text-to-show-on-talk-page}}

works. However the following would not work since the parser function spans multiple lines:

*Heading
{{#ifeq:1|1|
**foo{{!}}bar
|
**baz{{!}}fred
}}

Warning:

There is a bug on 1.18 where if a line on MediaWiki:Sidebar contains pipe characters (|) before expanding parser functions, but not after expanding parser functions, an exception is thrown on all pages (bug 33321). If such a construction is accidentally introduced to the sidebar, it forces the user to revert MediaWiki:Sidebar using the API or edit.php. This is fixed in later versions of MediaWiki

Troubleshooting

Changes not showing up

MediaWiki aggressively caches content if possible, which often causes the navigation bar to persist after changes. Purging the cache of affected pages should correct the situation. To perform a mass-purge of all caches at once, touch the LocalSettings.php file or truncate the objectcache table in your database (you may have to do both).

You also need to have $wgUseDatabaseMessages set to true.

Lowercase link labels

If your links are not being capitalized as intended, try adding spaces around the bar character; for example:

** http://www.example.com/download.php?file=44555 | Download

Sections disappear or show unexpected content

If a section does not display or displays unexpected content, check that the header text isn't the name of an interface message by searching Special:AllMessages. If it is, use a different header text, or create a new interface message and use it.

For example, if you want to use "Sidebar" as header text, create the interface message "MediaWiki:Sidebar-header" containing only "Sidebar". Then, use * sidebar-header as header.

Sections are not displayed if there are no links of the form ** target|link text (e.g. when the target was forgotten).

Broken links after updating Special:Version

This will happen e.g., each time there are newer translations for your site language's sidebar items. One could add new redirect pages each time, but a better solution would be to use one's own sidebar item names instead of trying to keep track of the current MediaWiki translations.

Ancient versions of MediaWiki

If you have a pre-release version of 1.5 Beta, or earlier, it is still possible in some cases to edit the sidebar:

Prior to 1.5 branching (between rev:9150 and rev:9177) the message utilized was briefly MediaWiki:Navbar.
Before this, version 1.4 had (from rev:5528 to rev:9150) a global variable, titled $wgNavigationLinks.