IgLou | WorldLinks
WorldLinks Home | Register Now!
Customer Support | Developer Support | Web Tools & Info | Developers At IgLou |
WorldLinks Direcotry


HOW DO I SET UP IMAGE MAPS ON MY WORLDLINKS ACCOUNT?

Image maps are fully supported through IgLou WorldLinks. Basically, the idea of an image map is to provide the user with a single GIF or JPG picture that contains one or more clickable regions that will send the user off to different areas, depending upon where they click.

Image maps provide a nice interface, as you can design pleasing designs on a single GIF/JPG image that contains different items to choose from.

Implementing image maps requires three steps. Each of these steps is outlined below:

  1. Write the IMG anchor into your HTML file

      To do this, simply use a regular <IMG> anchor pointing to the image that contains your imagemap graphic. However, you must also include the ISMAP keyword within the anchor. This indicates to the WWW server that the image about to be displayed will be clickable.

      For example:

        <IMG SRC="picture.gif" ISMAP>

  2. Create the imagemap .map file

      Because the WWW server needs to know the areas within your picture that are clickable, you will need to use special software that runs on either MS Windows or on Macintosh to highlight the areas that are clickable.

      This software will basically do nothing more than create an ASCII text file that contains the coordinate boundaries of each clickable region, as well as the name of the .html file to load if you click on each respective region.

      This map file is really the key to everything, as it makes the association of each region to the page that it should link itself to.

      You can find this software on the WorldLinks support page at the URL of http://www.iglou.com/worldlinks/tools underneath the HTML editors menu.

      Be sure to create your .map files in NCSA format. Most software packages will support both CERN and NCSA formats, and allow you to choose between the two when saving your work.

      Once you have created the .map file, simply upload a copy of the map file into the same directory as the .html file you created in Step 1.

  3. Create the <A HREF> anchor around your <IMG> anchor

      Now, you will need to re-edit the .html file you created in Step 1. Find the line that has the <IMG> reference created in Step 1.

      Surround this line with the following <A HREF> information, as shown below:

        <A HREF="whatever.map">
        <IMG SRC="picture.gif" ISMAP>
        </A>

      Now, do the following:

        Change the word whatever.map to whatever the filename is of the image map file created in step 2.

      For example, if your map file was called testing.map, then it should read:

        <A HREF="testing.map">
        <IMG SRC="picture.gif" ISMAP>
        </A>

  4. You're done!

    You should now be able to load your page and click on different areas of your image to automatically take you to various different places, depending upon how you created your map file...

If there are any problems, feel free to send e-mail to worldlinks@iglou.com

Copyright © 1997 IgLou Internet Services email WorldLinks