How to add custom global javascript in mediawiki

Question

How to add a custom javascript file (say custom.js ) to the mediawiki installation?

For example, if I put custom.js in the resources/lib/ folder, how can I upload this to every page?

I am not trying to do this as part of an extension, and I would rather save the changes to LocalSettings.php .

Answer 1

As garryp already suggested, you can put JavaScript code in MediaWiki: Common.js . Please note that this is not a file, but just a page that you can edit (as an administrator) on your wiki. For example, here is the MediaWiki: Common.js page on the English Wikipedia .

JavaScript code from Common.js is only loaded if $ wgUseSiteJs is enabled . However, this is the default value, so it should work if you did not intentionally disable it by adding a line like $wgUseSiteJs = false; file $wgUseSiteJs = false; .

---

You can also load JavaScript code from a file using ResourceLoader , but it's a little more complicated. However, as a quick example, if you had files named foo/bar.js and foo/baz.js in your main MediaWiki directory, you can load them by adding the following code to the LocalSettings.php file:

 // register a ResourceLoader module... $wgResourceModules['custom.foo.whatever'] = array( 'scripts' => array( 'foo/bar.js', 'foo/baz.js' ), // could eg add dependencies on core modules here ); // ...and set up a hook to add it to every page function addMyCustomScripts( &$out ) { $out->addModules( 'custom.foo.whatever' ); return true; } $wgHooks['BeforePageDisplay'][] = 'addMyCustomScripts'; 

Basically, this method is mostly useful for extension authors who can use it to load CSS and JS code as needed. See the $ wgResourceModules and BeforePageDisplay documentation for more details . details, including additional module parameters (and core modules ).

Answer 2

Using common.js is a good idea.

Another option is to define it for loading in LocalSettings.php:

 # Add onBeforePageDisplay function to BeforePageDisplay Hook $wgHooks['BeforePageDisplay'][] ='onBeforePageDisplay'; function onBeforePageDisplay( OutputPage &$out, Skin &$skin ) { $script = '<script type="text/javascript" src="https://example.com/javascript.js"></script>'; $out->addHeadItem("itemName", $script); return true; }; 

Answer 3

Put the code on the "MediaWiki: common.js" page of your wiki

http://www.mediawiki.org/wiki/Manual:Interface/JavaScript

Also see below page for custom skins.

Answer 4

You can put javascript code on the "MediaWiki: common.js" page of your wiki.

In the new new wiki you will create this page. Since in the namespace "MediaWiki" you may run into permission problems. You cannot edit the page unless you are an admin user. Go to the "Special: ListUsers / sysop" page to find out which of the admin users are and make sure that you are logged in as one of them ( can’t remember the password? ). Once you overcome these obstacles and be able to edit "MediaWiki: common.js" ...

You can place any javascript there, and it should be downloaded for all users, regardless of their user group or skin choice (hence the name "general"). After changing it, remember that your browser can cache . Browse through any wiki page and do ctrl + refresh and the new javascript should start.

If you have javascript in the file that you want to download (downloaded from your wiki files or hosted on an external site), you can do this via ResourceLoader. Ilmari Karonen described how to do this as editing on LocalSettings.php, but a different approach ...

You can use the ResourceLoader on the "MediaWiki: common.js" page . For example, edit the page and just add one line:

 mw.loader.load( 'https://some.website.com/some-javascript.js' ); 

See the "mw.loader.load" section in mediawiki.org ResourceLoader / Modules docs .

We used the addOnloadHook event, which should have followed the loading, so we ended up jQuery with it:

 jQuery.getScript( 'https://some.website.com/some-javascript.js', function() { addOnloadHook(function() { someJavaScript.thingToRunOnLoad(); }); });