FEATURE Introducing the block
This commit is contained in:
parent
a8028c4c6f
commit
20f4b9fe73
|
|
@ -0,0 +1,28 @@
|
||||||
|
{
|
||||||
|
"name": "acf/random-collection-image",
|
||||||
|
"title": "Random Collection Image",
|
||||||
|
"category": "Image aléatoire de collection",
|
||||||
|
"multiple": false,
|
||||||
|
"icon": {
|
||||||
|
"foreground": "#136f63",
|
||||||
|
"src": "groups"
|
||||||
|
},
|
||||||
|
"keywords": [
|
||||||
|
"image",
|
||||||
|
"aléatoire",
|
||||||
|
"collection"
|
||||||
|
],
|
||||||
|
"supports": {
|
||||||
|
"align": [
|
||||||
|
"full",
|
||||||
|
"wide"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"acf": {
|
||||||
|
"mode": "auto",
|
||||||
|
"renderTemplate": "random-collection-image.php"
|
||||||
|
},
|
||||||
|
"align": [
|
||||||
|
"wide"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,30 @@
|
||||||
|
<?php
|
||||||
|
$image_collection = get_field('image_collection');
|
||||||
|
$random_image_index = rand(0, count($image_collection) - 1);
|
||||||
|
$random_image = $image_collection[$random_image_index];
|
||||||
|
|
||||||
|
$random_image_ratio = $random_image['width'] / $random_image['height'];
|
||||||
|
$random_image_ratio_class = '';
|
||||||
|
$caption = $random_image['caption'];
|
||||||
|
|
||||||
|
|
||||||
|
switch ($random_image_ratio) {
|
||||||
|
case $random_image_ratio > 1.2:
|
||||||
|
$random_image_ratio_class = 'random-collection-image--landscape';
|
||||||
|
break;
|
||||||
|
case $random_image_ratio < 0.8:
|
||||||
|
$random_image_ratio_class = 'random-collection-image--portrait';
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
$random_image_ratio_class = 'random-collection-image--square';
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
<figure class="random-collection-image-container prev-overlap-image">
|
||||||
|
<img src="<?php echo $random_image['url']; ?>" alt="<?php echo $random_image['alt']; ?>" class="random-collection-image prev-overlap-image <?php echo $random_image_ratio_class; ?>" width="<?php echo $random_image['width']; ?>" height="<?php echo $random_image['height']; ?>">
|
||||||
|
<?php if ($caption) : ?>
|
||||||
|
<figcaption class="random-collection-image-caption">
|
||||||
|
<?php echo $caption; ?>
|
||||||
|
</figcaption>
|
||||||
|
<?php endif; ?>
|
||||||
|
</figure>
|
||||||
Loading…
Reference in New Issue
Block a user