Learn Wagtail Course

How to Add a RichText StreamField to your Wagtail CMS Page

Note: This is a 2 part video lesson. Part 1 will covered how to create a basic StreamField from scratch.

In this video we are going to explore how to add a RichTextBlock as a StreamField inside of an app called "streams". There are a number of ways to add a RichText StreamField to your pages, and we're covering a couple of the harder methods in this video.

# streams/blocks.py
from wagtail.core import blocks


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

    class Meta:  # noqa
        template = "streams/richtext_block.html"
        icon = "doc-full"
        label = "Full RichText"


class SimpleRichtextBlock(blocks.RichTextBlock):
    """Richtext without (limited) all the features."""

    def __init__(
        self, required=True, help_text=None, editor="default", features=None, **kwargs
    ):  # noqa
        super().__init__(**kwargs)
        self.features = ["bold", "italic", "link"]

    class Meta:  # noqa
        template = "streams/richtext_block.html"
        icon = "edit"
        label = "Simple RichText"
# flex/models.py
# .....
from streams import blocks.py

class FlexPage(Page):
    # ....

    content = StreamField(
        [
            ("title_and_text", blocks.TitleAndTextBlock()),
            ("full_richtext", blocks.RichtextBlock()),
            ("simple_richtext", blocks.SimpleRichtextBlock()),
        ],
        null=True,
        blank=True,
    )

The Git Commit

If you're interested in seeing the entire commit for this video, all the source code is available here.

Was this helpful to you?

Sharing is caring. Help the community by sharing this article.

  • By Kalob Taulien
  • on February 01, 2019