Custom Wagtail Page Models: Fields, Panels, Routes

A typical situation: a client requests not just an "About Us" page, but a full service catalog with prices, tariffs, and filtering. Ready-made blocks don't fit — they need custom fields, admin tabs, and their own routing. The solution is custom Page Models. We've been using this approach in every Wagtail project for over 5 years and have accumulated more than 30 successful cases. For example, an online store required 7 different page types with unique fields and relationships — the entire development took 4 days, and editors got a clean interface with tabs. On average, a complex project needs 5–10 page types. Standard Wagtail fields (title, slug, body) don't cover the requirements: if you cram tariffs, specs, and reviews into a single RichTextField, the admin becomes a nightmare. On one project, editors spent 20 minutes editing a single page — after implementing custom models, time dropped to 2 minutes. A 90% reduction.

How custom Page Models simplify the editor's life?

Editors need an understandable admin interface. For that, we use TabbedInterface with ObjectList objects. The example below shows a ServicePage model with three tabs. Note the InlinePanel for related records and pricing_panels for displaying prices.

from django.db import models from wagtail.models import Page, Orderable from wagtail.fields import RichTextField, StreamField from wagtail.admin.panels import FieldPanel, InlinePanel, MultiFieldPanel, TabbedInterface, ObjectList from wagtail.search import index from modelcluster.fields import ParentalKey class ServicePage(Page): intro = models.CharField(max_length=500, blank=True) body = RichTextField(blank=True) icon = models.ForeignKey( 'wagtailimages.Image', null=True, blank=True, on_delete=models.SET_NULL, related_name='+', ) price_from = models.DecimalField(max_digits=10, decimal_places=0, null=True, blank=True) search_fields = Page.search_fields + [ index.SearchField('intro'), index.SearchField('body'), index.FilterField('price_from'), ] content_panels = Page.content_panels + [ FieldPanel('intro'), FieldPanel('icon'), FieldPanel('body'), InlinePanel('features', label='Features'), ] promote_panels = [ MultiFieldPanel([ FieldPanel('slug'), FieldPanel('seo_title'), FieldPanel('search_description'), ], heading='SEO'), ] pricing_panels = [ FieldPanel('price_from'), InlinePanel('pricing_tiers', label='Tariffs'), ] edit_handler = TabbedInterface([ ObjectList(content_panels, heading='Content'), ObjectList(pricing_panels, heading='Pricing'), ObjectList(promote_panels, heading='SEO'), ]) parent_page_types = ['services.ServicesIndexPage'] subpage_types = [] class Meta: verbose_name = 'Service Page' class ServiceFeature(Orderable): page = ParentalKey(ServicePage, on_delete=models.CASCADE, related_name='features') title = models.CharField(max_length=255) text = models.TextField(blank=True) icon = models.CharField(max_length=50, blank=True) panels = [ FieldPanel('title'), FieldPanel('text'), FieldPanel('icon'), ] 

Why RoutablePage is better than separate pages?

If you need a blog with categories and tags, you can create separate Page Models for each entity, or use RoutablePage. Compare: with 10 categories and 20 tags, separate pages would require 30 models. One BlogIndexPage with @path decorators replaces them all, cutting code in half and simplifying maintenance. According to Wagtail documentation, RoutablePage allows one page to handle multiple URL views.

from wagtail.contrib.routable_page.models import RoutablePage, path, re_path class BlogIndexPage(RoutablePage, Page): intro = RichTextField(blank=True) content_panels = Page.content_panels + [FieldPanel('intro')] subpage_types = ['blog.BlogPost'] @path('') def index_view(self, request): posts = BlogPost.objects.live().child_of(self).order_by('-first_published_at') from django.core.paginator import Paginator paginator = Paginator(posts, 12) return self.render(request, context_overrides={ 'posts': paginator.get_page(request.GET.get('page')), }) @path('category/<str:category_slug>/') def category_view(self, request, category_slug): category = get_object_or_404(BlogCategory, slug=category_slug) posts = BlogPost.objects.live().child_of(self).filter(categories=category) return self.render(request, context_overrides={ 'posts': posts, 'category': category, }, template='blog/blog_category.html') @path('tag/<str:tag>/') def tag_view(self, request, tag): posts = BlogPost.objects.live().child_of(self).filter(tags__slug=tag) return self.render(request, context_overrides={ 'posts': posts, 'tag': tag, }) @re_path(r'^archive/(\d{4})/$') def year_archive(self, request, year): posts = BlogPost.objects.live().child_of(self).filter(date__year=year) return self.render(request, context_overrides={ 'posts': posts, 'year': year, }) 

How to customize images?

For SEO and accessibility compliance, we extend the standard Image model, adding alt_text and credit fields. This allows editors to fill in mandatory alt text and specify the photo author.

# core/models.py from wagtail.images.models import AbstractImage, AbstractRendition, Image class CustomImage(AbstractImage): alt_text = models.CharField(max_length=255, blank=True) credit = models.CharField(max_length=255, blank=True) admin_form_fields = Image.admin_form_fields + [ 'alt_text', 'credit', ] @property def default_alt_text(self): return self.alt_text or self.title class CustomRendition(AbstractRendition): image = models.ForeignKey(CustomImage, on_delete=models.CASCADE, related_name='renditions') class Meta: unique_together = [('image', 'filter_spec', 'focal_point_key')] 

get_context — passing additional data

The get_context method allows enriching the template with data from other tables, GET parameters, or forms. It is called when rendering the page.

def get_context(self, request): context = super().get_context(request) context['related_posts'] = BlogPost.objects.live().exclude( pk=self.pk ).filter( categories__in=self.categories.all() ).distinct().order_by('-first_published_at')[:3] context['comment_form'] = CommentForm() context['current_tag'] = request.GET.get('tag') return context 

Comparison of approaches to building Page Models

In a real project for an online store with a catalog of 10,000 products, we developed 7 page types: CatalogPage, ProductPage, BrandPage, PromotionPage, ReviewPage, FAQPage, and ContactPage. For ProductPage we used StreamField with description blocks, spec tables, and image carousels. CatalogPage was built on RoutablePage with filtering by categories, price, and tags. Development took 4 days, editors trained in an hour. Time to publish a new product dropped 10x.

Process of working on custom Page Models

1. Analysis — we study the client's content structure, determine necessary fields and relationships.
2. Design — we draw an ER diagram of models, plan the editor interface (tabs, inline panels).
3. Implementation — we write Django models, configure edit_handler, search_fields, and RoutablePage.
4. Testing — we check revisions, drafts, publish workflow, performance.
5. Deployment — we release to production, configure search indexing.

What is included in the result

• Source code of custom Page Models with Russian documentation.
• Admin panel with tabs, field validation, and autocomplete.
• Configured indexing for site search.
• Support for revisions and Workflow for publication approval.
• Editor training (1 hour online) and written instructions.

Timeline and guarantees

Development of 5–7 Page Models with RoutablePage and InlinePanel takes 3–6 days. The cost is calculated individually based on complexity. We give a 6-month warranty on all models: any bugs are fixed for free. This approach saves up to 40% of budget compared to creating separate pages.

We'll assess your project in one day — just contact us. Our experience: more than 5 years working with Wagtail, more than 30 successful projects. Get a consultation — we'll tell you how custom Page Models can solve your task.