Forum:Global CSS and JavaScript

Hi all, we're rolling out a new feature (which was supposed to exist for the last few months, but it got lost with the upgrade), which is global CSS and JavaScripts.

On Central Wikia, you can edit Special:Mypage/global.css and Special:Mypage/global.js and the changes you'll put there will be visible on all 1.10 wikis (at this moment - almost every wiki apart from our biggest ones). Some technical info:


 * the files are loaded for every skin
 * if you want to code JavaScript only for a specific skin, make use of the  variable in JavaScript, where every wiki stores its skin name
 * the CSS is loaded after the default MediaWiki CSS, but before the site specific CSS, so if you want to overwrite the site's CSS (not recommended), make use of the !important property
 * it is advisible to use the CSS only to style your JavaScript additions, since there's no way to determine which skin is active on the wiki (yet)

Soon we'll roll out two new global files on Central, MediaWiki:Global.css and MediaWiki:Global.js, but they'll be available only for staff to add CSS/JS globally for every user (both logged in and anonymous). We'll probably put the most popular CSS and JS there, so including them on your wikis will be as simple as adding the correct class/ID to your divs, without playing with JavaScript (right now, I mean of the dropdown boxes, some extra menus, etc.).

Hope you'll like this new feature and provide us feedback on it :). Datrio 10:30, 13 June 2007 (UTC)

Rar, about time. ;) --Jack Phoenix (Contact) 10:33, 13 June 2007 (UTC)


 * About MediaWiki:Global.css and MediaWiki:Global.js, I see that sometimes the file http://www.wikia.com/skins/common/wikibits.js is changed and not only when an upgrade has done (in es.pokemon had some issues with the location of the table sorting code) so what's the difference between changing the code in wikibits.js or in a system message? Since there's no javascript variable indicating the MediaWiki version running they must be more careful with the incompatibilities... --Ciencia Al Poder (talk) -@WikiDex 18:13, 13 June 2007 (UTC)


 * Differences... ^_^ Here's one... With a global message, people like me can add things like my upgraded Show/Hide script for various wiki to use. Heck, if I was allowed, I could make it possible for someone to enable the helpfull types of user javascript stuff on my tricks page without the annoying code. Hmmm, includeJS and includeCSS would probably be a very, very good addition to a global script. That way we can let someone just use  to include one of the scripts we have here instead of the long code. ~Dantman(talk) tricks  Jun 13, 2007 @ 18:33 (UTC)


 * Please, use the DOM in your includeJS/CSS as the pages are XHTML and using DOM is the proper way to do that. document.write could have unexpected behavior. And, for CSS, since CSS is cascading style sheet, the location of the styles is very important to interpret them, and you have no control where the style would be put in the page. And now all browsers support DOM to do something like:

var script = document.createElement('script'); script.setAttribute('type', 'text/javascript'); script.setAttribute('src', '/index.php?title=MediaWiki:Edit.js&action=raw&ctype=text/javascript&usemsgcache=yes'); document.getElementsByTagName('head').item(0).appendChild(script);
 * Also, I used not to rely on functions that eventually could change with little effort (it is more difficult to change things in wikibits.js). I'm sure you would add some useful things, but hope not to load some hundreds of kilobytes in each page. It would depend on if the javascript will be included in "/index.php?title=-&action=raw&smaxage=0&gen=js" where some browsers won't put in the cache, or if it will be in a separate file. --Ciencia Al Poder (talk) -@WikiDex 19:42, 13 June 2007 (UTC)


 * Dantman: That isn't what MediaWiki:Global.js is for (and no, you will generally not be allowed to include things like that). This is more for things like emergency hacks to fix/hide broken features during a weekend when there are few developers around, or to patch to a broken feature that is not deemed an emergency priority fix (and may be around for several weeks), or for us and the technical team to test additional javascript prior to it being globalized in wikibits.js (or other uneditable file). Anyway, I don't want to see any edits to that file without express permission and code clearance from Datrio, unless there are extenuating circumstances (and they'd better be good, heh).
 * Ciencia Al Poder: They should be loaded as new &lt;script&gt; and &lt;style&gt; tags, so should be globally cached. But even so, we won't be adding anything big or unnecessary like wookieepedia's Functions.js globally (and especially not things like ). --Splarka (talk) 08:28, 14 June 2007 (UTC)


 * Ok, thanks for the explanation. I was worried about using it as a collection of unnecessary code that could have problems with local code hacks. In this case it would be useful, I think :) --Ciencia Al Poder (talk) -@WikiDex 17:41, 14 June 2007 (UTC)

Slight tangent: here is an example of how you can use your personal JS here (some various tools): User:Splarka/global.js. --Splarka (talk) 10:57, 14 June 2007 (UTC)