Image catalogue database & Lytebox/Lightbox+
In this Tutorial/Demo pages we are going to use “Adding an Image Catalogue” PDF Tutorial
from serif, which can be found in the start up wizard or view/downloaded from Here(1.5mb).
We’ll follow the PDF tutorial up to the end of page 11 section 5 to produce a page
of thumbnail photos then by adding a hyperlink, via the database, to bring these
photos to overlay the current page by Lytebox.
Please look at the lytebox pages if you haven't already seen it in action.
I’m sure once you get your head around putting this together with the hyperlinks
you could find many uses for it within sites produced using the database function
in X2. It need not be pictures you hyperlink from but text hyperlinked to a web page
or file.
To get started
- Produce 2 sizes of photos to use. 1 small to use as the thumbnail(put in their own
folder) and a large photo which will be hyperlinked, via the hyperlinked thumbnail,
to open by Lytebox. If you have seen my new tutorial on Lightbox + you could use
this also.
- Upload the large photos to a folder on your host to link to from your thumbnails.
- Upload to your host the Lytebox/Lightbox+ files/folders as explained in their relative
tutorials.
- In the Master page you are going to use for the image catalogue page put the relative
code into the header. See the Lytebox/lightbox pages for more information.
Image Catalogue Database
- Follow the PDF tutorial and when you get to page 3 section 2.3 use the folder with
the small photos for the database.
- When you get to page 4 section 2.8 and click finish there is a mistake in the PDF
tutorial and a merge list dialogue does not show. Proceed forward to page 5 section
3.
- At section 3.2 once you have chosen your database file(.sdb) select edit, it is at
this point we are going to add 2 extra fields to the database for the hyperlink and
title.
- In the dialogue box “merge list” select Edit, this will open the Edit database dialogue
where you select the customise option.
- In the customise dialogue select insert, add a name for the field which we will use
to add a title and then add a second to add the hyperlink text. You can move these
fields up or down the list if required, OK out of the customise dialogue and you
will find the new fields in your Edit Database dialogue.
- Go through each record detail selecting each field in turn to add details, making
sure that the photo is linked to the photo field, you may have to click the Browse
button under the photo thumbnail if it does not show when the photo field is selected.
- In the new fields, that we added, put a title for the photo and in the hyperlink
field put the location address as discussed in the Lytebox tutorial which would be
similar to this if your large photos are in the images folder on your host.
images/customise.gif"rel="lytebox" title="Customise your database
- If your going to use Lightbox+ the address is similar but change the lytebox for
lightbox
Repeating Area & Hyperlinks
- When you have finished filling in all your hyperlinks and titles OK out until you
come back to the “choose merge database” dialogue and carry on from page 5 section
3.3 Inserting a repeating area.
- Once you have add your repeating area, then added the picture and title fields, we
can add a hyperlink to the thumbnail picture field to open the large photo with Lytebox.
- Right click thumbnail > hyperlink > Internet page, delete the contents of the url
address field, and select the small square to the right of the url address field.
In the Insert text field dialogue select the hyperlink field.
Now you are ready to merge your database. When you do the merge process WP creates
a new_merged .wpp file. So if you are inserting the database into a site this saves
the original .wpp file from any mishaps as well as adding the database merged pages.
You will then use the new_merged .wpp file to upload.
Select the merge to new site button, last right in the Database merge toolbar. Now
your done!
Lyteboxdb files
Here is a link to all the files(zip 629kb) to download, inc photos, used in this
tutorial/demo. The .wpp file has been left pre-merged so you can see the repeating
area. Hopefully they will come in useful.
If you do use the database file in a test site you will have to re-associate each
photo with the photos in the .zip folder