I am a relative newbie to Omeka, and I have not been able to find a solution to my problem elsewhere, so I hope someone can help me out.
I have been trying to figure out how I can display the first file from an array as a thumbnail, which will display a lightbox gallery of all files related to an item when clicked.
I have codes for both the display of a thumbnail of the first file in an array, and for displaying the slideshow, but I cannot manage to merge them.
An example page: http://arpc65.arm.ac.uk/omeka/items/show/564080
Ideally I want the top image to link to the slideshow, rather than the two 'files' images at the bottom of the page.
Any thought would be much appreciated!
On the page you linked, I see two thumbnails at the top of the page under the heading "Files," both of which link to a lightbox slideshow.
I don't see anything I'd recognize as the "top image" you described.
Hi John,
Thanks for your reply. You are right about the change: in the meantime I had managed to have the files, with Lightbox slideshow, to appear at the top, without the 'regular' thumbnail showing as well.
I now however cannot phantom how to remove the second image, to leave only the first image which would launch a slide show of all associated images. I have tried to change different bits of code, but keep ending up with an empty page!
Could you share the code you're using to add your images to the template? Empty pages are often caused by some syntax error in PHP.
Hi Jeremy,
I have added the code below. What I have tried so far is: change get_current_file to get_first_file; delete the second set of code to return files. The latter gives me blank pages.
I probably made some glaring mistakes, I would really appreciate some pointers!
<?php head(array('title' => item('Dublin Core', 'Title'), 'bodyid'=>'items','bodyclass' => 'show item')); ?>
<div id="primary">
<h1><?php echo item('Dublin Core', 'Title'); ?></h1>
<!-- The following returns all of the files associated with an item. -->
<div id="itemfiles" class="element">
<h3>Files</h3>
<div class="element-text">
<?php
while (loop_files_for_item()):
$file = get_current_file();
if ($file->hasThumbnail()):
echo '<p><em>Click the Image for Full Size</em></p>';
echo display_file($file, array('linkAttributes'=>array('rel'=>'lightbox[gallery]')));
else:
echo display_file($file);
endif;
endwhile;
?>
</div>
<?php
$titles = item('Dublin Core', 'Title', 'all');
if (count($titles) > 1):
?>
<h3>All Titles</h3>
<ul class="title-list">
<?php foreach ($titles as $title): ?>
<li class="item-title">
<?php echo $title; ?>
</li>
<?php endforeach; ?>
</ul>
</div><!-- end item-metadata -->
<!-- The following returns all of the files associated with an item. -->
<div id="itemfiles" class="element">
<h3>Files</h3>
<div class="element-text">
<?php while ($file = loop_files_for_item()): ?>
<?php if (!$file->hasThumbnail()): ?>
<?php echo display_file($file); ?>
<?php endif; ?>
<?php endwhile; ?>
</div>
</div>
<?php endif; ?>
I'd suggest moving that last endif; before you display your item files. The way you have it coded now, it will only show the list of files if you have more than one title filled out. Unless you intended this.
It also looks like you have two loops of item files, which may be the source of your extra file. Maybe try removing the second loop?
Thanks for your help! I followed your suggestion and got rid of a lot of dead code. The result is disappointingly nearly the same (I think)!
The code is now:
<?php head(array('title' => item('Dublin Core', 'Title'), 'bodyid'=>'items','bodyclass' => 'show item')); ?>
<div id="primary">
<h1><?php echo item('Dublin Core', 'Title'); ?></h1>
<!-- The following returns all of the files associated with an item. -->
<div id="itemfiles" class="element">
<h3>Files</h3>
<div class="element-text">
<?php
if (item_has_thumbnail())
{
echo '<p><em>Click the image for Full Size</em></p>';
echo display_files_for_item(array('linkAttributes'=>array('rel'=>'lightbox[gallery]'))); }
else
{
echo display_files_for_item();
}
?>
</div>
</div>
<!-- end item-metadata -->
<!-- The following function prints all the the metadata associated with an item: Dublin Core, extra element sets, etc. See http://omeka.org/codex or the examples on items/browse for information on how to print only select metadata fields. -->
<?php echo custom_show_item_metadata(); ?>
<!-- If the item belongs to a collection, the following creates a link to that collection. -->
<?php if (item_belongs_to_collection()): ?>
<div id="collection" class="element">
<h3>Collection</h3>
<div class="element-text"><p><?php echo link_to_collection_for_item(); ?></p></div>
</div>
<?php endif; ?>
<?php echo plugin_append_to_items_show(); ?>
<ul class="item-pagination navigation">
<li id="previous-item" class="previous">
<?php echo link_to_previous_item('← Previous Item'); ?>
</li>
<li id="next-item" class="next">
<?php echo link_to_next_item('Next Item →'); ?>
</li>
</ul>
</div><!-- end primary -->
<?php foot(); ?>
I tried changing display_files_for_item(array('linkAttributes'=>array('rel'=>'lightbox[gallery]')));
To
display_file($firstFile,array('linkAttributes'=>array('rel'=>'lightbox[gallery]')));
but that didn't give the desired result.
I am at a loss: I have quite a few objects that could have quite a few images attached to them and I do not want them all to show up at the same time!! I am going through the code step by step to see what could be changed to make only one image appear, but I am running out of options.
Try this:
$file = loop_files_for_item();
display_file($file, array('linkAttributes' => array('rel' => 'lightbox[gallery]')));
The "loop" in there looks a little confusing, but this should just get and display the first file for an item.
@ john: Thanks, that indeed works for displaying only the first image on the item page. BUT, it will also only show that first image in the slide show, not the other images.... Perhaps I inserted it in the wrong place?
<?php
if (item_has_thumbnail())
{
echo '<p><em>Click the image for Full Size</em></p>';
$file = loop_files_for_item();
echo display_file($file, array('linkAttributes' => array('rel' => 'lightbox[gallery]')));}
else
{
echo display_files_for_item();
}
?>
</div>
</div>
I am getting the feeling I want something that can't be done (as usual ;-) ).
To recap: I would really see the first image only on the item page (fixed that!); when that image is clicked, I would like all the images that link to that item to appear in the slideshow.
Thanks again for your help!
It sounds like what you really want to do is have all the images on the page (so they're picked up by your lightbox code), but just not display the others.
Try this:
// This displays the first file normally
$file = loop_files_for_item();
display_file($file, array('linkAttributes' => array('rel' => 'lightbox[gallery]')));
// Now, display the rest with a class that hides them:
while($file = loop_files_for_item()):
display_file($file, array('linkAttributes' => array('rel' => 'lightbox[gallery]', 'class' => 'hiddenfile')));
endwhile;
And add a style like this to your CSS:
.hiddenfile {display: none;}
...then it should work.
It does work! Thank you for your help!
Do you, in addition to this, have a suggestion how I can exclude pdf's from showing in the lightbox? I have tried to implement the suggestions from http://omeka.org/forums/topic/lightbox-pdf-files-omeka-12, but to no avail. I am unsure why in the examples file and $file is used, where as item is used in 'my' code. Simple replacing doesn't do the trick...
The code as it is working now is:
<div id="itemfiles" class="element">
<h3>Files</h3>
<div class="element-text">
<?php
if (item_has_thumbnail())
{
echo '<p><em>Click thumbnail for full size images</em></p>';
$file = loop_files_for_item();
echo display_file($file, array('linkAttributes' => array('rel' => 'lightbox[gallery]')));
while($file = loop_files_for_item()):
echo display_file($file, array('linkAttributes' => array('rel' => 'lightbox[gallery]', 'class' => 'hiddenfile')));
endwhile;}
else
{
echo display_files_for_item();
}
?>
</div>
</div>
See http://arpc65.arm.ac.uk/omeka/items/show/564369 for an example.