Add classes to values (Foundation )

Omeka S Themes
1

I’m trying to figure out how (where) to add classes to values of properties for individual styling (item-view). E.g. I’d like to add a class to “Identifier” to color it blue. And I’d like to display “Format” inline.
I hope someone can point me in the right direction… Thanks :slight_smile:

1 Like
2

Hello,
I am interested in this question, too. Did you find out how to do this? Or does someone else have an idea? thank you so much in advance!

3

Unfortunately there is not a convenient way to do this using the CSS Editor. This is also not a theme issue - you will want to look in the core files where the item properties are displayed, and edit that code. Ideally we would add an ID to each div, not a class, and then you can select which ones you want to change out of that list.

If you edit the core files directly, you will not be able to update in the future without overwriting your edits.

If you want to proceed, the file in question is here:

Change line 44 from:

<div class="property">

to:

<div class="property" id="<?php echo $escape($propertyLabel); ?>">

Then you can use CSS Editor to select #Title, #Description, #Provenance, etc.

Here’s how it looks on my site:

ids

1 Like
4

Thank you so much! This is amazing :blush:

May I ask another question? Is there a way to write the id of the item into the body-class of the page which shows the item? Something like ? I would like to design some item-pages in another way than my standard-design.

Thank you again for your great work!
Best
Esra

5

I wouldn’t recommend editing core view files. You can easily copy this view into your theme’s directory to override it and not have to worry about it being overwritten during an upgrade.

You can read more about this in the developer documentation:
https://omeka.org/s/docs/developer/themes/theme_modifications/

1 Like
6

oh yes, thank you! this is a good advice! I will have a look into the documentation and try that. I guess this is similar to the concept of wordpress child-themes? thank you so much for your help :heart:

7

Yes. Not quite the same, but a very similar concept.

1 Like
8

In this case the theme is the place to look for this file:

It overrides the core files in this instance, though it does not in the first question. If you are making a child theme, you can copy that first core file into the corresponding theme folder as well.

It would look something like adding this line after line 5:

$this->htmlElement('body')->appendAttribute('class', 'item resource show');
$this->htmlElement('body')->appendAttribute('id', "item-" . $this->item->id());

To get the format
<body class="item resource show" id="item-5236">

For item IDs I think an ID would be fine, but if you have a particular use case in mind and you can pass that specific value (say, items with a specific class, or one common value in something like “Creator” maybe), class would be the way to go.

1 Like
9

awesome! thank you so much! this is a lot of help – I really appreciate that :heart_eyes:
now I have a lot to do and I am looking forward to it.
thank you so much all of you!