Forums / Setup & design / building an image gallery

"Please Note:
  • At the specific request of Ibexa we are changing this projects name to "Exponential" or "Exponential (CMS)" effective as of August, 11th 2025.
  • This project is not associated with the original eZ Publish software or its original developer, eZ Systems or Ibexa".

building an image gallery

« 
Previous topic
|
Setup & design
|
Next topic
 »
Author Message

mihnea stoian

Monday 05 January 2004 9:20:09 am

I'm trying to build an image gallery where I have a initial list of thumbnails and when I click on the individual thumbnail a pop-up opens with the bigger image.

What kind of template will I need for the list of images so that when clicked they open their corresponding bigger image?

I'm new to eZ (been using it for less than a month), and am still learning as I go, so could anyone tell me if there is some sort of tutorial on how to do something like this, or at least just part of it?

Thanks,

Mihnea

Paul Borgermans

Monday 05 January 2004 10:26:27 am

If you want a popup, best use some simple javascript mixed with template code like

-----------------------------------------------
....
<h3><a href="#">Preview <img src={"viewmag+.gif"|ezimage} onClick='OpenWindow({$node.object.data_map.preview.content[original].full_path|ezroot},"image_preview","scrollbars,resizable");'></a></h3>

------------------------------------------------------

you will probably need to change preview to the attribute name of your image.

viewmag+.gif is just an icon i borrowed from a KDE distribution and converted to gif (for IE transparancy)

the OpenWindow javascript function called is found in the default pagelayout in the demo's:

<script language="JavaScript">
<!--

function OpenWindow ( URL, WinName, Features ) {
popup = window.open ( URL, WinName, Features );
if ( popup.opener == null ) {
remote.opener = window;
}
popup.focus();
}

// -->

</script>

hth

-paul

eZ Publish, eZ Find, Solr expert consulting and training
http://twitter.com/paulborgermans

mihnea stoian

Tuesday 06 January 2004 7:05:54 am

thanks for the answer, but unfortunately it doesn't work for me. :(

{$node.object.data_map.preview.content[original].full_path|ezroot} doesn't seem to display anything, so there is no url to open the new window with.

your example included the same image as thumbnail for all the pop-ups. I'd like to be able to use ImageMagick to display a small thumbnail of the image, and when I click on this small image to open the bigger version of the same image.

could that be easily achieved? also, where can I find some sort of reference to all the Exponential commands available?

thanks again,

mihnea