Help:Reference display customization
![]() | This help page is a how-to guide. It details processes or procedures of some aspect(s) of Wikipedia's norms and practices. It is not one of Wikipedia's policies or guidelines, as it has not been thoroughly vetted by the community. |
You can customize how inline citations and reference lists appear to you when you are logged into your account by adding any of these rules to your CSS. After editing, bypass your cache.
Reference list
<syntaxhighlight lang="css"> /* Set the font size for reference lists */ ol.references, div.reflist, div.refbegin {
font-size: 90%;
} </syntaxhighlight>
- Change 90% to the desired size. See also Special:Preferences → Gadgets → Disable smaller font sizes of elements such as Infoboxes, Navboxes and References lists.
<syntaxhighlight lang="css"> /* Suppress display of the reference list */ ol.references {
display: none;
} </syntaxhighlight>
<syntaxhighlight lang="css"> /* Highlight clicked reference in blue to help navigation */ ol.references li:target, sup.reference:target, span.citation:target {
background-color: #DEF;
} </syntaxhighlight>
- See web colors.
<syntaxhighlight lang="css"> /* Reference list in a box with a scrollbar */ @media screen {
div.reflist { overflow-x: hidden; overflow-y: auto; padding-right: 0.5em; max-height: 320px; }
}</syntaxhighlight>
<syntaxhighlight lang="css">
/* Disable columns for
and
.references-column-count, .references-column-width {
column-count: 1 !important; column-width: auto !important; -moz-column-count: 1 !important; -moz-column-width: auto !important; -webkit-column-count: 1 !important; -webkit-column-width: auto !important;
} </syntaxhighlight>
- To set a fixed number of columns, change
1
to the desired number.
<syntaxhighlight lang="css"> /* Add dividers (rules) between columns */ .references-column-count, .references-column-width {
column-rule: 1px solid #aaa; -moz-column-rule: 1px solid #aaa; -webkit-column-rule: 1px solid #aaa;
} </syntaxhighlight>
- You can alter the appearance of the dividers by changing the values.
To show the reference list in a collapsible box, see User:TheDJ/Folded references.
In-text cites
Hide in-text footnote markers:
Edit your common JavaScript and add:
{{subst:iusc|User:Zhaofeng Li/RefToggle.js}}
Keep reference superscript and subscript text from breaking the line-spacing <syntaxhighlight lang="css">
- content sup.reference {
vertical-align: baseline; _vertical-align: bottom; position: relative; bottom: 0.33em;
}
- content sub.reference {
vertical-align: baseline; _vertical-align: bottom; position: relative; bottom: -0.25em;
} </syntaxhighlight>
This fixes a cosmetic issue with Internet Explorer where a wikilink followed immediately by an in-text cite may cause the link and cite to be underlined together; not supported by IE6 and IE7 <syntaxhighlight lang="css"> /* Add a zero-width space before the in-text citation */ sup.reference:before {
content: "\200B"; text-decoration: none;
} </syntaxhighlight>
This will join the in-text cite to the preceding text, preventing it from wrapping; it does not add a space; does not work for Internet Explorer <syntaxhighlight lang="css"> /* Add a zero-width joiner before the in-text citation */ sup.reference:before {
content: "\200D"; text-decoration: none;
} </syntaxhighlight>
This will join the in-text cite to the preceding text, preventing it from wrapping; a space will show between the text and the in-text cite; not supported by IE6 and IE7 <syntaxhighlight lang="css"> /* Add a non-breaking space before the in-text citation */ sup.reference:before {
content: "\A0"; text-decoration: none;
} </syntaxhighlight>
Hide the brackets for the inline cite <syntaxhighlight lang="css"> /* Hide the brackets for the inline cite */ sup.reference a span {
display: none;
} </syntaxhighlight>
Hide in-text cites <syntaxhighlight lang="css"> /* Hide in-text cites */ .reference {
display: none;
} </syntaxhighlight>
Larger, bolder in-text citations <syntaxhighlight lang="css"> /* Larger, bolder in-text citations */ p sup.reference a {
font-weight: bold; font-size: 140% !important; color: #55C !important; background: #FFF !important;
} hover sup.reference a {
background: #FFFF00 !important; color: #1010FF !important;
} hover sup.reference a:visited {
color: #5A3696 !important;
} hover sup.reference a:active {
color: #FAA700 !important; background: #0808F8 !important;
} </syntaxhighlight>
Inconspicuous in-text citations
The :before and :after pseudo-elements are not supported by IE6 and IE7 <syntaxhighlight lang="css"> /* inconspicuous in-text citations */ sup.reference {
white-space: nowrap;
} sup.reference a {
font-size: 0.85em; font-weight: lighter
} sup.reference:after {
content: ' '; /* non-break space after cites */ text-decoration: none;
} sup.reference a span {
display: none; /* hide the brackets */
} p sup.reference a, tr sup.reference a, caption sup.reference a, ol sup.reference a, ul sup.reference a, dl sup.reference a {
color: black;
} p:hover sup.reference a, tr:hover sup.reference a, caption:hover sup.reference a, ol:hover sup.reference a, ul:hover sup.reference a, dl:hover sup.reference a {
color: rgb(0, 43, 184); text-decoration: underline;
} p:hover sup.reference a:visited, tr:hover sup.reference a:visited, caption:hover sup.reference a:visited, ol:hover sup.reference a:visited, ul:hover sup.reference a:visited, dl:hover sup.reference a:visited {
color: #5A3696;
} p:hover sup.reference a:hover, tr:hover sup.reference a:hover, caption:hover sup.reference a:hover, ol:hover sup.reference a:hover, ul:hover sup.reference a:hover, dl:hover sup.reference a:hover {
color: #002BB8;
} p:hover sup.reference a:active, tr:hover sup.reference a:active, caption:hover sup.reference a:active ol:hover sup.reference a:active, ul:hover sup.reference a:active, dl:hover sup.reference a:active {
color: #FAA700;
} </syntaxhighlight>
Popups
To add popups for the in-text citation that show the full citation, see User:Blue-Haired Lawyer/Footnote popups.
Also, the Gadget at Special:Preferences#mw-prefsection-gadgets->Browsing->Reference Tooltips.
Error messages
By default error messages only show for article, user, template, category, help and file pages. Errors do not show on talk, wikipedia, mediawiki, portal and book unless enabled:
<syntaxhighlight lang="css"> /*show cite errors on all pages*/ span.brokenref {
display: inline;
} </syntaxhighlight>
Additionally, in the Article namespace citation templates suppress non-fatal errors by default. These messages can be made visible using: <syntaxhighlight lang="css"> .mw-parser-output span.cs1-hidden-error { display: inline; } </syntaxhighlight>