Get images from Subfolder and resize them

Kirby 2 Questions 🤔
1

My actual code:

<div id="galleryowl" class="owl-carousel">
<?php foreach($page->images() as $image): ?>
<div class="startsilder">
<img src="<?php echo $image->url() ?>" alt="">
</div>
<?php endforeach ?>
</div>

This gets every image from the current page, but i want to have the images from a subfolder called ‘gallery’. I tried to use ‘as $subfolder’ but this does not work. And: as i am using the owl carousel i would like to resize them without using the thumb function. How can i combine this? Sorry if this is pretty basic, but try and error did not do the job in the last hours…

2

To get the images from the subfolder, you can use the following code:

<div id="galleryowl" class="owl-carousel">
<?php foreach($page->children()->find('gallery')->images() as $image): ?>
<div class="startsilder">
<img src="<?php echo $image->url() ?>" alt="">
</div>
<?php endforeach ?>
</div>

Why don’t you want to use the thumb function?

3

Thanks! I was close… forgot about the find(‘foldername’).

Would it be the only way? Well since I don’t want to make them ‘increasable’… well if it does the job: what would be the best way?

4

There are some options:

<div id="galleryowl" class="owl-carousel">
<?php foreach($page->children()->find('gallery')->images() as $image): ?>
<div class="startsilder">
// just use the thumb function to create the tag
<?php echo thumb($image, array('width' => 300)); ?>
//use the image tag
<img src="<?php echo thumb($image, array('width' => 300))->url() ?>" alt="">
//since Kirby 2.2
<img src="<?php echo $image->resize($width, $height)->url(); ?>" alt="">
</div>
<?php endforeach ?>
</div>

What you mean by make them increasable? As far as I’m aware, the images don’t get increased if they are smaller then given value.

5

Thanks for the help. I think I am confusing terms here. I would like to serve the images smaller than they are as a source. My grid takes care about the image size in terms of width, but the full-sized image is of course still loaded. Are there some best practices without using services as imgIX?

6

Well, currently there is still no great and one and way way to serve adaptive images. It really depends on your use case and your target group. One option is to use srcset, but browser support is still limited, another to use a php script called Adaptive Images; or lazy loading techniques …