Wagtail 2: Adding a Banner Mixin to your Wagtail Pages

banner.py

from django.db import models

from wagtail.core.fields import RichTextField
from wagtail.search import index
from wagtail.admin.edit_handlers import FieldPanel, PageChooserPanel
from wagtail.images.edit_handlers import ImageChooserPanel


class Banner(models.Model):
    """Banner mixin for a page."""

    banner_title = models.CharField(max_length=140, blank=True)
    # Rich text field limited to 2 options.
    banner_text = RichTextField(blank=True, features=["bold", "italic"])
    banner_image = models.ForeignKey(
        "wagtailimages.Image",
        null=True,
        blank=True,
        on_delete=models.SET_NULL,
        related_name="+",
        help_text="Upload a banner image to this page"
    )

    panels = [
        FieldPanel("banner_title"),
        FieldPanel("banner_text"),
        ImageChooserPanel("banner_image"),
    ]
    search_fields = [
        index.SearchField("banner_title"),
        index.SearchField("banner_text"),
    ]

    class Meta:
        """Abstract Model."""

        abstract = True

custompage.py

# -*- coding: utf-8 -*-
"""Page's models."""

from wagtail.admin.edit_handlers import FieldPanel, MultiFieldPanel
from wagtail.core.models import Page

from .banner import Banner


class CustomPage(Page, Banner):
    """A bare page class."""

    template = "templates/custom_page.html"

    # Content panels
    content_panels = [
        FieldPanel("title", classname="full title"),
        MultiFieldPanel(Banner.panels, heading="Banner"),
        # ...Other panels, if you wish...
    ]

    class Meta:
        """Meta Information."""

        verbose_name = "Your Custom Page"
        verbose_name_plural = "Your Custom Pages"