<!– Carousel Wrapper –> <div id=“carousel-example-1z” class=“carousel slide carousel-fade carousel-half” data-ride=“carousel”>

  <!-- Indicators -->
  {% assign carousel_backgrounds = site.data.blog.list.carousel_backgrounds | default: site.data.default.blog_carousel_backgrounds %}
  <ol class="carousel-indicators">
      {% assign j =0 %}
      {% for item in carousel_backgrounds %}
      {% assign j = j | plus:1%}

    <li data-target="#carousel-example-1z" data-slide-to="{{j-1}}" {% if j==1 %}class="active" {%endif %}></li>
      {% endfor %}
  </ol>
  <!-- Indicators -->
  <!-- Slides -->
  <div class="carousel-inner" role="listbox">

      {% assign j =0 %}
      {% for item in carousel_backgrounds %}
      {% assign j  = j|plus:1%}
    <!-- First slide -->
    <div class="carousel-item {% if j==1 %}active {% endif %}">
      <div class="view h-100">
        <img class="d-block h-100 w-lg-100" src="{{ item.image }}"
          alt="First slide">
        <div class="mask rgba-black-light"></div>
      </div>
    </div>
    {% endfor %}
    <!-- First slide -->
    <!-- Second slide -->
  </div>
  <!-- Slides -->
  <!-- Controls -->
  <a class="carousel-control-prev" href="#carousel-example-1z" role="button" data-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </a>
  <a class="carousel-control-next" href="#carousel-example-1z" role="button" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
  <!-- Controls -->
</div>
<!-- Carousel Wrapper -->