Use JavaScript to
Dynamically Update Your Website
If you've been
on the Internet for a while, you've probably seen numerous examples of JavaScript
use. JavaScript is a powerful scripting language used to create special effects
on your website, but did you know it can also be used as a very powerful
web design tool?
Have you ever joined a new affiliate program or created a new publication
that you wanted to add to your existing navigational set up, but dreaded
having to manually add the links to every page on your site?
You can use JavaScript to enable you to dynamically update every page on
your website with just one file. This technique is the same technology used
by numerous syndication services on the Internet. It enables them to deliver
dynamically updated content to every website in their program.
Before we begin, if you'd like to see an example of a navigational system
that is dynamically displayed, visit
http://www.web-source.net.
This website has over one thousand pages and each and every one of them displays
its navigational system using JavaScript. If I want to add an additional
link, I simply update one file and every page on the site is automatically
updated.
The first step in setting up your JavaScript feed is to create the file that
will contain your content. To do this, open a text editor such as NotePad
and simply copy and paste your existing navigational setup into a new page.
There is no need to begin the page with <HTML><HEAD>, etc. as
you are only creating the feed for one section of your existing web page
which already has those tags.
Once you've created your new page containing your navigational HTML, you'll
now need to add some additional JavaScript coding to each line of your
HTML.
The first line
of your new file will look like this: <!--
The next line will begin with: document.writeIn(' and end with:
');
Your first line of HTML will be placed between the beginning and ending coding.
For every line of your original coding, you'll need to add the above-mentioned
codes before and after.
Note: Make sure you don't add any extra spaces, including at the end of each
line, as JavaScript is very sensitive.
Your new file will end with //--> on the last line.
Here's how your code might look:
<!--
document.writeln('<TABLE BORDER="0" ALIGN="Center">');
document.writeln('<TR>');
document.writeln('<TD>');
document.writeln('Your table content');
document.writeln('</TD>');
document.writeln('</TR>');
document.writeln('</TABLE>');
//--> |
Each backslash
(\) should be preceded with another backslash.
Example: \\
Each apostrophe (') should be preceded with a backslash.
Example: \'
You can include most HTML and JavaScript coding however, you cannot include
JavaScript that must access another file to run.
After you've created your content and added the special JavaScript coding,
you'll need to save your new file. Try to select a name that reflects your
file such as navigate.js and make sure your filename is no longer than eight
letters.
Next, you'll need to create a new directory on your server where you store
your HTML files. Name this directory "content" (without the quotes) and upload
your new .js file in ASCII.
Here's where the magic occurs... Place the following code in your HTML pages
where you would like your navigate.js content to be displayed. Make sure
you change the URL and direct it to your new .js file. The following code
must be displayed exactly as it appears. Make sure there are no spaces after
the first line of code.
<SCRIPT
language="JavaScript"
src="http://www.yourdomain.com/content/yourfile.js">
</SCRIPT> |
If you've followed
the above steps correctly, your navigational system should now be displaying
on your web page. If you are receiving a script error message, most of the
time, it's due to an extra space at the end of a line or an extra or missing
character. Make sure you go over your code very carefully. Once you've created
your content feed and it is displaying your content, updating your file will
be simple.
If you'd rather not have to code the JavaScript yourself, I use a great script
called, Master Syndicator which will code your content for you. I highly
recommend it.
http://www.web-source.net/cgi-bin/t.cgi?l=wm2
You can also find a free text to Javascript converter here:
http://bontragercgi.com/Convert_Text_to_JavaScript.html
Using JavaScript to display your navigational set up can not only enable
you to instantly update the content on every page of your website, but can
also save you hours of valuable time.
Copyright © Shelley
Lowery
About the Author:
Shelley Lowery is the author of the acclaimed web design course, Web Design
Mastery.
http://www.webdesignmastery.com
And, Ebook Starter - Give Your Ebooks the look and feel of a REAL book.
http://www.ebookstarter.com
Visit Web-Source.net to sign up for a complimentary subscription to Etips
and receive a copy of the acclaimed ebook, "Killer Internet Marketing
Strategies."
http://www.web-source.net
You have permission to publish this article electronically, in print,
in your ebook or on your web site, free of charge, as long as the author
bylines are included.
More Articles
|
|
