templates/includes/hero-carousel.html.twig line 1

Open in your IDE?
  1. {% set carouselSlides = pimcore_select('carouselSlides', {
  2.     width: 70,
  3.     reload: true,
  4.     store: [[1, 1], [2, 2], [3, 3], [4, 4], [5, 5]],
  5.     class: 'align-middle'
  6. }) %}
  7. {% set count = carouselSlides.getData() %}
  8. {% if count is empty or count == 0 %}
  9.     {% set count = 1 %}
  10. {% endif %}
  11. <section id="heroCarousel" class="carousel slide" data-ride="carousel" {{ editmode ? 'data-interval="false"' }}>
  12.     {% if count > 1 %}
  13.         <ol class="carousel-indicators">
  14.             {% for j in 0..(count - 1) %}
  15.                 <li data-target="#heroCarousel" data-slide-to="{{ j }}" class="{{ j == 0 ? 'active':'' }}"></li>
  16.             {% endfor %}
  17.         </ol>
  18.     {% endif %}
  20.     <div class="carousel-inner">
  21.         {% for i in 0..(count - 1) %}
  22.         <div class="carousel-item position-relative {{ 'heroCarousel-' ~ i }} {{ loop.first ? 'active' }}">
  23.             {% set cImage = pimcore_image('cImage_' ~ i, {
  24.                 thumbnail: 'portalCarousel',
  25.                 hidetext: true,
  26.                 title: 'Drag Image Here',
  27.                 imgAttributes: {class: 'd-block w-100'},
  28.                 dropClass: 'portal-slide-' ~ (i + 1)
  29.             }) %}
  31.             {{ cImage|raw }}
  32.             <div class="carousel-caption d-block">
  33.                 {% if(i == 0) %}
  34.                     <h1>{{ pimcore_input('cHeadline_' ~ i,{'placeholder':'Headline'}) }}</h1>
  35.                 {% else %}
  36.                     <div class="display-1">{{ pimcore_input('cHeadline_' ~ i,{'placeholder':'Headline'}) }}</div>
  37.                 {% endif %}
  39.                 <p class="hero-text">{{ pimcore_textarea('cText_' ~ i,{'placeholder':'Summary'}) }}</p>
  40.                 <p>{% set cLink = pimcore_link('cLink_' ~ i, {
  41.                         'class': 'btn btn-lg btn-primary'
  42.                     }) %}
  43.                     {{ cLink|raw }}
  44.                 </p>
  45.             </div>
  46.         </div>
  47.         {% endfor %}
  48.     </div>
  49.     {% if count > 1 %}
  50.         <a class="carousel-control carousel-control-prev" href="#heroCarousel" role="button" data-slide="prev">
  51.             <span class="carousel-control-prev-icon" aria-hidden="true"></span>
  52.             <span class="sr-only">Previous</span>
  53.         </a>
  54.         <a class="carousel-control carousel-control-next" href="#heroCarousel" role="button" data-slide="next">
  55.             <span class="carousel-control-next-icon" aria-hidden="true"></span>
  56.             <span class="sr-only">Next</span>
  57.         </a>
  58.     {% endif %}
  59.     {% if editmode %}
  61.         <div class="container pt-2 pb-5">
  62.             <span class="editmode-label align-middle d-inline-block">Number of Slides:</span> {{ carouselSlides|raw }}
  63.         </div>
  65.     {% endif %}
  66. </section>