Help:Extension:GlobalCssJs

Languages:

The GlobalCssJs extension allows users to create a JavaScript page and a CSS page to be loaded in every wiki of a wiki farm. If you go to Preferences > Appearance on any wiki where the extension is enabled you'll find links to your global scripts and style sheets:

Shared CSS/JavaScript for all wikis (more information):

Custom CSS | Custom JavaScript

On Wikimedia wikis, these global customizations are hosted on Meta-Wiki.

Global scripts (JavaScript)

Variables

When adding scripts to your global.js, be aware that, as with gadgets, variables declared with var example are not attached to the window object: they are local variables whose scope is a wrapper function inserted by ResourceLoader to implement the global module (which is called ext.globalcssjs.user). Therefore, if you plan to move a local script to the global module, and it needs to define global variables, make sure you use the syntax window.example to declare them.

Example

/* Any JavaScript added to this page will be loaded on all wikis where you have an account (see [https://www.mediawiki.org/wiki/Special:MyLanguage/Help:Extension:GlobalCssJs documentation]). */
window.myConfig=true;
// [[wikipedia:User:Lupin/popups]]
window.popupAdminLinks=true;
mw.loader.load('//en.wikipedia.org/w/index.php?title=User:Lupin/popups.js&action=raw&ctype=text/javascript');

Explicit URLs

You will need to pass a full URL to load the script.

Example

/* Any JavaScript added to this page will be loaded on all wikis where you have an account (see [https://www.mediawiki.org/wiki/Special:MyLanguage/Help:Extension:GlobalCssJs documentation]). */
mw.loader.load('//en.wikipedia.org/w/index.php?title=User:Lupin/popups.js&action=raw&ctype=text/javascript');

Per-wiki customization

Example

/* Any JavaScript added to this page will be loaded on all wikis where you have an account (see [https://www.mediawiki.org/wiki/Special:MyLanguage/Help:Extension:GlobalCssJs documentation]). */
// Define a few functions
functiononMultiLingualWikis(){
// ...
}
functiononWikibooks(){
// ...
}
functiononFrench(){
// ...
}
functiononRuWikisource(){
// ...
}
functiononEveryWiki(){
mw.loader.load('//www.mediawiki.org/w/index.php?title=MediaWiki:Gadget-UTCLiveClock.js&action=raw&ctype=text/javascript');
}
onEveryWiki();
if(/^(mediawiki|wikidata|meta|commons)wiki$/.test(mw.config.get('wgDBname'))){
onMultiLingualWikis();
}elseif(/wikibooks$/.test(mw.config.get('wgDBname'))){
onWikibooks();
}elseif(mw.config.get('wgContentLanguage')==='fr'){
onFrench();
}elseif(mw.config.get('wgDBname')==='ruwikisource'){
onRuWikisource();
}

To exclude a wiki

If you want to exclude a specific wiki, e.g. English Wikisource, you can wrap all or part of your global.js with:

if(mw.config.get("wgDBname")!=="enwikisource"){
// Whatever JavaScript you want to run on all wikis but enwikisource, goes here
}

Example: Set a global interface language

Extension:GlobalPreferences (if present) provides this functionality more conveniently.

/* Change language to German */
mw.loader.using('mediawiki.user',function(){
if(mw.user.options.get('language')!=='de'){
(newmw.Api()).postWithToken('csrf',{
action:'options',
change:'language=de'
}).then(function(){
mw.notify('Language has been changed to German. Please refresh the page.');
});
}else{
console.log('Language already set to German!');
}
});

Global style sheets (CSS)

Note: Any @import ... lines must be at the top.

Example

/* Any CSS added to this page will be loaded on all wikis where you have an account (see [https://www.mediawiki.org/wiki/Special:MyLanguage/Help:Extension:GlobalCssJs documentation]). */
/* Hide a few elements of the interface */
#n-help,
#footer{
display:none!important;
}

Per-skin customization

Currently the extension does not provide global CSS/JS for specific skins, but it is possible to customize CSS and JS for a skin globally. For CSS, you can edit the appearance of a specific skin by using classes such as skin-vector and skin-monobook, which are added to the body element automatically by MediaWiki. You can use the :not() selector to skip just one skin, e.g. :not(.skin-minerva) to not apply the rule to the mobile skin.

Example (CSS)

/* Any CSS added to this page will be loaded on all wikis where you have an account (see [https://www.mediawiki.org/wiki/Special:MyLanguage/Help:Extension:GlobalCssJs documentation]). */
/* Hide a few elements of the interface on vector skin */
.skin-vector#n-help,
.skin-vector#footer{
display:none!important;
}
/* Bold the sidebar interwiki links to en.wikipedia.org, simple.wikipedia.org, and interproject links to Commons/Wikivoyage */
.interwiki-en,.interwiki-simple,.wb-otherproject-commons,.wb-otherproject-wikivoyage{
font-weight:bold;
}

Example (JS)

/* Any JavaScript added to this page will be loaded on all wikis where you have an account (see [https://www.mediawiki.org/wiki/Special:MyLanguage/Help:Extension:GlobalCssJs documentation]). */
// Load JWB globally when using the Vector skin
if(mw.config.get('skin')==='vector'){
mw.loader.load('//en.wikipedia.org/w/index.php?title=User:Joeytje50/JWB.js/load.js&action=raw&ctype=text/javascript');
}

Retrieved from "https://www.mediawiki.org/w/index.php?title=Help:Extension:GlobalCssJs&oldid=7804280"