Rendering images from type: files

The CMS Questions
1

I am trying to loop through all the images inside this structure but currently it is only displaying 1 image - any suggestions?

Here is my code:

<div class="featured-in">
<?php foreach ($page->featuredin()->toStructure() as $featuredin): ?>
<div class="image_wrap" style="display:flex;flex-direction: row;">
<img class="" src="<?= $featuredin->images()->toFile()->url() ?>" alt="<?= $page->alt() ?>"
srcset="<?= $featuredin->images()->toFile()->srcset([300, 800, 1024, 1400]) ?>" />
</div>
<?php endforeach ?>
</div>

My blueprint

featuredin:
    label: Featured In
    type: structure
    fields:
      title:
        type: text
        buttons: false
        label: Title
        width: 1/2
      images:
        type: files
        width: 1/2
2 
div class="featured-in">
<?php foreach ($page->featuredin()->toStructure() as $featuredin): ?>
<div class="image_wrap" style="display:flex;flex-direction: row;">
<?php if ( $image = $featuredin->images()->toFile() ) : ?>
    <img class="" src="<?= $image->url() ?>" alt="<?= $page->alt() ?>"
srcset="<?= $image->srcset([300, 800, 1024, 1400]) ?>" />
<?php endif ?>
</div>
<?php endforeach ?>
</div>

We need an if statement here to make sure you have an image before calling the url method.

Is there only one image per structure entry (you are not limiting it). If there can be multiple files per field, you would have to use toFiles and then loop through the files:

<?php
$files = $featuredin->images()->toFiles();
foreach ( $files as $image ) : ?> 
    <img class="" src="<?= $image->url() ?>" alt="<?= $page->alt() ?>"
srcset="<?= $image->srcset([300, 800, 1024, 1400]) ?>" />
<?php endforeach ?>
1 Like
3

Thank you for explaining this! It makes sense and is great help