ShoresToWeb HyperCard Stack
Version 1.2

Douglas J. Eernisse

Department of Biological Science
California State University at Fullerton
Fullerton, CA 92834-6850
Email: deernisse @

new2 ShoresToWeb 1.2 in BinHex format (drop on StuffitExpander if it does not automatically extract)
First released 12/19/05; Version 1.1 released 8/24/08; Version 1.2 renamed from WebMate to ShoresToWeb due to a trademark conflict on 4/14/09 (please see below for other details of updates)
Note that this software only runs on Mac OS 9.x or in Mac OS X with Classic Mode enabled!
Note that any recent Macs use an Intel chip and Classic Mode is no longer supported.
Note that this software requires that you also download the HyperCard Player from Apple's web site.

bullet Download the current HyperCard Player v. 2.4.1
(Recommended to reset the RAM Partition of HyperCard Player to a minimum of 5 MB, or much more if available).

bullet DNA Stacks Software

bullet Miscellaneous Other Software and Data

bullet Visit Doug Eernisse's Personal Web Page

The following is in the read me file above:

HyperCard stack ShoresToWeb version 1.2

2005-2009 D. J. Eernisse (deernisse @




            Send a postcard or email if you find it useful:

                        Doug Eernisse, Dept. Biol. Sci., CSUF, Fullerton, CA 92834-6850

What does it do?

            Given a folder that contains:

                        Multiple images

                        Thumbnail versions of each image

            ShoresToWeb will create:

                        An image index web page with linked thumbnail images, three per row

                        A web page for each full-size image with useful navigational links

Where can I find an example?

            See any of the web pages I created during or after 2005 at:



Why was ShoresToWeb created?

            I got burned out manually creating web pages for my various field trips.

What are its limitations?

            Quite a bit: It is now tied to the essentially obsolete Mac OS 9.x

It depends on HyperCard or HyperCard Player.

One of these must be installed separately.

                        Download free Player at:


                        Recommend resetting RAM partition to much higher than default value:

                                    Highlight icon of HyperCard Player while in Classic mode.

                                    Select “Get Info” from File menu.

                                    Click on “Memory” tab.

                                    Adjust minimum and normal Ram partition to higher than default.

            HyperCard only runs on a Macintosh.

            The Macintosh must either have OS 9.x or OS X with Classic Mode enabled.

                        Use the installation cds that came with your Mac to install Classic option.

                        However, any Mac with the newer Intel chip cannot run Classic.           

           ShoresToWeb will only create web pages like those in the examples above.

                        You can save or load “Default Sets” to customize ShoresToWeb file paths.

                        If you have HyperCard (not the Player), you could change my scripts.

                                    Please do not distribute modified versions of ShoresToWeb.

Why did you program this in HyperCard?

            Because I still haven’t gotten around to updating to something like:


Will it run in Windows or native Mac OS X?

            Nope, sorry. If I ever get around to converting it to Revolution, then yes.

How do you recommend I get started?

            Follow my example:

                        Create two folders at the same level, somewhere on your hard disk

                                    My default folders are named “im” and “ftm” (used below).

                                                Folder “im” will have:

                                                            Folders of images (one per project)

                                                            Corresponding folders with image web pages

                                                            Organize projects in subfolders within “im”

                                                                        Example: im/f05/

                                                Folder “ftm” will have:

                                                            One image index web page per project.

                                                            A master project index web page (see my example).

                                                            Do not use subfolders here.

                        Create two more folders at the same level somewhere on your server

                                    The folder names must be identical to those on your hard disk.

                                    Name optional subfolder names within “im” as on hard disk.

                                    Note that the folder enclosing “im” and “ftm” can have any name.

                                                This is because only relative paths are used.

                        If you have more than one server or one set of projects:

                                    Save/Load “Default Sets” for each.

                                    You could also copy ShoresToWeb and customize each copy.

How do I save thumbnail versions?

            This can be accomplished with iPhoto

                In the older v. 5.x Mac OS X version of iPhoto:

                        Create an Album with images in the order you want them.

                        Name the album with a relatively short name.

                        Under “Share” menu select menu item “Export…”

                        First, create images small enough to display well on the Web.

                                    You probably do not want your images to be > about 400K each.

                                    Click on “Scale images no larger than…” radio button.

                                                “Full size” option might be more appropriate for you.

                                    I type “1000” in the “width” entry for image dimension.

                                                The “height” value is automatically updated.

                                                Adjust this for your maximum resolution image.

                                    I click on “Use album name” radio button for file names.

                                    Check “Use extension” check box for file names.

                                    Save to a new folder within “im” on your hard disk.

                                                Or save within an “im” subfolder.

                        Second, create thumbnail versions.

                                    Repeat above iPhoto Export procedure, except:

                                                I type “300” in the “width” field.

                                                I name the (temporary) folder differently.

                                    Note that thumbnail and normal image names must correspond.

                        Now you need to rename each of the thumbnail images.

                                    I first rename by adding “_sm” before the extension:

                                                “myAlbum - 001.jpg” to “myAlbum - 001_sm.jpg”

                                    This can be automated with various utilities.

                                                I use “A Better Finder Rename…” software.

                        Move all renamed thumbnail images into same folder with other images.

                        To avoid spaces in default iPhoto exported file names:

                                    Change “ - ” to “-”

            Newer iPhoto versions have similar capabilities, but with some issues: 

                        I have not figured out how to outwit iPhoto’s sequential numbering style.

                                    No leading zeros are now used so I now

                                                Select the first 10 images (0-9)

                                                Change xxx-n.jpg to xxx-00n.jpg

                                                Select the images 10-99

                                                Change xxx-nn.jpg to xxx-0nn.jpg

                                               (e.g., replace the ‘xxx-’ unique text in your image names
                                               with 'xxx-0’, etc. )

                        Now you are ready to use ShoresToWeb.

                                    Select “Generate Web pages…” from ShoresToWeb menu.

                                    The first time, you will choose “Prompt” and enter your URLs, etc.

                                    Later, you can choose “Save Default Sets” to store settings.

                                    For your next project, you can choose “Default” instead.

                        ShoresToWeb will create:

                                    A new folder with one web page for each image.

                                                Created in same folder as you project image folder.

                                                This folder will have similar name to your image folder:

                                                            “MyFieldtrip_12_05” to “ft_MyFieldtrip_12_05”

                                                Subfolder names will be in folder name so keep them brief.

                                                            e.g., “f05/ft_f05_MyFieldtrip_12_05”

                                                Web page names will have a similar name to your image.

                                    A new image index web page.

                                                Created in “ftm” folder in my case.

                        As of the first released version of ShoresToWeb, and unlike all versions of WebMate,

                                     I no longer have to do various contortions to make different versions for images

                                    in portait and landscape mode (hooray!)

                        Copy the two folders within “im” to the “im” folder on your server.

                        Copy the image index web page to the “ftm” folder on your server.

                        Create a link on your master project index web page in “ftm” folder.

                                    You only need a relative link to your image index web page:


                        Edit your default image captions using a program such as Dreamweaver.


Take photos, download/edit/export with iPhoto, use ShoresToWeb, upload.

Enjoy! Send me a postcard or email with your URL.

I will be amazed (and pleased) if someone else actually uses ShoresToWeb!

ShoresToWeb also has separate abilities to combine multiple text files into one.

DJE 4/14/09

First Release of ShoresToWeb (v. 1.2.0), posted 4/14/09

Besides finally solving my issues with portrait vs. landscape mode, I also modified the scripts so that now clicking on an image will advance to the next slide, as in Facebook or MySpace. There are probably some other things I have changed but am forgetting, and probably are relatively minor changes.

Update (v. 1.1), posted 8/24/08:

Thanks to problems revealed by Firefox browser updates, I improved handling of the display of landscape vs. portrait images. There is now only a one letter “L” vs. “P” difference between the html files output for these and the differences are handled by two style sheets that should be at the root level of your images folder (by default: “im”). These may be downloaded at:

Now, the only difference between the html files generated for “L” vs. “P” images is which of these style sheets is referred to.

A bonus of this approach is that now it is possible to use the browser’s normal zoom in/out keystrokes (Command or Control key with plus or minus) to not only zoom the text but also the image. This seems to work fairly well but one has to remember to zoom back to normal.

I have had some problems still with portrait images being too large for some computers, especially those with small screens (e.g., my Powerbook). For this reason, I added a second set of simple navigation links at the top of each image web page, just under the title.

Update (v. 1.2), posted 3/12/09:

This version is nearly the same as v. 1.1 except for the new stack name.

However, there are some enhanced features.

ShoresToWeb now behaves more like a Facebook slide show, so clicking on a picture goes to the next image. On the last image, clicking goes back to the first slide.

Before, clicking on the image went back to the corresponding index page row.

Now there are new small navigation links above the image: Previous, Up, Next

The Up link will behave as clicking on the image used to behave.

Douglas J. Eernisse deernisse @

csuf_logo CSU Fullerton, Biological Science Home Page