|
Use
JavaScript to Dynamically Update Your Website
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://hop.clickbank.net/hop.cgi?wsnet/willmaster
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.
In the second part of this series, we'll talk about creatingan ebook that can be dynamically updated with JavaScript.
About the Author:
Shelley Lowery is the Webmistress of Web Source - Your Guide to
Professional Website Design and Development. Join The Syndicator,
our new, free article syndication program and display complete
articles w/photographs on your website that are automatically
updated each week. http://www.web-source.net
Dynamically Update Your Ebooks with JavaScript
Part 2
of 2
By Shelley Lowery
In the last article, "Use JavaScript to Dynamically
Update Your Website," we talked about how you can use
JavaScript to replace your existing navigational
set up on your website for easy updating. For those
who may have missed it, you can find it here:
http://www.web-source.net/dynamically_update.htm
Well, you can also use JavaScript to dynamically
update your ebooks.
The type of ebook I am referring to is a self-contained
"executable" file of HTML. This HTML may be a website
you've created or HTML you've specifically prepared to
be compiled into a downloadable .exe file for distribution.
Ebooks are completely interactive with the Internet
and can contain live links, graphics, forms, JavaScript,
embedded video, and just about anything that HTML 4.0supports. In addition, they can even be protected via
password/userid and have search capabilities.
Needless to say, they are one of the most powerful
marketing tools available on the Internet. They combine
two of the most sought after forms of content online.
The need for information and the desire to get something
of quality, free.
By creating a quality, informative ebook and allowing it
to be freely distributed, you are literally creating
a massive marketing machine. This marketing machine
will spread like wildfire and continue to work for you
eternally.
You can even take that one step further and create a
free ebook that will become a Viral Marketing Tool. You
can create a free ebook that you will have complete controlover forever. No matter how many copies you give away, you
can have the ability to update each and every one of
them with just one file.
Instead of coding your regular HTML pages for your ebooks, you simply place two small lines of JavaScript
within your HTML page where you'd like your content to
display. This code will pull the content from a file on
your server to display within your ebook. This is the
same JavaScript codes discussed in the last article.
Before we begin, if you'd like to see an example of a
free ebook with dynamically updated content, visit:
http://www.web-source.net/free_ebooks.htm
and download
Syndicator eMagazine. This free ebook is the Net's first
dynamically delivered emagazine. There are two versions
available; the Internet Business version and the Home and
Family version.
For those of you who read the previous article, much
of the following will be a repeat however, there is
some additional information. In addition, some email
programs may not display the following code properly.
You can view this article at the following address:
http://www.web-source.net/dynamically_update2.htm
The first step in setting up your content feed is to
create the file that will contain your content. To do this,
you must first create your HTML page exactly as you'd like
it to display within your ebook. Once you've created your
page, open a text editor such as NotePad and simply cut
and paste your HTML into a new page. Not all of your HTML,
just the contents that you would like to be dynamically
displayed. There is no need to begin your new file with
<HTML><HEAD>, etc. as you are only creating the file for
the contents of your existing HTML page.
Once you've created your new page containing your 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 beginning and ending 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.
After you've completed your content file you'll need to save
it and upload it to your server. Try to select a name that
reflects your file such as ebook.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 all of your HTML files. Name this directory
"content" (without the quotes) and upload your new .js file
in ASCII.
Finally, place the following code into your original HTML
page (the page you cut the HTML code from) where you'd like
the content to display. Make sure you change the URL and
point it to your new .js file.
<SCRIPT
language="JavaScript" src="http://www.yourdomain.com/content/yourfile.js">
</SCRIPT>
Note: This script has only been tested using the following
ebook compilers and may not work with all compilers:
E-ditor Pro -
http://www.e-ditorial.com/ebook.cgi?id=websource
WebCompiler -
http://www.webcompiler.com/
I highly recommend both of these compilers, but E-ditor Pro
is much easier to use.
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.
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://hop.clickbank.net/hop.cgi?wsnet/willmaster
Creating a free ebook will be one of the BEST marketing
decisions you'll ever make. Creating a free ebook you can
dynamically update will give you the power to control your
free ebooks forever. Now that's Viral Marketing!
About the Author:
Shelley Lowery is the Webmistress of Web-Source.net. Your
Guide to Professional Web Site Design & Development. Display
complete, professionally written articles & photographs on your
website that automatically update each week, free. Join The
Syndicator. http://www.web-source.net
|