more wikis
 

Help:Changing the style of interwiki links

From Wikia Help

Contents

An interwiki link is a special type of external link. Typical external links have a special icon, normally File:External link icon.png (an arrow coming out of a box), alerting users that the link takes them to a different site, as well as a slightly different-shaded blue than normal links. On the other hand, interwiki links only use link coloring (same as normal external links), without the graphical icon to warn users.

All interwiki links on Wikia have classes based on where they lead, you can style them individually. The following is a guide on how to add and customize the design of interwiki links.

Notes
  • Each description is followed by an example of the CSS code to use, using the idea of small images following the link. This can be modified to your liking.
  • When using images, be careful that they do not cause problems on dark skins if one is likely to be used on your wiki.
  • Replace IMAGELINK with links to your desired link image.

Putting the same warning icon on all interwiki links

All interwiki links have the class extiw.

#bodyContent a.extiw {
  background: transparent url(IMAGELINK) no-repeat scroll center right;
  padding-right: 18px;
}

Custom Wikia-wide icons

Links to all Wikia wikis

This affects all links with the [[w: syntax.

#bodyContent a.interwiki-w, #bodyContent a.interwiki-w:active, 
#bodyContent a.interwiki-wikia, #bodyContent a.interwiki-wikia:active,
#bodyContent a.interwiki-wikicities, #bodyContent a.interwiki-wikicities:active {
  background: transparent url(IMAGELINK) no-repeat scroll center right;
  padding-right: 18px;
}

Cross Wikia links

This is only required if you wish to have a different icon to the Central Wikia icon.

This affects all links with the [[w:c: syntax.

#bodyContent a[href^="http://www.wikia.com/wiki/c:"], #bodyContent a[href^="http://www.wikia.com/wiki/c:"]:active {
  background: transparent url(IMAGELINK) no-repeat scroll center right;
  padding-right: 18px;
}
#bodyContent a[class~^="wikia-"], #bodyContent a[class^="wikia-"]:active {
  background: transparent url(IMAGELINK) no-repeat scroll center right;
  padding-right: 18px;
}

Custom specific Wikia wiki icon

This affects any particular wiki linked to via the [[w:c: syntax.

Guild Wars
#bodyContent a.interwiki-w.wikia-guildwars, #bodyContent a.interwiki-w.wikia-guildwars:active, 
#bodyContent a.interwiki-wikia.wikia-guildwars, #bodyContent a.interwiki-wikia.wikia-guildwars:active {
  background: transparent url(IMAGELINK) no-repeat scroll center right;
  padding-right: 18px;
}

Custom Wikipedia/non-Wikia icons

This applies to wikis on Wikia's interwiki map, who take the link form [[interwikicode:pagename]].

The resulting class will be interwiki-interwikicode.

Wikipedia
#bodyContent a.interwiki-wikipedia, #bodyContent a.interwiki-wikipedia:active {
  background: transparent url(IMAGELINK) no-repeat scroll center right;
  padding-right: 18px;
}
MediaWiki.org
#bodyContent a.interwiki-mw, #bodyContent a.interwiki-mw:active {
  background: transparent url(IMAGELINK) no-repeat scroll center right;
  padding-right: 18px;
}
Uncyclopedia
#bodyContent a.interwiki-uncyclopedia, #bodyContent a.interwiki-uncyclopedia:active {
  background: transparent url(IMAGELINK) no-repeat scroll center right;
  padding-right: 18px;
}

See also

For additional ways to change how the link looks, check out any CSS tutorial on the web (search).