Wikipedia:WikiProject User scripts/Tutorial

From Wikipedia, the free encyclopedia

[edit] Using Our Scripts

[edit] Starting up

First off, many of our scripts only work for the Monobook skin, so you may want to change that in your preferences. Now, go to our scripts and click on one that you want (only use the independent module for now; the advanced functions are...well, advanced). Copy the code for it and paste it into your monobook.js page. If the particular module you wanted requires some advanced function, copy the code for that and put it either at the top or bottom of your monobook.js. This is so that it stays organized: all the modules in one place, all the functions in another. Save your monobook.js and then follow the instructions at the top of your new monobook.js (the part about bypassing your browser's cache). You should now be able to use the script.

[edit] Adding more

To add another module, follow the same instructions. (If it requires a function that you already have, you do not need to add it to your monobook.js again.) Paste the code either above or below the previous code so that the new code does not interfere with it.

[edit] Writing Your Own Scripts

[edit] Prerequisites

To write monobook.js scripts, you will need to have some knowledge of JavaScript. Try these links if you do not already know it: [1] [2] [3] [4]. Also, it would definitely help if you tried using one of our scripts and got it working. The rest of this tutorial assumes you know where the various things are (all explained in the "Starting up" section).

[edit] Creating your first script

We will be writing an independent module by modifying monobook.js, so you may want to get our module template. For the purpose of this tutorial, we will write a simple version of the Quick wikify module, so change MODULE_NAME in the module template to "Qwikify". Your template should now look like this:

// Qwikify
addOnloadHook(
    function () {
        MODULE_CODE;
    }
);

In MODULE_CODE, we want to add the "wikify" tab, so we will use the addTab function (which requires Add LI link). Replace MODULE_CODE with a call to this function. In the URL, we will call another function named doQwikify() that will actually execute the code, so it should be "javascript:doQwikify()". The name is what is shown on the tab, so set that to "wikify". Most tabs have an id of "ca-(their name)", so set the id to "ca-wikify". The title (also known as mouseover or rollover text) should be something like "Mark for wikification". The key is the ALT+(key) keyboard shortcut. Unfortunately, both "q" and "w" are already taken, so, unless you want to set something else, just put "" or leave that argument out. Altogether, your new function should look like this:

// Qwikify
addOnloadHook(
    function () { 
        addTab("javascript:doQwikify()", "wikify", "ca-wikify", "Mark for wikification");
    }
);

Now, we must write our doQwikify() function. It will edit the edit box, so we need to get the name of that and it's form. Viewing the source of the page shows that the form is named editform and the textbox is named wpTextbox1. So, the text inside the textbox is document.editform.wpTextbox1.value. To add {{wikify}} (and two new lines), we simply do:

document.editform.wpTextbox1.value = "{" + "{wikify}}\n\n" + document.editform.wpTextbox1.value;

(We separate the two "{" brackets in the front of the wikify template so it doesn't get expanded when we write this code on the wiki.)

Finally, we want to submit the form for the user. Luckily, JavaScript has a built-in function just for this named submit(). To submit our editing form, use the code document.editform.submit(). Your code should now look something like this:

// Qwikify
addOnloadHook(
    function () { 
        addTab("javascript:doQwikify()", "wikify", "ca-wikify", "Mark for wikification");
    }
);
 
function doQwikify() {
    document.editform.wpTextbox1.value = "{" + "{wikify}}\n\n" + document.editform.wpTextbox1.value;
    document.editform.submit();
}

And that's it! Save the monobook.js and then do a hard refresh. Go and edit a page (I use the Sandbox) and see what happens!

[edit] What next?

If you still are having trouble, have a suggestion, or you just want to get in touch with us, come to our IRC channel (located at the bottom our main page) or start a discussion on our talk page.

If you want to help us with our WikiProject, feel free to add your name to our participants list.

originally written by raylu ^{my monobook.js} Thanks a ton to all the users who helped improve this tutorial!