Flexible For loop

39 views
Skip to first unread message

Nkansah Rexford

unread,
Apr 3, 2015, 11:48:11 AM4/3/15
to django...@googlegroups.com
allow me to use wired.com to ask my question

On wired.com, you see the news items displayed in cards, with varying sizes.

In django, using the {% for %} will mean all the news item will have the same card design and size etc.

Is there a way in Django to have the design intact, and just filling in the missing areas without having to use use {% for %} on one particular design card to display the list items?

What I tried sometime ago was to use slices in templates, so I would slice each index of the returned list one by one, and place them in each card.

Is there a better solution to this?

So something like this, for instance:

{% for i in object_list %}
<h1> {{ i.title }} </h1>
<div class="excerpt"> {{ i.description|truncatechars:"250" }} </div>
<!-- Then the second part is different from the first -->

<h4> {{ i.title }} </h4>
<div class="excerpt smaller"> {{ i.description|truncatechars:"100" }} </div>
{% endfor %}

in the above scenario, django will go through every tag in the {% for %} template tag, and will replace first item in the {% for %} block with first item in object_list

Should there be left over {{ i.title }}'s in the for loop, it doesn't show those parts at all, and hides them.

I don't know if the above concept makes sense, but I'm willing to explain further. Or if there's a workaround to doing something like the above without using slices, I'm all ears.

thanks

Peith Vergil

unread,
Apr 3, 2015, 3:20:48 PM4/3/15
to django...@googlegroups.com

The tiled cards with varying sizes are done in JavaScript. Have a look at the Masonry JS library. It'll allow you to easily get the same effect.

You just need to render the Django templates as usual. Then, use Masonry to automatically rearrange the tiles.

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users...@googlegroups.com.
To post to this group, send email to django...@googlegroups.com.
Visit this group at http://groups.google.com/group/django-users.
To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/587e2855-91e9-4e96-ba09-3ab66028b75d%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Nkansah Rexford

unread,
Apr 7, 2015, 6:41:01 AM4/7/15
to django...@googlegroups.com
Thanks for pointing out. That's the solution then!
Reply all
Reply to author
Forward
0 new messages