В обшем есть данная тема использующая Bootstrap, в ней есть данная часть кода:
<div class="carousel-item"><img class="img-fluid" src="/static/images/4.jpg" alt="Second slide"/>
<div class="carousel-caption d-none d-md-block"> </div>
</div>
<div class="carousel-item"><img class="img-fluid" src="/static/images/5.jpg" alt="Third slide"/>
<div class="carousel-caption d-none d-md-block"> </div>
</div>
И если это все смотреть уже в браузере то там есть слайды, я решил сделать так:
<div class="carousel-inner" role="listbox">
{% if latest_tovar_list %}
<ul>
{% for tovar in latest_tovar_list %}
<div class="carousel-item active"><img class="img-fluid" src="{{tovar.image.url}}" alt="First slide"/>
{% endfor %}
<div class="carousel-caption d-none d-md-block"> </div>
</div>
</ul>
{% else %}
<p>Ничего нету :(</p>
{% endif %}
Но это не работает как надо, если в БД есть всего 1 «tovar», то отображается все как надо, а вот если больше 1, то эти слайды не работают, изображения располгаются друг под другом.
Сам код на питоне:
def index(request):
latest_tovar_list = Product.objects.order_by('-name')[:5]
context = {'latest_tovar_list': latest_tovar_list}
return render(request, 'mainPage/index.html', context)
Объясните мне, как заставить это все работать?