Как настроить слайдер(карусель) в шаблоне django?

Question

[Lone_Wanderer]

С помощью boostrap 4 я создал слайдер (вселял из шаблонов). С помощью django-filer я создал папку к модели и вывел все изображения Но сам слайдер(карусель) не меняет(прокручивает) изображения и выводит 2 изображения по id всего их 4. Вот код укажите пожалуйста на ошибки:

<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
    <ol class="carousel-indicators">
    {% for id in plots.imgPlots.files %}

        <li data-target="#carouselExampleIndicators" data-slide-to="{{id}}"></li>
    {% endfor %}
    </ol>
        <div class="carousel-inner">
            {% for img in plots.imgPlots.files %}
                <div class="carousel-item active">
                    <img  class="d-block w-100" src ="{{ img.url }}" alt="Третий слайд">
                </div>
            {% endfor %}
        </div>
    <a class="carousel-control-prev" href="#carouselExampleIndicators" 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="#carouselExampleIndicators" role="button" data-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
      </a>
</div>

Вот сам слайдер

Comments

[Lone_Wanderer]

Он сгенирировал сам слайдер, но кнопки не работаю и показывает центральную фотку ( тоесть у меня 4 фото и он показывает 2) сами кнопки не листаю фотки

Answer 1

[Lone_Wanderer]

<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
    <div class="carousel-inner ">
      {% for img in plots.imgPlots.files %}
        <div class="carousel-item">
              <img src="{{ img.url }}" class="d-block w-100" alt="{{id}}">
        </div>
      {% endfor %}
      <div class="carousel-item active">
        <img src="{{ plots.imgPlot.url }}" class="d-block w-100" alt="{{id}}">
      </div>
      </div>
    <a class="carousel-control-prev" href="#carouselExampleSlidesOnly" 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="#carouselExampleSlidesOnly" role="button" data-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
      </a>
</div>

Это решение. Как оказалось нельзя поставить папку с файлами в шабло вам нужно создать ещё доп 1 фото и сделать его главным(active)