Web Editor

The first thing you need in order to be able to use JavaScript written by someone else on your own web pages (apart from permission to use the script of course) is a web editor. Not just any web editor will do though.

If you are using one of those "What You See is What You Almost Get" or WYSIWYAG editors then it is only going to be useful for this if it has an option to view and edit the actual HTML source.Even then you will need to figure out how to switch to that mode and how to use the editor to be able to create files that are pure JavaScript or CSS.

The simpler option is to use a web editor that just works with the plain text source code of the web page directly. While you may not want to use such an editor for creating your own web pasges, a plain text web editor is the easiest to use for adding JavaScripts that someone else has written into your web page. You will not even need to download such an editor as all computers come with one already installed. On Windows this editor is called Notepad.

If you want an editor that will be slightly easier to work with because it can colour code the file content and make specific code easier to find then you might tale a look at Notepad++ which is available as a free download.

Handling Zip Files

Some pre-written JavaScript is supplied as Zip files. If you are going to use scripts that are supplied that way then you will need a program that can unpack files in that format into the separate files that make up the script.

You will quite likely already have a program that is installed on your computer that can do this. The simplest way to find out is to try to open the zip file and see what happens.

If you get a list of the files that the zip file contains then you can easily extract them. If it just looks like an ordinary Windows folder when you open the zip file then simply select all the files in the filder (holding down the ctrl key and pressing A is the easiest way to do that), then copy the selected files (ctrl and C) then end out of the zip file go to where you want to put the extracted files and paste them there (ctrl and V).

If you don't have a program that can read the zip file to give you access to extract the files from it then you will need to get one if you are going to use pre-written JavaScript supplied in zip files. The 7zip program is a free download that can handle this for you.

Create Files

The pre-written script content will most likely consist of content that is to be placed in separate files where the supplied content is all that is in the file as well as some content that needs to be added in specific spots in your existing web page.

If you downloaded the content in a zip file then the separate files will already esist. If you have to download the content separately then you will need to create those files.

To create a brand new file using your web editor simply open the editor and paste the content for the file into it. You then need to select the Save option from the menu and enter the name for the file. The instructions for installing the script will usually tell you what to call the file.

Most pre-written scripts are intended to be installed into the same folder as your web page that is going to run it and so if you have the file in a different folder you will need to copy or move the file into the folder where you have your web page before you can link the file into the page.

Update Existing Files

One step that you will need to follow for every single pre-written JavaScript you decide to install is to update the actual web page where the script is to be run. You may also need to update other files similarly depending on the particular script.

To do this open your web page in your web editor (the plain text one you chose in step one, not a WYSIWYAG one).

There should be instructions on where to put the content that needs to be added into the web page and so the next step is to locate the appropriate spot(s) in the page.

The most common places for adding CSS and JavaScript into a web page are immediately before the </head> or </body> tag so finding those tags will be useful.

If you need to add something into the actual web page content at a spot where the script action is to appear within the web page then you need to determine just what you have in your web page that is immediately above or immediately below that spot and find that in your page. Don't worry if you insert in the wrong spot as you can always move the code you added to a different spot if when you look at the page it doesn't appear where you expected it to.

Even though the person who wrote the JavaScript that you are using should have tested it to make sure it actually works that doesn't mean that you don't need to test it yourself once you add it to your page. You may have not quite followed the instructions correctly and have something in the wrong place that will prevent the script from working correctly. Another possibility is that you already have another JavaScript in the same page and the two will not function correctly together without one or both scripts needing to be modified.

Testing JavaScript is really easy. Simply open your web browser and display the updated copy of your web page from your computer. Since JavaScript runs in the browser you don't need to upload the files to your web hosting before you can try it out.

If the script doesn't work and you can't see where you went wrong in following the instructions then try creating a really simple test web page with very little content and try adding the script into that. If all your test web page contains is a heading and a couple of paragraphs of text plus the script then you can quickly confirm whether the problem is likely to be a conflict with something else in the page. If you do get it working there then you could copy pieces of your actual page into the test one until you find out what piece of code stops it working. That will at least allow you to provide detailed information about the problem when you ask for help.

The other possibility when installing the script into your test page is that you will realise that you didn't do one of the steps quite right when adding the script to your regular page and you can then go back to your page and correct your mistake.

Once you finish installing the script into the web page and have tested it to make sure that the script actually works then the only thing remaining to be done is to copy all the files you created and updated back to your web hosting account.

If the method that you usually use to do this is built into your regular WYSIWYAG web editor then that option may or may not be able to find and upload the extra files that you created for the script.

If you have difficulty getting your normal upload process to upload all the needed files then you might think about getting a separate program just for doing the file upload step of updating your web site.

The usual program for uploading files to web hosting is called an FTP program. As with all things web related there are plenty of free choices for what you can use to do this. One of the most popular FTP programs available as a free download is FileZilla.