Quartz is an older default skin for Wikia wikis.
Themes[]
There are seven available themes for the Quartz skin.
- Quartz-sapphire
- Quartz-slate
- Quartz-smoke
- Quartz-sappier
- Quartz-beach
- Quartz-brick
- Quartz-gamer
- Quartz-custom
Setting default skin[]
To set your wiki's default skin
- Edit Mediawiki:AdminSkin and enter the skins name in all lowercase
- or
- Set it in your User -- preferences -- skin -- Admin Options -- Set the default theme for this wiki:
Example of Wikihowto's: Mediawiki:AdminSkin
Logos[]
Main logo[]
The new logo file for the logo/icon in the left top corner is named Wiki_wide.png. The maximum allowed size of this logo is 266x75 pixels.
Favicon.ico[]
This is the icon that is shown in the location bar of your browser. Have the image to 'Favicon.ico'. It should be 16px x 16px icon file (this is not a bitmap renamed with the extension .ico). It can be b/w, 16 color, or 256 color.
MediaWiki namespace[]
The MediaWiki namespace is the location for admins to edit menus, standard pages, warnings, etc. The files are named MediaWiki:xxxxx. Some of these apply to all skins while others are specific to Wikia's Quartz skins. There are dozens of configurations that can be made here.
A list of Wikihowto's MediaWiki configs can be found here, and Wikia's can be found Here
Sidebar box[]
The sidebar is the box that contains links to the main page, help page, and other basic links. Links in the sidebar are set on the MediaWiki:Sidebar page. Wikihowto has the following configuration, which appears as the box on the left.
* main ** mainpage|mainpage ** Wikihowto:About|About Wikihowto ** recentchanges-url|recentchanges ** helppage|help * navigation ** Portal:Main|Howto Portal ** Help:Find|Find a Howto ** Help:Create|Make a Howto ** randompage-url|randompage *page lists **Help:Objects_List|Objects **Help:Howto_List|Howtos **Help:Guide List|Guides
Some of these are variables with default settings. For example helppage is set to link to Help:Contents. You can set these variables yourself by altering other MediaWiki pages, such as MediaWiki:helppage See: Howto customize your MediaWiki site's appearance and functionality using the Mediawiki namespace for more details. Wikihowto's file can be found here.
Toolbox[]
The toolbox is similar to the sidebar. The configuration file is MediaWiki:Toolbox, however the only the editable in it is the header.
[]
There are a column of links near the top center of the page that list by default:
- Home
- Forum
- Random page
- Create a new article
They are called NavLinks and can be altered in the MediaWiki:Navlinks file. Up to two columns can be added.
- Example code
*1 **home|home ....tobe finished.....
Configuration file[]
Installing CSS Viewer for Firefox helps editing and debugging the CSS code.
- The main configuration for the QuartzSlate skin is MediaWiki:Quartzslate.css, and MediaWiki:Quartzsmoke.css for Quartzsmoke. Any settings written in these file will override the default setting for the respective skin. MediaWiki:common.css overrides all other configurations for all skins. These file is written in CSS code.
Quartz CSS files[]
Full content wikicss files
- Smoke
- Full css code from all loaded css files: this is useful when you are trying to match a html tags, id or class with the default css parameters
- Wikihowto's file: MediaWiki:Quartzsmoke.css
- Slate
- Full css code from all loaded css files: this is useful when you are trying to match a html tags, id or class with the default css parameters
- Wikihowto's file: MediaWiki:Quartzslate.css
Configurations[]
These configurations are made in both the css files and MediaWiki namespace.
Header section[]
The header section consists of a number of sections, the user, search....
table#navLinksWikia a { color: #0e2422; background-image: url(http://images.wikia.com/howto/en/images/f/f1/Skin_bullets.gif); } #header, ul#wikia, ul#wikia li { background-image: url(http://images.wikia.com/howto/en/images/0/09/Skin_header_bg.gif); } #header a { color: #dddddd; } #header a:hover { color: #bbbbbb; } #header { color: #ffffff; }
User section[]
ul#welcome li.user { color: #e7b24e; background-image: url(http://images.wikia.com/halo/images/9/9b/Skin_user_menu.gif); } .roundedDiv div.r_boxContent, .roundedDiv b.xb2, .roundedDiv b.xb3, .roundedDiv b.xb4, #userMenu{ background-color: #0e2422; } #userMenu a { color: #FFF !important; } #userMenu a:hover { color: #FFF; background-color: #0e2422; }
Search section[]
#search div { background-image: url(http://images.wikia.com/halo/images/d/d6/Skin_search.gif); } #search input { border-color: #e7b24e; }
Body[]
body { background-position: top right; background-repeat: repeat-x; background-color: #b5c2be; }
Article box[]
#article { position: relative; } .articleBar, .articleBar div { background-image: url(http://images.wikia.com/howto/en/images/e/e7/Skin_article_bars.gif); } #article { background: #FFF; font-size: 127%; line-height: 1.5em; padding: 15px; min-height: 300px; border-width: 1px; border-style: solid; border-color: #9b753f; }
Top content box[]
The following hides the Top content box (this no longer works)
#WidgetTopContent_1_wg { display: none; }
Wikia spotlights box[]
The following sets the spotlights boxes background color.
#spotlights { background-color: #0e2422; }
[]
...to be added...
See Also[]
References[]
- Wikia's official quartz skin configuration
- Wikia: Wiki configuration
- Wikia: Featured Wikia Design
- Code examples taken from here.