Image Galleries in Brochure pages

[mosaici]

We have a whole shedfull of images [non-product] that we'd like to organise into galleries for our visitors to browse. The ability to organise thumbnails in columns [like in the Sections] is what we want BUT implemented in a Brochure page. i.e. create a matrix of thumbnails which link to the larger version of the image.

I guess I'm looking for a brochure fragmnent that behaves like a section or sub-section?

Anyone seen one of these in the wild???

[jont]

Have you checked out www.drillpine.biz

[mosaici]

Have you checked out www.drillpine.biz

I presume you mean the 'multi column brochure layout' ? The question then is how do I link to the full-size image fragment after clicking on the image thumbnail?
...or am I missing something fundamental here?

[NormanRouxel]

Or you can just embed your own HTML into a single (or multiple) brochure fragments text. Just surround it with !!< and >!! so that Actinic knows it's custom code.

Keep images this code refers to in PreviewHTML (so previews work) and upload them via Advanced / Additional Files.

[NormanRouxel]

An example of a 3 across, 2 down array of clickable images that popup a larger image in a 400 x 400 window

!!<<table>
 <tr>
  <td><img style="cursor: hand" src="thumb1.jpg" onclick="ShowPopUp('image1.jpg',400,400)"></td>
  <td><img style="cursor: hand" src="thumb2.jpg" onclick="ShowPopUp('image2.jpg',400,400)"></td>
  <td><img style="cursor: hand" src="thumb3.jpg" onclick="ShowPopUp('image3.jpg',400,400)"></td>
 </tr>
 <tr>
  <td><img style="cursor: hand" src="thumb4.jpg" onclick="ShowPopUp('image4.jpg',400,400)"></td>
  <td><img style="cursor: hand" src="thumb5.jpg" onclick="ShowPopUp('image5.jpg',400,400)"></td>
  <td><img style="cursor: hand" src="thumb6.jpg" onclick="ShowPopUp('image6.jpg',400,400)"></td>
 </tr>
</table>>!!

And you'd have to upload thumb1-6.jpg and image1-6.jpg as mentioned earlier.

PS above is untested.

[mosaici]

Internet Explorer Script Error

An example of a 3 across, 2 down array of clickable images that popup a larger image in a 400 x 400 window

!!<<table>
 <tr>
  <td><img style="cursor: hand" src="thumb1.jpg" onclick="ShowPopup('image1.jpg',400,400)"></td>
  <td><img style="cursor: hand" src="thumb2.jpg" onclick="ShowPopup('image2.jpg',400,400)"></td>
  <td><img style="cursor: hand" src="thumb3.jpg" onclick="ShowPopup('image3.jpg',400,400)"></td>
 </tr>
 <tr>
  <td><img style="cursor: hand" src="thumb4.jpg" onclick="ShowPopup('image4.jpg',400,400)"></td>
  <td><img style="cursor: hand" src="thumb5.jpg" onclick="ShowPopup('image5.jpg',400,400)"></td>
  <td><img style="cursor: hand" src="thumb6.jpg" onclick="ShowPopup('image6.jpg',400,400)"></td>
 </tr>
</table>>!!

And you'd have to upload thumb1-6.jpg and image1-6.jpg as mentioned earlier.

PS above is untested.

Hi Norman ,
Many thanks!!!
I think this is the way we need to go, however when testing it out with:
!!<<table><tr>
<td><img style="cursor: hand" src="thumbnails/DSCN0644.jpg" onclick="ShowPopup('images/DSCN0644.jpg',400,400)"></td>
<td><img style="cursor: hand" src="thumbnails/DSCN0645.jpg" onclick="ShowPopup('images/DSCN0645.jpg',400,400)"></td>
<td><img style="cursor: hand" src="thumbnails/DSCN0646.jpg" onclick="ShowPopup('images/DSCN0646.jpg',400,400)"></td>
</tr>
<tr>
<td><img style="cursor: hand" src="thumbnails/DSCN0647.jpg" onclick="ShowPopup('images/DSCN0647.jpg',400,400)"></td>
<td><img style="cursor: hand" src="thumbnails/DSCN0648.jpg" onclick="ShowPopup('images/DSCN0648.jpg',400,400)"></td>
<td><img style="cursor: hand" src="thumbnails/DSCN0649.jpg" onclick="ShowPopup('images/DSCN0649.jpg',400,400)"></td>
</tr>
</table>>!!

we get a script error on
Line: 4
Char:1
Error: Object expected.
Yes! the 'images' and 'thumbnails' folders are sub-folders of PreviewHTML (and of Site1 to boot!)

...how do we proceed now?

[NormanRouxel]

Ooops. It's a typo. All ocurrences of ShowPopup should be ShowPopUp

I'll edit the example above so it's correct for future readers.

Case is important.

[NormanRouxel]

If you intend to use Actinic's Advanced / Additional FIles to upload these images (all such files end up in acatalog) then you should keep these images directly inside PreviewHTML (no sub-folders) in order for Preview to work. Don't use any path names for the images (as per my example).

If you intend to manually upload them you can use other folders (as long as you mimic that structure in PreviewHTML).

[mosaici]

ShowPopUp parameter explanation

Ooops. It's a typo. All ocurrences of ShowPopup should be ShowPopUp

I'll edit the example above so it's correct for future readers.

Case is important.

As you say, Norman, case is important - thanks - got my little test going now. Next question: the 400,400 in your example, is that the image size or the window size. I guess I really want to know how I specify the image size. When I try 800,800 there seems a lot of white space inside the popup (sorry PopUp) window! Or is that just the way it is?


OK I've just read the ShowPopUp source code and answered it myself! - its the window size. (width, height)

Once again Norman, you have brought sanity to the sandhills of Kenfig!! Many thanks!!