I’m building a website for an event that has 4 days. I use tags (day 1, day 2, day 3, day 4) for this. Now i would like to have an image field for every day/tag. In wordpress, there was a plugin called ‘taxonomy images’ that does this. Is there an easy way to associate an image field with a tag in Kirby?
You can use image/file meta data fields for this purpose. In your blueprint, add something like this:
files:
fields:
day:
label: Choose what day the image belongs to
type: select
options: field
field:
name: name_of_tags_field
separator: ,
You can then use this field to fetch the correct image for the day in your template.
As an alternative, you could use a simple text field.
Hello, thank you for your suggestion. Does this mean, however, that the image cannot be changed in the admin or am i missing something?
Of course you can change the image, there is an image replacement function in the Panel. I suggest you test this out in your project to see how it works.
Read more about adding file metadata in the docs: https://getkirby.com/docs/panel/blueprints/file-settings#file-fields
Right now, in the blueprint of my events (overview), i have this:
day:
label: Day
type: tags
In the blueprint of my event (single) i have this:
day:
label: Day
type: checkboxes
options: field
field:
page: events
name: day
separator: ,
In which blueprint would i have to add your fields? Thank you!
The single event page, where you add the images. Once you have added images and the image fields in place, you can click on an image to access it in the file viewer and add your information.
Sorry if i haven’t explained myself clearly - English is not my mother tongue.
This is what an event looks like in the admin.
Right now, in the template of my events (overview) i have this:
<div class="row voorstellingen">
<div class="col-md-3 voorstelling"><?php echo kirby()->request()->params()->dag(); ?>
</div>
<?php foreach($voorstellingen as $voorstelling): ?>
<div class="col-md-3 voorstelling">
<?php $image = $voorstelling->coverImage()->toFile(); ?>
<a href="<?php echo $voorstelling->url() ?>">
<?php if($image): echo thumb($image, array('width' => 400, 'height' => 300, 'crop' => true));
endif ?>
</a>
<h3><a href="<?php echo $voorstelling->url() ?>"><?php echo $voorstelling->titel()->html() ?></a></h3>
<p><?php echo $voorstelling->omschrijving()->text()->excerpt(150) ?></p>
<button type="button" class="btn btn-secondary">
<a href="<?php echo $voorstelling->url() ?>">Lees meer</a></button> </div></div>
Instead of this
<?php echo kirby()->request()->params()->dag(); ?>
I would need the image field where the designer can upload a visual/icon for the day/tag. In the solution you’re offering, i would need to select this for every image of an event.
Ok, this is different from what I thought. So the icons would live in the overview page. But nevertheless I would tag the images with the day it belongs to and then select the image by that tag in your template, rather than creating an upload field for every day, because the number of days may vary? The difference to what I suggested above is probably that the meta data needs to be added one level up, i.e. in the events page.
Ok i will try it that way. But if i understand correctly, there is no way to extend a tag field with an image field (like the taxonomy image in wordpress)?
Since I don’t know how a taxonomy image in Wordpress works, I can’t tell you what would be comparable.
What you could also do, however, is use a structure field with two fields: tag/text and image. Instead of using the tags field type.
Kirby doesn’t use a database. So you have to build taxonomies and what you store within them in a different way.
One option is to build taxonomies as pages. Then you can add an image and other information in that page itself. Another option is using a structure field (in your events page, as part of the site settings or in a separate taxonomies pages) for the same purpose. It really depends on your use case what is the best way to achieve this in Kirby.
Edit:
If this is a conference with only 4 days and you want an image for each day, you could, of course, just add 4 image fields to the events overview page.
dag1:
label: Icon for day 1
type: image
dag2:
label: Icon for day 2
type: image
## etc.
I’m trying to work with your suggestion of using a structure field with a tag/text and image field. But now my checkboxes on the event pages are no longer loading the entries? Is this because of the separator?
Yes, the problem is that you can’t query a structure field like a normal field. However, there is a plugin for this: https://github.com/CalebGrove/select-a-structure
Thank you for your response, I’m amazed by the quickness of your support. The plugin is working and i’m almost there.
The only problem i’m facing right now is this right now, i have
<ul class="dropdown-menu">
<?php
$regios = page(voorstellingen)->regios()->yaml();
foreach($regios as $regio): ?>
<li><a href="<?php echo $site->url() ?>/voorstellingen/regio:<?=$regio[regio_titel]?>"><?php echo $regio[regio_titel] ?></li></a>
<?php endforeach ?>
</ul>
and
<div class="col-md-4 voorstelling">
<?php
if(param('regio')) {
echo kirby()->request()->params()->regio();
}
if(param('dag')) {
echo kirby()->request()->params()->dag();
}
?>
</div>
which is showing me the day but i would need to show the image of my structure field, i’m not sure if i can do this?
dagen:
label: Dag
type: structure
style: table
fields:
dag_titel:
label: Dag titel
type: text
dag_afbeelding:
label: Dag beeld
type: imageAssuming that the echoed day parameter is equal to what your structure field’s day_title field contains, then you can find the corresponding image like this:
<?php
$dagen = $page->dagen()->structure(); // assuming this is on the current page, otherwise use page('homepage') to get the right page
$dagParam = kirby()->request()->params()->dag();
$entryWithDayImage = $dagen->findBy('dag_titel', $dagParam);
$image = null;
if($entryWithDayImage):
$image = $entryWithDayImage->dag_afbeelding()->toFile();
endif;
if($image): ?>
<img src="<?= $image->url() ?>" alt="">
<?php endif ?>
Almost there. I’m getting
Call to a member function dag_afbeelding() on null
and i’m not sure why because the image exists? - once again: thank you!
Does
dump($entryWithDayImage);
return anything?
Maybe a typo? I used findBy('dag_title', $dagParam); but your field is called dag_titel…
Edit: I have edited the code above and added another if statement
I’m using <?php $dagen = $page->voorstellingen()->structure(); $dagParam = kirby()->request()->params()->dag(); $entryWithDayImage = $dagen->findBy('dag_titel', $dagParam); $image = $entryWithDayImage->dag_afbeelding()->toFile(); dump($entryWithDayImage); ?>
and still getting the error.
It seems that dump($entryWithDayImage) does not return anything. Make sure that a structure field entry with the result from $dagParamexists. I don’t know what $dagParam returns nor what you have in your content file.
Of course, to be able to see the result of your dump, you have to comment out the code that comes after that…
With this code, the error is gone
<?php
$dagen = $page->voorstellingen()->structure();
$dagParam = kirby()->request()->params()->dag();
$entryWithDayImage = $dagen->findBy('dag_titel', $dagParam);
dump($entryWithDayImage);
?>
but it doesn’t return anything.
This is the content file of my event:
Regio: Haren
----
Dag: Donderdag
This is the content file of the events
Regios:
-
regio_titel: Haren
regio_afbeelding: button6.jpg
----
Dagen:
-
dag_titel: Donderdag
dag_afbeelding: button.jpg
A structure field with the result exists.
This is then not what we want, but
<?php
$regios = $page->regios()->structure();
$dagParam = kirby()->request()->params()->dag();
$entryWithDayImage = $regios->findBy('dag_titel', $dagParam);
$image = null;
if($entryWithDayImage):
$image = $entryWithDayImage->dag_afbeelding()->toFile();
endif;
if($image): ?>
<img src="<?= $image->url() ?>" alt="">
<?php endif ?>
I don’t know where you are, if you are fetching the right page, the right field name etc. You have to check that yourself.