Tutorial for How to Install jQuery Plugins (7 Steps)

By Chris Hoffman

Include jQuery plugins in your HTML code.
i Ablestock.com/AbleStock.com/Getty Images

The jQuery JavaScript library includes a plugin architecture. JQuery plugins can add user interface features to your Web page, extend jQuery’s syntax or add additional functions. You can add jQuery plugins to a Web page the same way you install jQuery itself, by uploading the plug-in’s JS file to your Web server and including the plugin with an HTML script tag. The plugin’s script tag must appear after jQuery’s script tag in the HTML code.

Step 1

Locate and download a jQuery plugin from the plugins page the jQuery website.

Step 2

Open the downloaded plugin’s archive file and extract the “.js” file inside it. Some plugins may contain multiple JS files.

Step 3

Open your Web page’s HTML file in a text editor.

Step 4

Locate the line that begins with “<script src="jquery.js” your Web page’s HTML file. Use your text editor’s search feature to locate this line.

Step 5

Add the following text onto a new line immediately after the “jquery.js” line, replacing “jquery.plugin.js” with the file name of the plugin’s JS file.

Step 6

Add additional “<script” lines for each plugin JS file you want to install on the Web page.

Step 7

Save your Web page’s HTML file. Upload the HTML file and the plugin JS files to the same directory on your Web server.