Shuffle image checkbox

Kirby 2 Solved ✅
1

Hi together,

I’m setting up my first kirby and now i got stuck at tryin’ to get an random background image on every reload.

my css in the header is :

background: url('<?php $bild = $page->Background()->shuffle()->first(); ?><?php if ($bild->empty()) { echo ('../../assets/img/background.jpg'); } else { echo thumb($page->image($bild))->url(); } ?>');

while Background() is the checkboxes field in my blueprint.

Some ideas? Thanks so far…

2

Try

<?php if(!$page->background()->bool()): ?>
    background: url('../../assets/img/background.jpg');
<?php else: ?>
    background: url(<?php echo thumb($page->images()->shuffle()->first())->url(); ?>);
<?php endif; ?>

This uses the default image if the checkbox is not set, and else a random image.

$page->background() is just the value of the checkbox. You can’t shuffle that, and will especially not get an image object from there.

1 Like
3

doesnt work :confused: now I get the default image all the time i refresh… Whats the reason u think? Maybe bool() doesnt work

4

What is the checkbox for? Just to decide whether to show a background image or not at all? Maybe this works:

<?php if($page->background()->bool()): ?>
   <?php if($bgimage = $page->images()->shuffle()->first()): ?>
        background: url(<?php echo thumb($bgimage)->url(); ?>);
   <?php else: ?>
        background: url('../../assets/img/background.jpg');
   <?php endif; ?>
<?php endif; ?>
5

okay I used your code without the “!” in front of $page and it works! Sorry my fault thanks a lot :smile:

6

Just beware that with that version, you will run into an error if you have set the checkbox but not image is available.

7

The img in the assets is the background if the checkbox is empty. The checkbox images is just an selection of backgrounds. Yes u r right now i go an error …

8

True that’s a problem…

<?php if(!$page->background()->bool() or ($image = $page->images()->shuffle()->first()) == null): ?>
    background: url('../../assets/img/background.jpg');
<?php else: ?>
    background: url(<?php echo thumb($image)->url(); ?>);
<?php endif; ?>
9

Still not sure if I really got what you are doing with the checkboxes XD I assume you select from all the page’s images the ones that should be used as potential background images. And from them you want to have one randomly displayed:

<?php $backgrounds = $page->background()->split(','); ?>
<?php $bg_key = array_rand($backgrounds); ?>
<?php if($image = $page->image($backgrounds[$bg_key])): ?>
  background: url(<?php echo thumb($image)->url(); ?>);
<?php else: ?> 
  background: url('../../assets/img/background.jpg');
<?php endif; ?>
1 Like
10

Of course I can only guess what he was doing with them, but I use them quite often when developing new ‘features’ like that to be able to switch between old and new behaviour without much hassle.

1 Like
11

Yea, but as I got it, @tommylee only wants to shuffle the images selected in the panel - but your solution shuffles through all images of the page

12

on this page are some more fields with images, so i cant shuffle all images of the page. So i made a checkbox for selecting images which are used exclusively as backgrounds. Hope u got it now :wink:

so thanks

<?php $backgrounds = $page->background()->split(','); ?>
<?php $bg_key = array_rand($backgrounds); ?> <?php if($image = $page->image($backgrounds[$bg_key])): ?>

background: url(<?php echo thumb($image)->url(); ?>);

<?php else: ?>

background: url(‘…/…/assets/img/background.jpg’);

<?php endif; ?>

this works great and is exactly what I searched for