Help:CSS: Difference between revisions

m
Bot: Automated text replacement (-^ +{{Status|Halopedia}}\n)
(Created page with "'''CSS''' (officially known as '''Cascading Style Sheets''') sets how a page looks. On a special sub-page on your user page, you can override the ''Monobook skin'' to create your...")
 
m (Bot: Automated text replacement (-^ +{{Status|Halopedia}}\n))
 
(5 intermediate revisions by 3 users not shown)
Line 1: Line 1:
'''CSS''' (officially known as '''Cascading Style Sheets''') sets how a page looks. On a special sub-page on your user page, you can override the ''Monobook skin'' to create your own personal look for the wiki.
{{Status|Halopedia}}
'''CSS''' (officially known as '''Cascading Style Sheets''') sets how a page looks. On a special sub-page on your user page, you can override Halopedia's ''Monobook'', ''Nimbus'', or ''Vector'' skins to create your own personal look for the wiki.


==Background==
==Background==
Line 26: Line 27:
</pre>
</pre>


==Creating Your Monobook.css==
==Creating your own custom CSS==
Everyone has their own skin page at <tt>User:''Username''/monobook.css</tt>, with stress on the lower case '''m'''. When editing it, you should see some new text:
Halopedia has three different skins, Monobook, Nimbus, and Vector. Each user has there own custom CSS page for each skin.
*'''Monobook''': <tt>User:''Username''/monobook.css</tt>
*'''Nimbus''': <tt>User:''Username''/nimbus.css</tt>
*'''Vector''': <tt>User:''Username''/vector.css</tt>,
 
Note that each skin name starts in lower case . When editing it, you should see some new text:
<blockquote>
<blockquote>
'''Tip:''' Use the 'Show preview' button to test your new CSS/JS before saving.
'''Tip:''' Use the 'Show preview' button to test your new CSS/JS before saving.
</blockquote>
</blockquote>
Whatever is entered into here is put into a style sheet (inbetween <style> and </style> tags). So, it is only necessary to put the list of selectors you want to change, with their properties and values, no "header" or "footer". If you want to add comments (text that the CSS won't read), put it inbetween <tt>/*</tt> and <tt>*/</tt>. While you can preview the new CSS, some changes (like to the categories table) require you to save it first.
Whatever is entered into here is put into a style sheet (inbetween <style> and </style> tags). So, it is only necessary to put the list of selectors you want to change, with their properties and values, no "header" or "footer". If you want to add comments (text that the CSS won't read), put it in between <tt>/*</tt> and <tt>*/</tt>. While you can preview the new CSS, some changes (like to the categories table) require you to save it first.


To see the changes after saving, ''hard'' refresh (press the F5 key, sometimes Ctrl + F5). Congratulations, you now have your own unique skin.
To see the changes after saving, you need to clear your cache, which can be done by doing a ''hard'' refresh (press the F5 key, sometimes Ctrl + F5). Congratulations, you now have your own unique skin.


[[Category:Help|{{PAGENAME}}]]
{{Halopedia HAGP}}
[[Category:Help]]