Skip to content
Browse files

ListBlock example for repeating StreamField content

  • Loading branch information
KalobTaulien committed Feb 2, 2019
1 parent 84ad12e commit 0c0ec6b00c80f8498ca9052c3487178de6732fe9
Showing with 51 additions and 0 deletions.
  1. +1 −0 flex/
  2. +26 −0 mysite/templates/streams/card_block.html
  3. +24 −0 streams/
@@ -18,6 +18,7 @@ class FlexPage(Page):
("title_and_text", blocks.TitleAndTextBlock()),
("full_richtext", blocks.RichtextBlock()),
("simple_richtext", blocks.SimpleRichtextBlock()),
("cards", blocks.CardBlock()),
@@ -0,0 +1,26 @@
{% load wagtailimages_tags %}

<div class="container mb-sm-5 mt-sm-5">
<h1 class="text-center mb-sm-5">{{ self.title }}</h1>
<div class="card-deck">
{% for card in %}
{% image card.image fill-300x200 as img %}
<div class="card">
<img src="{{ img.url }}" alt="{{ img.alt }}" class="card-img-top" />
<div class="card-body">
<h5 class="card-title">{{ card.title }}</h5>
<p class="card-text">{{ card.text }}</p>
{% if card.button_page %}
<a href="{{ card.button_page.url }}" class="btn btn-primary">
Learn More
{% elif card.button_url %}
<a href="{{ card.button_url }}" class="btn btn-primary">
Learn More
{% endif %}
{% endfor %}
@@ -1,6 +1,7 @@
"""Streamfields live in here."""

from wagtail.core import blocks
from wagtail.images.blocks import ImageChooserBlock

class TitleAndTextBlock(blocks.StructBlock):
@@ -15,6 +16,29 @@ class Meta: # noqa
label = "Title & Text"

class CardBlock(blocks.StructBlock):
"""Cards with image and text and button(s)."""

title = blocks.CharBlock(required=True, help_text="Add your title")

cards = blocks.ListBlock(
("image", ImageChooserBlock(required=True)),
("title", blocks.CharBlock(required=True, max_length=40)),
("text", blocks.TextBlock(required=True, max_length=200)),
("button_page", blocks.PageChooserBlock(required=False)),
("button_url", blocks.URLBlock(required=False, help_text="If the button page above is selected, that will be used first.")),

class Meta: # noqa
template = "streams/card_block.html"
icon = "placeholder"
label = "Staff Cards"

class RichtextBlock(blocks.RichTextBlock):
"""Richtext with all the features."""

2 comments on commit 0c0ec6b


This comment has been minimized.

Copy link

alexandrefsr replied Jan 26, 2020

It doesn't work. Cards appear empty. Followed every single step yet every field seems not to be accessible


This comment has been minimized.

Copy link
Member Author

KalobTaulien replied Jan 27, 2020

It doesn't work. Cards appear empty. Followed every single step yet every field seems not to be accessible

It's accessible. Chances are you haven't written the template loop properly.

A better place for questions or support would be

Please sign in to comment.
You can’t perform that action at this time.