View source for Wiki143:Customisation

{{Short description|Wikipedia information page for user customisation}}
{{Template:Wikipedia programs}}
{{Information page|WP:CUSTOM}} 
'''Customisation''' of Wikipedia allows a [[WP:REGISTER|registered user]] to tailor the [[user experience]] of Wikipedia according to the user's [[Special:Preferences|preferences]]. User customisation affects only the user's own experience of Wikipedia; it does not affect the reading or editing experience of others. Only registered users can customise their experience of Wikipedia, and the customisation is visible only when the user is logged in.

Among many other things, registered users can customise the appearance of their [[WP:signature|signature]] when posting a comment on a [[WP:TALK|discussion]] (Talk) page. These signature customisations are visible to all users of Wikipedia.

==User name and signatures==<!-- This section is linked from [[Help:Contents]] -->

Your [[Wikipedia:Username policy|username]] is displayed in the edit histories of all the articles you contribute to and is linked to your user and talk pages. You choose your name when you first register on Wikipedia and it is usual to stay with the same name throughout your time on the project, though it is possible to [[Wikipedia:Changing username|request a change of username]].

You should always [[Wikipedia:Signatures|sign your posts on talk pages]]. Signatures are the text that appears before the timestamp when you put <nowiki>~~~~</nowiki> on a page. Signatures are customised using "[[Special:Preferences|my preferences]]" under "User profile"; consider [[WP:CUSTOMSIG|these guidelines]] when customising your signature.

You can use any wikitext as your signature (simply check the "Treat the above as wiki markup" box). If "Treat the above as wiki markup" is unchecked, the software treats this as your nickname and makes your signature "<nowiki>[[User:Name|Nickname]] ([[User talk:Name|talk]])</nowiki>" which is rendered as:

[[User:Name|Nickname]] ([[User talk:Name|talk]])

If something goes wrong and your signature stops working, see [[Wikipedia:How to fix your signature]].

== Preferences ==
{{main|m:Help:Preferences}}

The [[Special:Preferences|preferences]] link, visible to [[Wikipedia:How to log in|logged-in editors]], allows you to change a large number of options. There are 11 tabs (User profile, Math, Editing, etc.), of which two merit further discussion - the "Skin" tab and the "Gadgets" tab.

=== Skins ===
{{main|Wikipedia:Skin|m:Customization:Explaining skins}}

A MediaWiki skin is a style of page display. There are differences in the HTML code the system produces (but probably not in the page body), and also different style sheets ([[Cascading Style Sheets|CSS]]) are used.

The default is the Vector skin. There are a variety of [[Help:User style|user-made skins]] available for you to [[mediawikiwiki:Gallery of user styles|browse through]].

The special page [[Special:Preferences|My Preferences]] offers a preview of the various skins for the [[Main page]]. This is not exactly interesting for typical articles, therefore here's a list of previews for this page:

