Tags as url to unlisted pages

The CMS Questions
21

Let me show you my article code

22 
<?php foreach ($articles as $article): ?>
<article class="story col-4@md">

<a href="<?= $article->url() ?>" class="story__img">
              <figure class="media-wrapper media-wrapper--4:3">
                <img src="<?= $article->image()->url() ?>" alt="GGIT summer camp">
              </figure>
            </a>

            
            <div class="story__content">
              <div class="margin-bottom-xs">
                <a href="<a href="" class="story__category">
                  <svg class="icon margin-right-xxxs" aria-hidden="true" viewBox="0 0 16 16"> 
<g stroke-width='1' fill='none' stroke='currentColor' stroke-linecap='round' stroke- 
linejoin='round'><rect x='0.5' y='1.5' width='15' height='13' rx='1' ry='1'></rect> 
  <polygon points='5.5 4.5 11 8 5.5 11.5 5.5 4.5'></polygon></g></svg>
                  <?php $tag = $article->tags(); ?>
                    <?php if ( $p = page($tag) ) : ?>
                        <a href="<?= $p->url() ?>"><i><?= $tag ?></i></a>
                    <?php else : ?>
                        <?= $tag ?>
                    <?php endif ?>
                                          
                </a>
              </div>
      
    <div class="text-component">
  <h2 class="story__title"><a href="<?= $article->url() ?>"><?= $article->heading()- 
  >html() ?></a></h2>
                
              </div>
      
              <div class="story__author margin-top-sm">
              <?php if ($author = $article->author()->toUser()) : ?>
                  <?php if($avatar = $author->avatar()): ?>
                    <a href="<?= $article->url() ?>" class="block">
                  <img src="<?= $avatar->url() ?>" alt="">
                                      </a>
                <?php endif ?>
                

                <div class="line-height-xs">
                  <address class="story__author-name"><a href="#0" rel="author"><?= 
  $author->name() ?></a></address>
                  <p class="story__meta"><time><?= $article->published() ?></time> &mdash; 
     5 min read</p>
                  <?php endif ?>
                  </div>
              </div>
            </div>
          </article>
<?php endforeach ?>
23

Please I am still stuck here, and frontend language dropdown

24

I tried to set options for tag in the Yaml file and set icon for each option but not working

25

Please I still need help on assigning icon to each tags, I followed the tutorial but I’m unable to get it working.

26

I still have no idea how your icons and your tags are related. As long as you don’t answer that question, I unfortunately cannot help you at all, as much as I would love to.

27

needed
needed787×290 72.5 KB

The tags and icons are circled in the picture, That tag links to another page when clicked but I want to set that icons to be dynamic, each tag has different icon and the icons are svg files. I think I have explained better

28

This does not answer my question. The question is: What is the connection between a tag and an icon.

Or in other words: How do you know which icon belongs to which tag? Filename? A connection your have created in your content files via the Panel?

I have asked this multiple times now, but still don’t have an answer. It doesn’t help if you show me an image where I can see a tag and an icon.

29

I have never done anything of such, I have everything in my html template, I have all the svg in html. I am just asking for how to assign an icon and how to publish it, I do not know the best way to answer your question because I have explained what i need and i do not know what you mean by relationship between the icon and the tag

30 
<a href="<a href="" class="story__category">
                  <svg class="icon margin-right-xxxs" aria-hidden="true" viewBox="0 0 16 16"><g stroke-width='1' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round'><rect x='0.5' y='1.5' width='15' height='13' rx='1' ry='1'></rect><polygon points='5.5 4.5 11 8 5.5 11.5 5.5 4.5'></polygon></g></svg>
                  <?php $tag = $article->tags(); ?>
                    <?php if ( $p = page($tag) ) : ?>
                        <a href="<?= $p->url() ?>"><i><?= $tag ?></i></a>
                    <?php else : ?>
                        <?= $tag ?>
                    <?php endif ?>
                                          
                </a>
31

Somewhere, you have to tell Kirby which icon belongs to which tag. You can establish a relationship via filenames, e.g. an svg postcast.svg belongs to an tag podcast.

Or you can set up a structure field where you match a tag and an icon.

It totally depends on you. But this is essential, otherwise it won’t work.

32

I tried using this in my yaml for the article page
tags:
label: Tags
type: tags
options:
text: Article
icon:
text: EduTolk
icon:

33

please can you just show an example, This is just my biggest problem for now

34

I know how to create toStructure only in template, how can I make it work for tag and icon

35

I’d suggest you store your svgs in files in the parent page. Name them like the tags, e.g. podcast.svg, edutalk.svg etc., then you can pull them in from there, without having to set up any structure field or other relationship.

36

I have done this but I do not know how to pull the svg files dynamically

37 
if ( $icon = $page->parent()->file($tag . '.svg') ) {
  echo $icon;
}