[Answered ]-Bootstrap styling in Django

by

1👍

✅

Create a template filter for splitting the list into chunks:

from django import template

register = template.Library()

@register.filter
def chunks(l, n):
    n = max(1, int(n))
    return (l[i:i+n] for i in xrange(0, len(l), n))

Usage:

{% for chunk in images|chunks:2 %}
    <div class="row">
        {% for image in chunk %}
            <div class="col-sm-6">
                # Add image/ or data you want
            </div>
        {% endfor %}
    </div>
{% endfor %}

You could also split the list into chunks before sending it to the template.

More on how to split lists into chunks here:
How do you split a list into evenly sized chunks?

Custom filters for padding lists:

@register.filter
def ljust_list(l, n):
    """
    ljust_list([1, 2], 4) -> [1, 2, None, None]
    """
    return l + [None] * (n - len(l))

@register.filter
def rjust_list(l, n):
    """
    rjust_list([1, 2], 4) -> [None, None, 1, 2]
    """
    return [None] * (n - len(l)) + l

Usage:

{% for chunk in images|chunks:2 %}
    <div class="row">
        {% for image in chunk|ljust_list:2 %}
            <div class="col-sm-6">
                # Add image/ or data you want
            </div>
        {% endfor %}
    </div>
{% endfor %}
👤demux

1👍

This works:

{% for obj in objects %}
{% if not forloop.counter|divisibleby:2 and forloop.last %}
    <div class="row">
        <div class="col-md-6">
            {{ obj }}
        </div>
    </div>
{% elif not forloop.counter|divisibleby:2 %}
    <div class="row">
        <div class="col-md-6">
            {{ obj }}
        </div>
{% elif forloop.counter|divisibleby:2 %}
        <div class="col-md-6">
            {{ obj }}
        </div>
    </div>
{% endif %}
{% endfor %}

This solution uses Django built-in tags and filters. You may consider creating a custom tag, but that goes beyond the scope of the question.

Django: For Loop, Custom Tags

👤Matthew Lemieux

Leave a comment