Difference between revisions of "Help:User style"
(this is as old as Burns O.O -) |
|||
Line 1: | Line 1: | ||
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. | 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/ | + | To customize how site looks for you, create and edit User:user_name/Help:Style|style.css , where <var>user_name</var> is your user name, and <var>style</var> is the site style set in your [[Special:Preferences|preferences]]. By default, <var>style</var> may be one of |
* monobook | * monobook | ||
* classic | * classic | ||
Line 16: | Line 16: | ||
== Sharing styles == | == Sharing styles == | ||
− | You can use <code>@import</code> 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 | + | You can use <code>@import</code> 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 Help:User style/borderless monobook style|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" | @import "/index.php?title=Help:User_style/borderless_monobook_style&action=raw&ctype=text/css" | ||
Revision as of 03:45, 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/Help:Style|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 Help:User style/borderless monobook style|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; }
References
See also MetaWikipedia:Help:User style