Use JavaScript to Dynamically Update Your Website
|
|
|
| 2.5/5.0 (4 votes total) |
|
|
|
|
Shelley Lowery
|
| Shelley Lowery |
Shelley Lowery is the
Webmistress of Web-Source.net. Your Guide to Professional Web Site Design &
Development. Subscribe to Syndicator Etips for fresh, original articles to
assist you in Web Design, Internet Marketing & Ecommerce
mailto:[email protected]?subject=subscribe
http://www.web-source.net |
| Shelley Lowery
has written 2 tutorials for JavaScriptSearch. |
| View all tutorials by Shelley Lowery... |
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 "');" (without the quotes). 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
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. | 
FEEDBACK
COMMENTS
PRINT
SUBMIT TUTORIAL
RSS
Add comment
(Comments: 0)
