When iterating through my projects, display for each a different icon depending on their order

Kirby 3 Solved ✅
1

Hi,
I’m trying to build a webpage that will, for each project, generate a link with a different svg icon that are not linked to the project, but for now, hardcoded.
So, if I have 2 projects, it will have a svg for the first project, and another svg for the other project. (the svgs won’t be stored in the image project, they are not related to the project)

I made a for that count how many project I have on the page and then create an img tag with a if condition. Something like : If it’s the first project then apply that svg, if it’s the second, this other svg, and so on.

    <?php for ($i = 1; $i <= $contenu->projets()->toPages()->count(); $i++): ?>
        <?php if ($i == 1): ?>
            <img src="https://picsum.photos/100/100" alt="">
            <?php endif ?>
            <?php if ($i == 2): ?>
            <img src="https://picsum.photos/100/200" alt="">
            <?php endif ?>
            <?php if ($i == 3): ?>
            <img src="https://picsum.photos/100/300" alt="">
        <?php endif ?>
    <?php endfor ?>

Actually, this is working quite nicely, but, it’s not very dynamic, nor the good way to go I feel.

Maybe there is a better way?

Later, on my webpage panel, I could have a collection with all my svgs, svg1, svg2, etc… that I could iterate through.

Thanks.

2

These are all the same images. Where are those images stored and based on what criteria do you want to assign them? Or just randomly or as they appear in the filesystem one by one?

3

If you look closely they are not the same image, they are random with different heights. But later they’ll be replaced with some svgs. They are just there for the testing phase.

I would like to display svg1 when i == 1, svg2 when i == 2 and so on.

4

So your svgs have numbers? Or what is svg1, svg2 etc. This is all about mapping them to the project, so we need a way to do that.

5

yeah, indeed these svgs will have numbers

6 
<?php 
$projects = $contenu->projets()->toPages();
foreach ($projects as $project): ?>
     
<?php 
$index = $projects->indexOf($project) + 1; // add one to prevent starting with 0
$filename = $index . '.svg';
// here we still need to get the file, I have no idea where you are storing them
// but you should get the idea.
?>
<?php endforeach ?>
2 Likes
7

yep, thank you, I get it, I don’t know why I tried to achieve that with a for and if…