templates/override/slider/slider.html.twig line 1

Open in your IDE?
  1. <div {% if Slider.height is not null and Slider.height > 0 %}style="height: {{ Slider.height }};"{% endif %} id="slider_{{Slider.id}}" class="slider-container {{Slider.classes}}">
  2.   <div class="swiper-content">
  3.     <div class="swiper-container slider_bundle slider_bundle_{{Slider.id}}"
  4.         data-speed="{% if Slider.scrollspeed is not empty %}{{ Slider.scrollspeed }}{% else %}1000{% endif %}"
  5.         data-fade="{% if Slider.fade %}true{% else %}false{% endif %}"
  6.         data-autoplay="{% if Slider.autoplay %}true{% else %}false{% endif %}"
  7.         data-autoplaydelay="{% if Slider.autospeed > 0 %}{{ Slider.autospeed }}{% else %}8000{% endif %}"
  8.         data-centered="{% if Slider.centermode %}true{% else %}false{% endif %}"
  9.         data-loop="{% if Slider.infinite %}true{% else %}false{% endif %}"
  10.         data-id="{{Slider.id}}"
  11.     >
  12.       <div class="swiper-wrapper">
  13.         {% for Entry in entries %}
  14.             {% if Entry.slideUrl is not null %}
  15.               <a href="{{ Entry.slideUrl }}" class="swiper-slide {{ Entry.classes }}" {% if Slider.height is not null and Slider.height > 0 %}style="height: {{ Slider.height }};"{% endif %}>
  16.             {% else %}
  17.               <div class="swiper-slide {{ Entry.classes }}" {% if Slider.height is not null and Slider.height > 0 %}style="height: {{ Slider.height }};"{% endif %}>
  18.             {% endif %}
  20.               {% if Entry.mobilemedia %}
  21.                 <div class="image d-lg-none">
  22.                   <div class="lcp">
  23.                     {% if Entry.mobilemedia is not empty %}
  24.                       {% if Entry.mobilemedia.hasBlurred %}
  25.                         <picture>
  26.                           {% if Entry.mobilemedia.hasWebp() %}
  27.                             <source srcset="/{{Entry.mobilemedia.getBlurredWebpPath('large')}}" type="image/webp">
  28.                           {% endif %}
  29.                           <source srcset="/{{Entry.mobilemedia.getBlurredWebPath('large')}}" type="{{Entry.mobilemedia.mime}}">
  30.                           <img class="lq" alt="{{Entry.mobilemedia.description_alt}}" src="/{{Entry.mobilemedia.getBlurredWebPath('large')}}" type="{{Entry.mobilemedia.mime}}" loading="eager" width="{{Entry.mobilemedia.width}}" height="{{Entry.mobilemedia.height}}">
  31.                         </picture>
  32.                       {% endif %}
  33.                       <picture>
  34.                         {% if Entry.mobilemedia.hasWebp() %}
  35.                           <source srcset="/{{Entry.mobilemedia.getWebpPath('full')}}" type="image/webp">
  36.                         {% endif %}
  37.                         <source srcset="/{{Entry.mobilemedia.getWebPath('full')}}" type="{{ Entry.mobilemedia.mime }}">
  38.                         <img class="hq" alt="{{Entry.mobilemedia.description_alt}}" src="/{{Entry.mobilemedia.getWebPath('full')}}" type="{{Entry.mobilemedia.mime}}" loading="eager" width="{{Entry.mobilemedia.width}}" height="{{Entry.mobilemedia.height}}" onload="this.style.opacity=1" style="opacity: 0;">
  39.                       </picture>
  40.                     {% endif %}
  41.                   </div>
  42.                 </div>
  43.               {% endif %}
  45.               <div class="image {% if Entry.mobilemedia %}d-none d-lg-block{% endif %}">
  46.                 <div class="lcp">
  47.                   {% if Entry.Media is not empty %}
  48.                     {% if Entry.Media.hasBlurred %}
  49.                       <picture>
  50.                         {% if Entry.Media.hasWebp() %}
  51.                           <source srcset="/{{Entry.Media.getBlurredWebpPath('large')}}" type="image/webp">
  52.                         {% endif %}
  53.                         <source srcset="/{{Entry.Media.getBlurredWebPath('large')}}" type="{{Entry.Media.mime}}">
  54.                         <img class="lq" alt="{{Entry.Media.description_alt}}" src="/{{Entry.Media.getBlurredWebPath('large')}}" type="{{Entry.Media.mime}}" loading="eager" width="{{Entry.Media.width}}" height="{{Entry.Media.height}}">
  55.                       </picture>
  56.                     {% endif %}
  57.                     <picture>
  58.                       {% if Entry.Media.hasWebp() %}
  59.                         <source srcset="/{{Entry.Media.getWebpPath('full')}}" type="image/webp">
  60.                       {% endif %}
  61.                       <source srcset="/{{Entry.Media.getWebPath('full')}}" type="{{ Entry.Media.mime }}">
  62.                       <img class="hq" alt="{{Entry.Media.description_alt}}" src="/{{Entry.Media.getWebPath('full')}}" type="{{Entry.Media.mime}}" loading="eager" width="{{Entry.Media.width}}" height="{{Entry.Media.height}}" onload="this.style.opacity=1" style="opacity: 0;">
  63.                     </picture>
  64.                   {% endif %}
  65.                 </div>
  66.               </div>
  68.               <div class="container">
  69.                 <div class="vtable">
  70.                   <div class="vcell">
  71.                     <div class="titles">
  72.                       <div class="row d-flex justify-content-center">
  73.                         <div class="col-12 col-lg-6">
  74.                           <div class="slide-content text-center">
  75.                             {% if Slider.showContent %}
  76.                               <span class="slide-subtitle">{{Entry.getContent|raw}}</span>
  77.                             {% endif %}
  78.                             {% if Slider.showTitle %}
  79.                               <span class="slide-title">{{Entry.getLabel|raw}}</span>
  80.                             {% endif %}
  82.                             {% if Entry.slideUrl is null %}
  83.                               {% if Entry.buttons and Entry.buttons is not empty %}
  84.                                 <div class="slide-buttons mt-4 mb-5">
  85.                                   {% for button in Entry.buttons %}
  86.                                   <a href="{{button.url}}" title="{{button.label}}" {% if button.target is defined and button.target != "null" %} target="{{button.target}}" {% endif %} class="btn {{button.class}}">{{button.label}} <i class="fa fa-arrow-right"></i></a><br>
  87.                                   {% endfor %}
  88.                                 </div>
  89.                               {% endif %}
  90.                             {% endif %}
  91.                           </div>
  92.                         </div>
  93.                       </div>
  94.                     </div>
  95.                   </div>
  96.                 </div>
  97.               </div>
  98.             {% if Entry.slideUrl is not null %}
  99.               </a>
  100.             {% else %}
  101.               </div>
  102.             {% endif %}
  103.         {% endfor %}
  104.       </div>
  106.       {% if Slider.dots %}
  107.       <div class="swiper-pagination swiper-pagination_{{Slider.id}} "></div>
  108.       {% endif %}
  109.       {% if Slider.arrows %}
  110.       <div class="swiper-button-prev swiper-button-prev_{{Slider.id}}"></div>
  111.       <div class="swiper-button-next swiper-button-next_{{Slider.id}}"></div>
  112.       {% endif %}
  113.     </div>
  114.   </div>
  115. </div>