how to create multiple image links to same page?

[ksv001]

i had somebody create my webpage, and i'm trying to update it with some new
business card designs i've done. i have already created the thumbnails &
enlarged images to place, but it doesn't seem like "creating a new page" is the
way this has been set up. can somebody help me figure this out? i'm a
contribute beginner here...
[url]http://zidesign.net/identity_business.html[/url]

[ThinkInk]

I don't think you will get this done just using the 'Edit mode' of Contribute.
Your page uses a javascript function to display the larger images and the links
on your thumbnails should look like this:

<a href="#_self"
onClick="LoadGallery('EmilyGallery2','identity/kelly_mclaughlin.jpg','name','kel
ly mclaughlin, realtor')"><img src="identity/kelly_mclaughlin-thumb-web.jpg"
width="95" height="95" border="0"></a>

You can put links like this in your pages using the insert HTML snipperts
option (make sure you have proper rights) and >File>Edit Page Source in
External application to create/delete/replace the links again.

You can upload the images by using >File>Publish File From My Computer.

The script that makes this effect possible is in the head of you page and
looks like this:

<script language="JavaScript">

// Gallery script.

// With image cross fade effect for those browsers that support it.

// Script copyright (C) 2004 [url]www.cryer.co.uk[/url].

// Script is free to use provided this copyright header is included.

function LoadGallery(pictureName,imageFile,titleCaption,cap tionText)

{

if (document.all)

{

document.getElementById(pictureName).style.filter= "blendTrans(duration=1)";

document.getElementById(pictureName).filters.blend Trans.Apply();

}

document.getElementById(pictureName).src = imageFile;

if (document.all)

{

document.getElementById(pictureName).filters.blend Trans.Play();

}

document.getElementById(titleCaption).innerHTML=ca ptionText;

}

</script>

[ksv001]

could you please clarify exactly the steps i should take to do this (step 1,
step 2...) and exactly how much of the html you included that i need to insert?
i am not a web person so this is quite foreign to me! thanks so much for your
help.

[ThinkInk]

Before we start creating these steps, which version of Contribute are you using? HTML snippets are only available in CS3.

[ksv001]

CS3

[ThinkInk]

step1 (creating and publishing images):
1. create the images you want to use
2. start Contribute
3. in the main menu go to >File>Publish File from my Computer
4. browse to the images on your computer, select one
5. select the website you want to place the image
6. choose the folder, click select, publish the image
7. repeat this for all the images

step2 (inserting the html-snippet):
1. create the html snippet in notebook.exe (windows tool)
2. the code should look like this:
<a href="#_self"
onClick="LoadGallery('EmilyGallery2','identity/nameofimage.jpg','name','[
b]description of image[/b]')"><img
src="identity/nameofimage-thumb-web.jpg" width="95" height="95"
border="0"></a>
3. for each image youi have to create this snippet
4. open Contribute
5. in the main menu go to >Insert>HTML Snippet
6. insert the snippets and place them in the page.

step3 (removing the snippets, fi to repalce them with another snippet):
1. open Contribute
2. in the main menu go to >File>Actions>Edit Page Source in External
Application
3. remove the code html-snippets from the source code.

step4 (replacing the first image of the gallerie -- that is placed inside a
div container: <div align="center"><img border="0"
src="identity/kelly_mclaughlin.jpg" id="EmilyGallery2"></div>):
1. open Contribute
2. in the main menu go to >File>Actions>Edit Page Source in External
Application
3. replace src="identity/kelly_mclaughlin.jpg" with
src="identity/newimagename.jpg"

[ksv001]

holy mazola! thanks so much for your detailed response. question: can i create the html snippet at photobucket.com? i have a mac, so the windows program wouldn't work for me.

[ThinkInk]

Main thing is that you use a plain text editor to write the code and then copy this into the HTML-snippet window.

[ThinkInk]

Or you could write the could in the HTML-snippet window self.