* [https://en.wikipedia.org/w/index.php?useskin=vector&title=Wikipedia:Customisation Vector (legacy)]
* [https://en.wikipedia.org/w/index.php?useskin=vector-2022&title=Wikipedia:Customisation Vector-2022]
* [https://en.wikipedia.org/w/index.php?useskin=minerva&title=Wikipedia:Customisation MinervaNeue]
* [https://en.wikipedia.org/w/index.php?useskin=modern&title=Wikipedia:Customisation Modern]
* [https://en.wikipedia.org/w/index.php?useskin=monobook&title=Wikipedia:Customisation Monobook]
* [https://en.wikipedia.org/w/index.php?useskin=timeless&title=Wikipedia:Customisation Timeless]

To test other pages replace the pagename in <code>title=Wikipedia:Customisation</code> in the URL. For modern browsers the default <code>vector</code> offers a wide range of user customisations.

Here's a table linking the ''raw'' CSS and JS for various skins, see also [[Help:User style]] for the [[Wikipedia:Common.js and common.css]].

{| class="wikitable"
! Skin
! colspan="2" | Default CSS 
! colspan="2" | Default JS
! [[Special:MyPage/skin.css|Personal CSS]]
! [[Special:MyPage/skin.js|Personal JS]]
|-
| ''Redirects to user's current skin''
|
|
| 
| || [[Special:MyPage/skin.css|User:<username>/skin.css]]
| [[Special:MyPage/skin.js|User:<username>/skin.js]]
|-
| '''Common (all skins)'''
| [[MediaWiki:Common.css]] || [{{fullurl:MediaWiki:Common.css|action=raw&ctype=text/css}}]
| [[MediaWiki:Common.js]]  || [{{fullurl:MediaWiki:Common.js|action=raw&ctype=text/js}}]
| [[Special:MyPage/common.css|User:<username>/common.css]]
| [[Special:MyPage/common.js|User:<username>/common.js]]
|-
| MinervaNeue
| [[MediaWiki:Minerva.css]] || [{{fullurl:MediaWiki:Minerva.css|action=raw&ctype=text/css}}]
| [[MediaWiki:Minerva.js]]  || [{{fullurl:MediaWiki:Minerva.js|action=raw&ctype=text/js}}]
| [[Special:MyPage/minerva.css|User:<username>/minerva.css]]
| [[Special:MyPage/minerva.js|User:<username>/minerva.js]]
|-
| Modern
| [[MediaWiki:Modern.css]] || [{{fullurl:MediaWiki:Modern.css|action=raw&ctype=text/css}}]
| [[MediaWiki:Modern.js]]  || [{{fullurl:MediaWiki:Modern.js|action=raw&ctype=text/js}}]
| [[Special:MyPage/modern.css|User:<username>/modern.css]]
| [[Special:MyPage/modern.js|User:<username>/modern.js]]
|-
| MonoBook
| [[MediaWiki:Monobook.css]] || [{{fullurl:MediaWiki:Monobook.css|action=raw&ctype=text/css}}]
| [[MediaWiki:Monobook.js]]  || [{{fullurl:MediaWiki:Monobook.js|action=raw&ctype=text/js}}]
| [[Special:MyPage/monobook.css|User:<username>/monobook.css]]
| [[Special:MyPage/monobook.js|User:<username>/monobook.js]]
|-
| [[WP:Vector|Vector]] Legacy (old default)
| [[MediaWiki:Vector.css]] || [{{fullurl:MediaWiki:Vector.css|action=raw&ctype=text/css}}]
| [[MediaWiki:Vector.js]]  || [{{fullurl:MediaWiki:Vector.js|action=raw&ctype=text/js}}]
| [[Special:MyPage/vector.css|User:<username>/vector.css]]
| [[Special:MyPage/vector.js|User:<username>/vector.js]]
|-
| Vector 2022 (current default)
| [[MediaWiki:Vector-2022.css]] || [{{fullurl:MediaWiki:Vector-2022.css|action=raw&ctype=text/css}}]
| [[MediaWiki:Vector-2022.js]]  || [{{fullurl:MediaWiki:Vector-2022.js|action=raw&ctype=text/js}}]
| [[Special:MyPage/vector-2022.css|User:<username>/vector-2022.css]]
| [[Special:MyPage/vector-2022.js|User:<username>/vector-2022.js]]
|-
| Timeless
| [[MediaWiki:Timeless.css]] || [{{fullurl:MediaWiki:Timeless.css|action=raw&ctype=text/css}}]
| [[MediaWiki:Timeless.js]]  || [{{fullurl:MediaWiki:Timeless.js|action=raw&ctype=text/js}}]
| [[Special:MyPage/timeless.css|User:<username>/timeless.css]]
| [[Special:MyPage/timeless.js|User:<username>/timeless.js]]
|}

These pages are named after the skins. The personal skin file names must be written in all lower-case and without any spaces to work properly, while the default skin files have the first letter in upper-case.

==== selectskin template ====

Placing {{tl|selectskin}} on a page adds links to switch between different skins easily. This is meant for [[Wikipedia:About the sandbox|test pages]], not for articles (or other pages in the article namespace). Below is an example of the template's output:

{{selectskin}}

=== Gadgets ===
The special page [[Special:Preferences|My Preferences]] has a "Gadgets" tab with a list of custom features you may enable for your account. These gadgets require JavaScript to be enabled in your browser. These tools are not part of the core MediaWiki software, and are generally developed and maintained by users on Wikipedia. Additional gadgets can be added by admins. The page [[Special:Gadgets]] shows the underlying user script(s) and/or CSS code used for each gadget.

== User scripts ==
{{main|Wikipedia:User scripts}}

There are many user-made tweaks that allow for easier and quicker editing. These often only work on specific skins. Almost all work on Monobook (the old default) and many have been tested on the new default (Vector), but exercise caution. If you're using a different skin, you should be aware that some user scripts may not work with that other skin.

Many user scripts can be implemented simply by checking a box in the Gadgets tab of "my preferences" (see above). For the remaining ones, you implement them by adding them to the appropriate personal JavaScript page. For example, for editor XYZ, using the default Vector skin, the page to be edited (and created, if necessary) would be User:XYZ/vector.js. Such pages can only be edited by the owner of that userspace (in this case, XYZ, regardless of who created the page) and by admins.

Incomplete list of pre-made customisations:

{| class="wikitable"
! Name
! Version
! Description
! Skins
! Author
|-
| align="center" | [[User:Cacycle/wikEd|wikEd]]
|
| A full-featured in-browser text editor for Wikipedia edit pages. Provides wikicode syntax highlighting, regular expression search and replace, MS Word and HTML to wikicode conversion, server-independent ''Show preview'' and ''Show changes'', fullscreen editing mode, and single-click fixing of common mistakes.
| align="center" | Any
| align="center" | [[User:Cacycle|Cacycle]]
|-
| align="center" | [[Wikipedia:Customisation/Edit Top|Edit Top]]
| 1.1.1
| Allows you to edit just the first section of an article.
| align="center" | MonoBook
| align="center" | [[User:pile0nades|pile0nades]]
|-
| align="center" | [[{{User:Lupin/navpopups}}|Navigation popups]]
|
| When you hover over links, popups appear which let you quickly access many editing features and preview articles and images.
| align="center" | Any
| align="center" | [[User:Lupin|Lupin]]
|}

== Personal CSS ==
{{main|Help:User style}}
{{see also|Help:Reference display customization}}
In addition to a personal JavaScript page, you can also have a personal page that uses [[Cascading Style Sheets]] (CSS) to modify the appearance of Wikipedia pages. As with JavaScript, the name of the page that the MediaWiki software will use depends on the skin you're using; the default is vector.css. So, for example, editor XYZ could add personal CSS code to the page User:XYZ/vector.css.

As with user scripts, the Gadgets tab of "my preferences" (see above) may include a personal CSS modification that you're interested in; if so, you can simply check a box rather than editing your personal .css page.

===Hiding specific messages===
{{shortcut|WP:CSSHIDE}}
:{{also|Help:User style#Samples}}
A common use of a user's CSS file, requiring direct editing, is hiding certain template messages. For example, you can hide [[Template:Editnotices/Namespace/Category]] (which appears when editing a category page) by adding

<syntaxhighlight lang="css">#category-namespace-editnotice { display: none !important; }</syntaxhighlight>

into [[Special:Mypage/skin.css]], which identifies your current skin's CSS file (open in new tab/window to see). If you use [[Wikipedia:Skin|multiple skins]], e.g. for a different desktop versus mobile look-and-feel, you can place that code in [[Special:Mypage/common.css]] so that it applies to all skins.

Note: you need to track down the specific id the relevant message uses; in this example, the ID is "category-namespace-editnotice". You may need to look at the wikitext of the message (e.g. the {{tl|fmbox}} template, used to build many template messages, has two possible parameters you might see used, <code>id</code> and <code>class</code>). If you don't see it, try asking at the [[WP:Helpdesk|Helpdesk]].

See the below for a list of commonly hidden elements.
{{Help:Infobox/user style|heading={{=}}{{=}}{{=}}Infoboxes and user style{{=}}{{=}}{{=}}}}

==Tidying up the user interface==
The following '''CSS''' code can be used to hide numerous user interface elements which may be of no use to some users :
<syntaxhighlight lang="css">
#p-coll-print_export, /* Print/export */
#mw-history-searchform, /* Search for revisions at top of history page */
#pt-prefswitch-link-on, 
#pt-prefswitch-link-anon,
#editpage-copywarn, /* By saving changes you agree to the terms of use... */
#editpage-copywarn2,
#wpSummaryLabel, /* Edit summary label */
#n-contents, /* link to Portal:Contents */
#n-shoplink, /* Wikipedia Store */
#n-featuredcontent, /* Portal:Featured content */
#n-currentevents, /* Portal:Current events */
#n-portal, /* Wikipedia:Community portal */
#n-aboutsite, /* Wikipedia:About */
#n-sitesupport, /* Donate to WP */
#n-randompage, /* Random Page */
#n-contactpage, /* Contact Us */
#n-mainpage-description, /* Visit Main Page */
#n-help, /* Help:Contents */
#t-upload, /* Upload link */
#t-wikibase, /* wikidata item */
#t-specialpages, /* Special Pages */
#t-recentchangeslinked, /* Recent Changes */
#t-cite, /* Information on how to cite this page */
#footer-info, /* Container for the next two */
#footer-info-lastmod, /* Last modified date */
#footer-info-copyright, /* Text is available under the... */
#footer-places, /* Privacy/About WP/... */
#footer-icons, /* WMF and MediaWiki icons */
#uploadtext, /* Tutorial on upload page (MediaWiki:Uploadtext) */
#pt-betafeatures, /* Beta tab */
#siteSub, /* From Wikipedia, the free encyclopedia */
#t-print, /* Printable version of this page */
#t-curationtoolbar, /* Page Curation */
#feedlinks, /* Atom/RSS */
.posteditwindowhelplinks, /* The (help) links for templates used, parser profiling data and hidden categories. */ 
.editpage-head-copywarn, /* Content that violates any copyrights... */
.cancelLink, /* Cancel button in edit box */
.editHelp /* Help button in edit box */ { display: none }  

#pt-userpage { background: none } /* hides image next to userpage */
</syntaxhighlight>

The following '''JS''' code can be used to hide the languages toolbar :
<syntaxhighlight lang="javascript">
$('#p-lang').remove();
</syntaxhighlight>

In [[Wikipedia:VisualEditor|VisualEditor]], to remove the edit summary help and license warning from VisualEditor's confirmation window, use this in '''CSS''' :
<syntaxhighlight lang="css">
.ve-ui-mwSaveDialog-summaryLabel,
.ve-ui-mwSaveDialog-license { display: none }
</syntaxhighlight>

==Replacing labels==

To replace 'User page' with 'User', 'Talk' with 'Discussion', 'View history' with 'History' add in '''JS''' :
<syntaxhighlight lang="javascript">
$( '#ca-nstab-user a' ).text( 'User' );
$( '#ca-talk a' ).text( 'Discussion' );
$( '#ca-history a' ).text( 'History' );
</syntaxhighlight>

When using VisualEditor, if you wish to replace the edit links labels, use the following '''JS''' code, and change the labels to your preference :
<syntaxhighlight lang="javascript">
$( '#ca-edit a' ).text( 'SourceEdit' );
$( '#ca-ve-edit a' ).text( 'VisualEdit' );
$( '.mw-editsection a' ).text( 'SourceEditSection' );
$( '.mw-editsection-visualeditor' ).text( 'VisualEditSection' ); // keep this line after the previous line
</syntaxhighlight>

==See also==
*[[Wikipedia:Scripts]]
*[[Wikipedia:User scripts]]
*[[Wikipedia:Tools]]
*[[Wikipedia:Gadget]]
*[[Wikipedia:User page design guide]]
*[[Wikipedia:Customizing watchlists]]
*[[Help:Preferences]]
*[[Wikipedia:Skin]]
*[[Help:User style]]
*[[Wikipedia:Visualizing redirects]]

{{Wikipedia technical help|collapsed}}

[[Category:Wikipedia features|{{PAGENAME}}]]

[[id:Wikipedia:Kustomisasi]]
[[te:వికీపీడియా:కస్టమైజేషన్]]
[[vi:Trợ giúp:Tùy chọn]]