How To Wiki
Advertisement

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[]

[]

Wiki wide

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.

NavLinks[]

Mediawiki

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
Slate
  • main.css
  • 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;
}

Footer[]

...to be added...

See Also[]

References[]

From HowTo Wiki, a Wikia wiki.
Advertisement