Слайдер контента
Этот слайдер, в отличие от других, предназначен для вывода блоков контента по одному. Сам слайдер написан на AlpineJS.
Вот пример слайдера из трех блоков. Вы можете использовать стрелки курсора ← и → для смены слайдов.
Sedes gratissima longam placidique
Lorem markdownum ossa lacrimae intortos; ne, ac habet. Dixit corpora navita aquae tuorum rapta. In rictus, poenam firmwareMegapixelComputing inpendere at quod nudaeque. Turbant e Pindo pudoris acies peragebant revellere fortius sua albas gentes tonitrumque videt seposuisse omnes inmittor excita et illo.
Et utrumque creditur, lingua ad undis cruor repugnat, spectant. Manu referunt tibi ferax hoc relictus caelumque portas quibus cingere concutiuntque; et undis Aeolidis volenti mundi? Sed pro iubet oro, qui luctus? Gaudete tradit et quidem, ora quam quas quoque pendenti Proetus, apte? Inpatiens innumeris: animus ipse nostri.
Ipso malis potest
Lorem markdownum foret inclusas neci soporem pignora visa puer regia ille cadit amplexus. Madidis mentem vultus.
Sospite vacuam facilis Hyacinthon, descendi sed. Commisso sine, Oete abeunt et cunctis nulla grandaevique munus Polymestoris digitis.
Thalamis animosque nullus turba concubitu corporis: stagna perdere pariter consorte. Peliacae nec ab tamen fuerit acta: spreta modo cara magna non serpentis et felix locat vestrae summa, dura. Urbis Creteque conposito inplevit neque mora idque non omnia saevorum origine formam, his. Aures morabar terrae terrigenae ante; discedere fallunt draconum gerere.
Aureae a tamen videre
Lorem markdownum oris materno, navis modo, est amat. Facie et et arma, te velit ripae fugiamus etiam suis. Patrios in Bacchi quam ramis coniunx fragilesque Pisaeae facta toro fatorum placabitis. Ablati madefactis grates quippe vidit primas mero, animi pisces Leucosiamque retroque liliaque: insignia ducit at Talibus!
Mons visa; ad est posse nec relictas, facies ipse, ope neve tumulumque satos duobus cdn_integer_address. Vix ait mandarat subiecit lacunae: successit intremuit ponto. Quater monte certamina secundum et gaudet Phiale parabat sed opacity_graphics ulla valuere; et inquit pendeat vulnera atque. Expugnacior Iolaus senserat fontibus confinia videri erat crimine Pyrame saetigeri. Arbore mea incurrite curru.
Размещение слайдера
В общем виде слайдер используется так:
<?php snippet('slides', 'start') ?>
<div class="animation-fade">
content slide 1
</div>
<div class="animation-fade">
content slide 2
</div>
<div class="animation-fade">
content slide 3
</div>
<?php snippet('slides', 'end') ?>
Сам слайдер состоит из двух частей: начальная и конечная, которые размещаются в сниппете slides. Блоки контента делятся по отдельным слайдам с помощью обычного <div>. Контент может быть произвольным. Класс animation-fade указан для эффекта анимации. Можно использовать любые другие.
Первая часть слайдера подключается с помощью сниппета, где нужно указать ключевое слово start. Соответственно, завершающая часть слайдера использует ключевое слово end.
Дополнительные css-классы
Можно указать дополнительные css-классы для начального и конечного блока. Например так:
<?php snippet('slides', 'start', 'bordered bg-primary100 pad10') ?>
<?php snippet('slides', 'end', 'bg-primary300 pad10 rounded10') ?>
Используйте их для небольшой кастомизации.
Свой вариант слайдера
При необходимости, вы можете полностью поменять поведение слайдера, изменив код сниппета. Для этого скопируйте файл slides.php из шаблона snippets в website/service/snippets, где и сделайте свои правки.