Popup Toolkit - JS File Install Tutorial
Once you have your popup setup and you like how it looks and behaves in the preview
window(s) you need to install the popup code to your web page(s). The preferred way
code may be reused in several web pages by just adding one line of code to each
web page where you want your popup to appear.
For full explanation of the 'Popup Installation' section and all automatic methods
of installing popups to your web pages see the
User's Manual/'Popup Installation' section.
Open Popup Toolkit software and go to 'Popup Code' tab:
fig.1 - 'Popup Code' tab in Popup Toolkit software.
In the 'Popup Installation' section on the right you will see the select
box 'How to install the popup code:'. You have three options:
- 'Directly into a web page file' option - the popup code will be installed in the chosen
web page file.
This method is not recommended, because you will not be able to reuse this popup code in
several web pages. You may, of course, install the popup into several web pages using this
method but the popup code will be replicated in all web pages, which has the following
- When you decide to change the popup code you will have to reinstall it in all
web pages where it was previously installed.
- You will get increased bandwidth from your visitors to your server - the popup code will be
downloaded from each web page where you have installed it.
- 'Externally using a JS file' option - the popup code will be installed in the chosen
web page file using only one line of code. The full popup code will be saved in an external
This method is recommended, because you will be able to reuse
this popup code in several web pages. You get the following
Using this method you may install the same popup in several web pages without replicating the
popup code. If all web pages holding the popup are located in the same folder (directory) on
your web server then you will need to upload the JS file only once in that folder and this JS
file will serve for all web pages that include it. Later, when you change the popup you will
have to only regenerate the JS file and upload it (see the next option). The changed popup
will appear automatically in all web pages where it was installed.
- When you decide to change the popup code you will need to only regenerate and re-upload
the JS file. All web pages using this JS file will automatically start showing the new
- You will get decreased bandwidth from your visitors to your server - the popup code will be
downloaded only once for each visitor, no matter how many web pages with this popup inside
he or she is visiting (browsers will cache the JS file).
To create a JS file only see the next option.
- 'Only create a JS file' option - the full popup code will be saved in an external
This method is also recommended, because:
You get the same benefits as with the previous popup installation method.
If you want to install a popup saved in a JS file to web pages located in different folders in
your web server then you will need to add the following one line of code to your web pages
where you want your popup to appear:
- You may regenerate a popup saved in a JS file easily without altering the web pages
where the popup is included.
- You will be able to use the JS file to install popups in web pages that are not
situated in the same folder on your web server.
The URL above that is in bold http://mysite.com/popup-myid.js is the URL to the JS
file holding the popup code. Here mysite.com is the domain of your site, while
popup-myid.js is the JS file name. You may upload this JS file anywhere on your
server and then insert the popup in any web page on your server using this one line of code. Isn't
Now you can
install the generated popup into WordPress and Joomla web sites. You need to upload the
generated JS file to your server. Then you read the
WordPress plugin tutorial,
Joomla 1.5 plugin tutorial
Joomla 2.5 plugin tutorial
to see how to install popups into content management systems very easily and quickly.
For further details on specific features and effects, refer to the
Finally, if you encounter any problem or need help, contact me
(see bottom of page for contacts).