Panel - 'tag' component that includes two components

Hello everyone,
I’m working on a website for a museum in which the museum can upload events.
each event has a different location inside the museum, and the list of the locations is endless - therefore we want it to work like tags. every time they create a new ‘location’ it can be picked again in a different event.

So far it’s easy. The problem is that for each location they need to connect an icon of arrow from a list of arrows. The arrow should be part of the ‘location tag’ since it’s not going to change in the future.

Do you have any idea How should I approach this tag component that I try to achieve?

and another question is how can I create a list of custom icons inside the panel?

thanks a lot!
Nir

If you use a structure field for your list of icons, you can assign an icon to each tag.

Hi!
Thanks for the reply, the custom list of icons works great.

I’m still not sure how to achieve this complex tag component.
when you say structure field - you meant this?

How are the locations currently stored?

Yes.

Thanks!
I managed to make a selection field that shows the location pages. This helped me eventually.

The problem is that I can’t display in the page the name of the location - It only displays the path of it the site, for example: ‘home/salon’.
BTW in the panel it shows in the selection the names of the locations.

this is my location yml:

title: Location

sections:
  location: 
    type: fields
    fields:
      name:
        label: name of location
        type: text

and this is how I fetch it in the event yml:

title: Event
sections:
     location:
        label: location of event
        type: select
        options: query
        query: 
          fetch: site.children.template("Home").children.template("Location")
          text: "{{ page.name }}"
          value: "{{ page.name }}"

and this is the event.php:

<p class='location'> <?= $event->location()->name()?></p>

Any idea how I can display the name of the location (from the location yml) instead of the path of it in the site?

Thanks a lot

<?php if ($location = $event->location()->toPage()): ?>
<p class='location'> <?= $location->name()?></p>
<?php endif; ?>

Your query looks a bit odd, assuming you want to get the home page:

fetch: site.page('home').children.template("location")
1 Like

Thanks - it Works!
Im not sure why did we have to use the if statement here… ?

If the field is empty or the location was deleted, $event->location()->toPage() will return null, and you cannot call an object method (name() in this case) on null.

For more background information: A brief intro to object oriented programming in PHP | Kirby CMS

1 Like