CODEWITHSUNDEEP
pythonhtmldjangowagtail
Joelad
Joelad

Reputation: 490

Having a bootstrap carousel for Wagtail problem

I have been testing my code out and come across a small problem. My indicators at the bottom allow for navigation but to get to the final image in the carousel I need to click on the second last indicator? I cant see the bug :(. All the others work fine. 

  <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
        <ul class="carousel-indicators">
            {% for item in page.blogpage_images.all %}
                    <li data-target="#carouselExampleIndicators" data-slide-to="{{ forloop.counter }}" 
                                    class="{% if forloop.counter == 1 %}active{% endif %}"></li>
            {% endfor %}
        </ul>
        <div class="carousel-inner">
            {% for item in page.blogpage_images.all %}
                {% image item.image fill-900x400 as img %}
                <div class="carousel-item {% if forloop.counter == 1 %}active{% endif %}">
                    <img src="{{ img.url }}" class="d-block w-100" alt="{{ img.alt }}">
                </div>


            {% endfor %}
        </div>
    </div>

EDIT: I got the answer but theres no point in deleting the question!

Upvotes: 1

Views: 322

Answers (1)

Joelad
Joelad

Reputation: 490

{{ forloop.counter|add:"-1" }} in the data-slide-to

Upvotes: 1

Related Questions