templates/areas/media-img-text-slide-rotating/view.html.twig line 1

Open in your IDE?
  1. <div class="container container-md content-block {{ include('Layout/includes/editmode-box-classes.html.twig') }} {{ styleModifier | default(null) }} {{ moveUp | default(false) ? 'img-text-slide--move-up' : '' }} {{ not pimcore_input('anchorTitle').empty ? 'js-anchor-nav__item' : '' }}" {% if not pimcore_input('anchorTitle').empty %}data-anchor-nav-title="{{ pimcore_input('anchorTitle').frontend }}"{% endif %}>
  2.     {% embed 'Includes/editmode-settings.html.twig' %}
  3.         {% block additionalInfo %}
  4.             displayed slide is changing every 24 h.
  5.         {% endblock %}
  6.     {% endembed %}
  7.     {% if editmode %}
  8.         {% for i in pimcore_iterate_block(pimcore_block('slides', {limit: 12})) %}
  9.             <div class="row row--gutter-width-0">
  10.                 <div class="col-md-7 order-md-0 order-1">
  11.                     <div class="img-text-slide__img-wrapper">
  12.                         <div class="embed-responsive embed-responsive-7by5 {{ editmode ? '' : 'img-text-slide__img' }}">
  13.                             {% set description = getImageDescription(pimcore_image('image').image, true) %}
  14.                             {{ pimcore_image('image', {
  15.                                 thumbnail: 'img-text-slide',
  16.                                 imgAttributes: {
  17.                                     class: 'js-lazy-img embed-responsive-item'
  18.                                 },
  19.                                 lowQualityPlaceholder: false,
  20.                                 title: description|default(''),
  21.                                 alt: description|default('')
  22.                             })|raw }}
  23.                         </div>
  25.                         {% do jsConfig().add('lazyImg', true) %}
  26.                     </div>
  27.                 </div>
  28.                 {{ include('areas/media-img-text-slide-rotating/includes/text-section.html.twig') }}
  29.             </div>
  30.         {% endfor %}
  31.     {% else %}
  32.         {% set randElements = randomizeBlock(pimcore_block('slides').elements, document) %}
  34.         <div class="js-render-template" style="min-height: 1px;">
  35.             <template class="js-render-template__template">
  36.                 <div class="js-img-text-slider img-text-slider">
  38.                     <div class="swiper-container js-img-text-slider__slider img-text-slider__container">
  39.                         <div class="swiper-wrapper img-teaser-swiper__wrapper">
  40.                             {% for element in randElements %}
  41.                                 <div class="swiper-slide">
  42.                                     <div class="row row--gutter-width-0">
  43.                                         <div class="col-md-7 order-md-0 order-1">
  44.                                             <div class="img-text-slide__img-wrapper">
  45.                                                 {% if not element.image('image').isEmpty() %}
  46.                                                     <div class="embed-responsive embed-responsive-7by5 {{ editmode ? '' : 'img-text-slide__img' }}">
  47.                                                         {% set description = getImageDescription(element.image('image')) %}
  48.                                                         {{ element.image('image').thumbnail('img-text-slide').html({
  49.                                                             imgAttributes: {
  50.                                                                 class: 'js-lazy-img embed-responsive-item',
  51.                                                                 title: description|default(''),
  52.                                                                 alt: description|default(''),
  53.                                                             },
  54.                                                             lowQualityPlaceholder: false
  55.                                                         })|raw }}
  56.                                                     </div>
  57.                                                 {% endif %}
  59.                                                 {% do jsConfig().add('lazyImg', true) %}
  60.                                             </div>
  61.                                         </div>
  62.                                         {{ include('areas/media-img-text-slide-rotating/includes/text-section.html.twig', {
  63.                                             element: element,
  64.                                         }) }}
  65.                                     </div>
  66.                                 </div>
  67.                             {% endfor %}
  68.                         </div>
  69.                     </div>
  71.                     {% if randElements | length > 1 %}
  72.                         <div class="swiper-navigation img-text-slider__swiper-navigation img-text-slider__swiper-navigation--left">
  73.                             <button class="swiper-button swiper-button--prev img-text-slider__btn js-img-text-slider__prev"><span class="icon icon-arrow-right" aria-label="Previous"></span></button>
  74.                             <button class="swiper-button swiper-button--next img-text-slider__btn js-img-text-slider__next"><span class="icon icon-arrow-right" aria-label="Next"></span></button>
  75.                         </div>
  76.                     {% endif %}
  78.                 </div>
  79.             </template>
  80.         </div>
  82.     {% endif %}
  83. </div>