Difference between revisions of "Help:User style"

Revision as of 03:44, June 12, 2011

Any Special:login|logged in user can customize the design of the site through their personal stylesheet subpages. This allows you to view your own choice of fonts, colors, positions of links in the margins, and many other things.

To customize how site looks for you, create and edit User:user_name/style.css , where user_name is your user name, and style is the site style set in your preferences. By default, style may be one of

monobook
classic
nostalgia
cologneblue
myskin

Cascading Style Sheets (CSS) is used to style and format content on Wikia. The syntax of CSS is beyond the scope of this document. For most people, however, copying and pasting code is sufficient.

Once you have edited your stylesheet, you need to reload it to your browser. On most browsers, press Ctrl+Shift+R, or hold down the Alt key and press the Refresh button.

See Wikia custom skins for some examples of site-wide customisations. See also Wikipedia:Catalogue of CSS classes.

Sharing styles

You can use @import to include a stylesheet on this wiki or even another site. This way, you can reuse a stylesheet without copying all the code. For example, to include the borderless monobook style, add the following code to your stylesheet:

 @import "/index.php?title=Help:User_style/borderless_monobook_style&action=raw&ctype=text/css"

Useful CSS code

This section list some useful CSS code you can copy and paste. Some code here is reproduced from MetaWikipedia:Help:User_style.

General

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

/* replace the book in the background with something else */
body { background: rgb(250,250,250); }

/* changes the background of pre areas  */
pre { background: White }

/* Use a different logo */
#p-logo a { background-image: url(/images/6/6d/Wikia-crystal-ball.gif) !important; }

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

/* use browser prefs for text size and font */
body, #globalWrapper { font: inherit !important; }

/* always underline links */
:link { text-decoration: underline; }

/* 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 color 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; }

/* standard link colors */
:link { color: #0000FF; }
:link:visited { color: #7F007F; }
:link:active, :link.new { color: #FF0000; }
:link.interwiki, :link.external { color: #3366BB; }
:link.stub { color: #772233; }

Wikia

CSS code specific to Wikia.

/* hide Google search box (doesn't always work) */
#p-search > .pBody:last-child { display:none; }
#p-search > .pBody:first-child { display:block; }

/* hide only the links but not the message in the Wikia sidebar box */
#p-wikia-nav ul:first-child { display:none; }
#p-wikia-nav hr { display:none; }

MonoBook

CSS code specific to MonoBook.

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