Omeka S [shortcodes]

Omeka S Development
1

What I would like to do is add two buttons from my Assets into an Item that shows in a Browse Preview block, one linking to the item’s /item/# page, and the other linking to a different /page/page-name-here page using either href or url addresses.

I have figured out how to add to either my Item’s Title or Description a shortcode to call the Asset as an image only: [asset 104 image], but can’t figure out how to tell it where to go when clicked**. I am also having trouble telling CSS how to line them up the way I want when there is more than 1.

**A bonus would be to be able to dynamically fill-in-the-blank for the link, such as href=this.item-page or url=this.meta.dcterms:abstract, where there is a url in the dcterms:abstract spot. I’m sorry if it looks JavaScript-ish, but you get the idea? Or can you nest a [shortcode] within a [shortcode]? Such as [asset 106 href="/page/[id]-interview" button], where the asset #106 is a button that leads to the site’s /page/"current item's id#"-interview.

One huge request:
Can someone make a module for (or add to “Easy Admin”) adding custom [shortcodes]?

I was super excited to find out about shortcodes in Omeka S–especially when I learned that it could pull an asset from the Assets panel. But then I have come up with a million questions and not many or confusing answers. Is there a way to make a more user-friendly guide to [shortcodes], what they do, their syntax, and what is “built-in” vs what comes with or needs certain modules? More explanation of things such as how to “wrap the output with a and optionally a class” and how to do these things with more than just the item used in the manual and Github tables.

2

EDIT:

I think I’ve figured out at least part of what I want to do. In the HTML block of the “Browse Preview” block, in view, I added:

<script>

var itemID = $item->id;

var targetDiv = document.querySelector(".resource__thumbnail");

var buttonSee = document.createElement("button");
button.See.innerHTML = '<a href="/item/' + itemID + '"><img src="https://blmohp.sewanee.edu/files/asset/911ddfe882983f515b06c740dc25cf08c8d266de.png"></a>';

var buttonHear = document.createElement("button);
buttonHear.innerHTML = '<a href="/page/' + itemID + '-interview"><img src="https://blmohp.sewanee.edu/files/asset/a88752e3778e6438e56dff8d424ff433196a8041.png"></a>';

targetDiv.insertAdjacentElement("afterend", buttonSee);
targetDiv.insertAdjacentElement("afterend", buttonHear);

</script>

It still doesn’t do what I want, but I feel like I am close. How do I tell it to do this for each item that is pulled up by the original query?

3

Yes, it’s possible to create new shortcodes and to improve existing ones. Just see the code. About nested shortcodes, it may be complex to implement, but it’s open source.

The table explaining all the options is broken on omeka.org (Omeka S - Shortcode), but you can go to gitlab (Daniel-KM / Omeka S Module Shortcode · GitLab) to get it full. I copy it here for main arguments:

Argument name Purpose Argument value Example
id Get a list of resources by id. List or range of integers [items id=15,30,51], [items id=15-51]
ids Deprecated alias of id List or range of integers See id
site Get only resources from the specified site Integer [items site=2]
owner Get only resources owned by a specific user Integer [items owner=2]
user Deprecated alias of owner Integer See owner
item_set Get only resources from an item set List or range of integers [items item_set=7]
collection Alias of item_set List or range of integers [items collection=7]
class * Get only resources from one or multiple classes List of terms or ids [items class=dctype:StillImage,26]
class_label Get only resources from a class via its label String [items class_label="Physical Object"]
item_type Deprecated alias of class_label) String See class_label
template Get only resources from one or multiple templates List or range of integers [items template=1,2]
template_label Get only resources from a template via its label String [items template_label="Base Resource"]
tag * Get only resources with the specified tag (curation:tag) List of strings [items tag="alpha, beta, gamma"]
tags * Deprecated alias of tag List of strings See tag
is_featured Get only resources with a value curation:featured. Boolean [collections is_featured=1]
has_image * Resource with an image (a thumbnail), or not. Boolean [featured_items has_image=false]
has_media * Resource with a media, or not. Boolean [items has_media=true]
query Specify a query to limit resources String (advanced search url) [items query="search=xxx"]
num Number of resources returned. “0” means unlimited. Default: 10. Integer [featured_items num=4]
sort Property term or specific api value to sort the resource by. Property term or json-ld keys [items sort=dcterms:date], [items sort=created]
order Order of the sorting a, d, asc, or desc [items sort=dcterms:title order=asc]
meta Get the specified metadata Property term or json-ld keys [item 51 meta=dcterms:creator], [item 51 meta=title]
span Wrap the output with a span and optionally a class String or Null [item 51 span=author]
view Specify a special theme template for specific rendering String [items view=items]
4

I’ve fixed the rendering of the version of that table on the Omeka website also, so it should be showing correctly on the module’s page now.

5

To clarify: I know that it is possible to create new shortcodes or improve existing ones in the code, but there isn’t a lot on how. Not to mention that I don’t have easy access to the backend of the site that I am using it most on. That’s why the suggestion/request was for a module that brings it to the frontend, similar to how “Easy Admin” brings installing modules and themes to the frontend. And yes, there is a little bit on how, but it assumes the person wanting to do it already knows what to do and where to put it.

The options table that is broken on omeka.org and also on gitlab isn’t the exact same as the one you copied in your reply. Your copied table actually shows something about using the “span” option whereas the others do not (and I haven’t compared the rest to see any other differences). I wish it could also show how to do a link or url with an actual example. Using the syntax from the paragraphs before the table didn’t work for adding a url to an asset to make a button; either that or what works for an item doesn’t work for an asset.

Aside from my requests for pretty much a “Omeka S Shortcodes For Dummies”, I have another “edit” to my question:
In a plain HTML block,
This works: [items class_label=Interview]
This doesn’t work: [items class_label=Interview sort=foaf:lastName]
Nor this: [items class_label=Interview span='item'+''+'[meta=fabio:hasSequenceIdentifier]']

What I am wanting to do now is get a list of items made using the class of “Interview”. That works. But it doesn’t do anything with sorting or adding a around the list items. In the Item metadata, I have included a place for first and last name (foaf:firstName, foaf:lastName) and ID# (fabio:hasSequenceIdentifier) specifically for purposes of sorting. Since they are only used for sorting, I have them hidden so they don’t show on the regular item page. I tried “un-hiding” them to test if that is why it doesn’t work, with no success. What am I doing wrong?

Within each item page, I have figured out how to pull an asset and have it line up nicely (CSS is needed to hide the title and description and change the display, but it works). But if I try adding a link or url to it, it doesn’t work. This puts the images where I need them, but how do I make them work as a button?
What works: [asset 106]
What doesn’t work: [asset 106 url="https://blmohp.sewanee.edu/item/25"] or [link 106 href="/item/25"]