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[]
Wikihowto's wide 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.