I’m building an Omeka S site that is planned to serve as a repository for an ongoing digitization project of a single collection. There are currently over 1500+ images which have been organized into roughly 100 item sets in order to best represent the original order. As part of organizing the site, I have a few pages which display long lists of item sets, and while this serves as a great point of access, I’ve run into an issue. Since the description of a lot of these materials is sparse at times, the combination of a title, description, and a single image doesn’t do a great job of representing whats inside the item set. Does anyone have an idea on how I might show off multiple images when displaying item sets with the browse preview block?
I did look into using one of the carousel modules and making a single page for each item set, however given the full scope of the project and the possibility of hundreds of item sets, it would be a little too time intensive!
On a basic level, you can change what’s displayed by the Browse Preview block in your theme by copying the view/common/block-layout/browse-preview.phtml file over from the core’s application folder into your theme, and editing it.
The tricky bit here is that the regular view just does something very simple to show an image: it uses the “primary” thumbnail for the set. This is something we have built-in code to do, so it handles getting an image from the items in the set and those items’ attached media, but it only works for one image, not multiple.
So, you’d need to make a call to the API using the API view helper to get the items/media you want to show. You can see what kinds of queries you can do in the API reference page, but you’d want to do something like query for 5 (or whatever the desired number is) items that are in the set you’re showing, then display the thumbnail for each of them.
$items = $this->api()->search('items', ['item_set_id' => /* the set's ID */, 'limit' => 5]))->getContent();
foreach ($items as $item):
echo $this->thumbnail($item, 'medium');
endforeach;
I’m brand new to theme editing as well as PHP and PHTML, so I hope you don’t mind if I ask a few questions!
Would going down this path require me to repeat this for every desired item set, or would it affect all item-sets within the site? Since I’m looking to have all item-sets display multiple images, it would be nice if it were a global change! I’m mainly confused by the comment “/* the set’s ID */”, since that seems like I’d have to hardcode each individual item set!
Is this the exact code I should be entering into the browse-preview.phtml file, or is it approximate/close to what I’d need to enter? I figure I’d need to throw the <?php ?> tag around it, place it under the class, and replace the comment, but I’m too inexperienced to tell if there’s more I need to fit in there.
And lastly, where should I be placing the copied browse-preview.phtml file within the structure of the theme?
Thanks in advance, and I apologize if this is becoming too much for a forum post!
You don’t need to do anything separately for each set. That comment was just meant to say “here’s where you put the code or variable for the ID of the current set.”
If you look at that browse-preview.phtml file, you’ll see it loops over an array of resources: these are the resources being displayed by the block. You can get the IDs of those resources and use them in the code I provided above. The code would go inside that existing loop in the browse-preview.phtml file. A slightly more fleshed-out version:
That added if just accounts for the fact that the Browse Preview block isn’t only used for item sets. You’ll also notice that the comment from before is now replaced with $resource->id(). Note, this simply prints out img tags for the thumbnails. If you want additional markup, links, whatever, you’d need to change things a little to provide that.