PHP code example of ianhobbs / kirby-swiper-block
1. Go to this page and download the library: Download ianhobbs/kirby-swiper-block library . Choose the download type require .
2. Extract the ZIP file and open the index.php.
3. Add this code to the index.php.
<?php
require_once('vendor/autoload.php');
/* Start to develop here. Best regards https://php-download.com/ */
ianhobbs / kirby-swiper-block example snippets
return [
'thumbs' => [
'presets' => [
// Blurred LQIP placeholders (blur-up effect)
'swiper-lqip-horiz' => ['width' => 40, 'height' => 23, 'crop' => true, 'quality' => 30, 'blur' => 4, 'format' => 'webp'],
'swiper-lqip-vert' => ['width' => 23, 'height' => 40, 'crop' => true, 'quality' => 30, 'blur' => 4, 'format' => 'webp'],
],
'srcsets' => [
// Landscape (16:9) — used when Orientation = Horizontal
'swiper-horiz' => [
'640w' => ['width' => 640, 'height' => 360, 'crop' => true, 'quality' => 80, 'format' => 'webp'],
'900w' => ['width' => 900, 'height' => 506, 'crop' => true, 'quality' => 82, 'format' => 'webp'],
'1400w' => ['width' => 1400, 'height' => 788, 'crop' => true, 'quality' => 85, 'format' => 'webp'],
'1920w' => ['width' => 1920, 'height' => 1080, 'crop' => true, 'quality' => 85, 'format' => 'webp'],
],
// Portrait (9:16) — used when Orientation = Vertical
'swiper-vert' => [
'480w' => ['width' => 480, 'height' => 854, 'crop' => true, 'quality' => 80, 'format' => 'webp'],
'640w' => ['width' => 640, 'height' => 1138, 'crop' => true, 'quality' => 82, 'format' => 'webp'],
'810w' => ['width' => 810, 'height' => 1440, 'crop' => true, 'quality' => 85, 'format' => 'webp'],
'1080w' => ['width' => 1080, 'height' => 1920, 'crop' => true, 'quality' => 85, 'format' => 'webp'],
],
],
],
];
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.css">
<link rel="stylesheet" href="<?= $kirby->plugin('ianhobbs/kirby-swiper-block')->asset('css/swiper-block.css')->url()
<script src="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.js" defer></script>
<script src="<?= $kirby->plugin('ianhobbs/kirby-swiper-block')->asset('js/swiper-block.js')->url()
return [
'ianhobbs.kirby-swiper-block.injectAssets' => false,
];