Wikia

Harry Potter Wiki

Help:Customizing Monobook

Talk0
Construction-cone-icon-link This page is about Monobook, a non-default skin.

This page lists some notes regarding customizing the Monobook skin. Please make sure that you do not break Wikia's terms of use by hiding or moving the advertisements on purpose.

Sample monobook logo

The logo of the Monobook skin, which is defined by the image File:Wiki.png, can be up to 150x155 pixels in size. While the logo can be larger than that, it is strongly discouraged as it can hinder the appearance of the skin. See the image to the right to get a rough idea of how large the logo should be.

Sidebar

It is also possible to customize the sidebar of the Monobook skin. It is defined in MediaWiki:Sidebar, but can only be edited by administrators. The default sidebar looks like this:

Link text Description Associated MediaWiki page(s)
Main page The home page of the wiki. Mainpage
Community portal Links to community pages. Portal, Portal-url
Current events News in the area your wiki is about. Currentevents
Recent changes Recent edits on the wiki. Recentchanges
Random page Go to a random page (main namespace only). Randompage
Help A list of help pages. Help, Helppage

Here is a few basic notes regarding the sidebar. Type the words in bold matching it's description on MediaWiki:Sidebar to get that result on the sidebar:

  • * [menu name] - Defines a new menu on the sidebar. Replace "[menu name]" with what you wish to call that menu.
  • * SEARCH - Moves the position of the search box on the sidebar.
  • * TOOLBOX - Moves the position of the toolbox menu on the sidebar.
  • ** mainpage|mainpage-description - Links to the main page on the wiki. For use with the first example.
  • ** randompage-url|randompage - Loads a random page on the wiki. For use with the first example.
  • ** recentchanges-url|recentchanges - Recent changes on the wiki. For use with the first example.

Furthermore, administrators can rename the toolbox menu on the sidebar using MediaWiki:Toolbox. Most communities will probably not need to know this, but this may be useful for communities who have heavily customized their wiki.

Tagline

The tagline of a wiki in the Monobook skin displays just below the name of each article in that wiki. It can be edited by administrators in MediaWiki:Tagline. For example, the House Wiki edited their tagline to say "House Wikia contains spoilers (and zebras)," as displayed here:

MonobookTagline

By default, the page element that contains the tagline is invisible. To change this, add the following lines to your wiki's MediaWiki:Common.css file.

/* Display text below main article header, located at MediaWiki:tagline */
#siteSub {
    display: inline;
    font-size: 90%;
    font-style: italic;
}

The code display:inline; is the key part of this CSS; you can adjust or add further attributes as desired for your wiki.

Your tagline will now be displayed. Important note: You may have to reload the page or bypass your cache to see the results!

For advanced users

If you want to go further, it is also possible to customize the wiki's CSS and Javascript files for the Monobook skin at MediaWiki:Monobook.css and MediaWiki:Monobook.js (provided that you are an administrator at the wiki). Here is some sample CSS code to get beginners started:

/* suppress the person icon by your username */
li#pt-userpage { background: none }

/* make the background behind the content area and the tabs orange */
#content, #content table
#p-cactions ul li :link { background: orange; }

/* change background of unselected tabs */
#p-cactions ul li a { background: #C7FDC7; }

/* change background of selected tabs */
#p-cactions ul li.selected a { background: white; }

/* change border colour of selected tabs */
#p-cactions li.selected { border-color: #aaaaaa; }

/* style the search box and the buttons below it */
input.searchButton {
    background-color: #efefef !important;
    border: 1px outset !important;  
}
#searchInput { border: 1px inset !important; }

/* don't use any logo */
#p-logo { display: none; }
#column-one { padding-top: 2.4em; }

/* change the position of the search box */
#p-search {
	left:0;
	min-width:1032px;
	position:absolute;
	top:22px;
	width:100%;
	border-bottom: 0 none;
}
#p-search h5{ display:none;}
#p-search .pBody {
	float:right;
	margin-right:50px;
	width:255px;
	border-radius:4px 4px 0 0;
	-moz-border-radius:4px 4px 0 0;
	-webkit-border-radius:4px 4px 0 0;
	-o-border-radius:4px 4px 0 0;
	-khtml-border-radius:4px 4px 0 0;
}

See also

Around Wikia's network

Random Wiki