[ Square Peach Music ]
[ Allwebco Design ]
[ Allwebco Templates ]
[ Allwebco Hosting ]

Allwebco Design Corporation

Random Image and Color Intro Page Setup:
This script is provided free to all our template users. We do not however provide support for adding the feature to your template. This script is intended to be added to templates that do not now have an intro, or for users who wish to replace their current intro.

More help for this intro can be found on our free intro support page.

STEP #1:
Put the files from this download; THE-intro.html, intro.js, intro.swf, intro.mp3 and intro.txt into your main website folder. Copy the four color "IntroStyle-?.css" files in this zip file in your main template folder (blue, gray, green, red).

STEP #2:
Put the five "intro-?.jpg" images in this zip file "picts" folder into your "picts" folder. Put the "intro.fla" that is in the "flash" folder into your template "flash" folder.

STEP #3:
Rename your current "index.html" to "home.html" or any name you would like for the page the intro will link to.

STEP #4:
Rename the "THE-intro.html" included in this add-in to "index.html".

STEP #5:
Edit your now renamed index.html. Find the "START LINKS" notes in this page and edit the two "intro-help.html" links so they link to your "home.html" or the name you used in step #4.

STEP #6:
Edit your menu.js in Notepad or a text editor so it points to "home.html" instead of index.html. This step is optional. If you do not edit the menu.js the "home" link will go to the intro instead of the home page of your template.

STEP #7:
Edit the intro.txt that is included with this template. This will change all the Flash lines. Change the text after "logo=" and after "&line1=", "&line2=" and "&line3=" and also you can change the &introline= and any other lines you see in the intro.txt. Be sure not to change the "logo=" or the other code at the start of each line.

The "index.html" will now be the first page that users will see at your website. These instructions only apply if your current template has no flash intro now.


INTRO COLORS: | More Details
This intro page is randomly selecting from 4 "IntroStyle-?.css" CSS style files. These files control the color on the "index.html" Edit any of these files with a plain text editor to change your template colors. See the notes in each CSS file for more help. Be sure after any color editing you test the page in IE and also either Netscape or Firefox.

The CSS files are using gradient code that works only in IE. In other browser a solid color will show. See the note at the top of each CSS file to edit these. All colors are controlled in the CSS files.

To have the intro use a single CSS file for the colors, remove the code between the "RANDOM css COLOR SCRIPT" notes near the top of the "index.html". The intro will then use only the IntroStyle-green.css.

You can add as many random CSS color files to the "index.html" as you would like. Near the top of the "index.html" find the line below, copy and paste it below itself, edit the [4] to a [5] and change the "IntroStyle-red.css" to your new color file name. Make a copy of any of the CSS files and name this to match the script area you edited.

mycontent[4]='<link rel="StyleSheet" href="IntroStyle-red.css" type="text/css">'

To remove the music from the intro, open your new index.html with the intro and delete the lines of code between "START MUSIC CODE" and "END MUSIC CODE"

You can use any other music that you would like. Find another mp3 file, .wav or .mid and edit the lines of code after the note "START HOME MUSIC CODE" with the new sound. On the intro page (now named index.html by you) your will find "intro.mp3" in 2 places. This is what you will need to change to use other music or sounds.

You can use your own pictures on the intro, just replace the 5 "intro-?.jpg" images in the "picts" folder with your own 750 x 350 pixel .jpg graphics. You will want to tile any new images you add or, make them much wider than 750 pixels so the index.html image does not repeat. Click here for help creating images that tile.

The random script is showing 5 .jpg images. You can add as many as you need. Find the "START RANDOM IMAGE" note in the index.html.
  1. Make a backup copy of the index.html.
  2. Copy these three lines and paste them below themselves:

    if (img == "4") {
    document.write('<td align="center" background="picts/intro-5.jpg">');

  3. Edit the "4" to a "5" above and the "intro-4.jpg" to "intro-5.jpg".
  4. Find this code "(Math.random()*5);" and change the "5" to a "6".
  5. Create a new "intro-5.jpg" and place this in the "picts" folder.
  6. Test by opening the index.html in your browser and hitting the refresh button a few times.

The height of the image on the homepage is set in the CSS files. If you change this height you may need to also edit the Flash code in the "index.html" to adjust. Always edit Flash code height and width numbers in 2 places. Height of the page borders is also set in the CSS file. See the notes in each CSS file to see what changes what in the intro page.

Search our support center for info on editing the Flash animation. You will need to use Flash MX to edit the animation.

Best of luck with your new intro and your website!

COPYRIGHT© Allwebco Design Corporation
Unauthorized use or sale of this script or these images is strictly prohibited by law.
By purchasing this script you are authorized to use this on a single Allwebco template, website or any template from another company. You are also authorized to modify all included files for this single site use.

Sound clips COPYRIGHT© Square Peach Music