Introducing wagtail-extended-blocks
While building and maintaining various Wagtail sites, I developed a collection of custom StreamField blocks to extend Wagtail's default options. wagtail-extended-blocks packages these 33 reusable blocks into a single library that you can install and use too.
Blocks are organized into three categories:
Base and Utility Blocks (8 blocks): Link and button handlers supporting internal pages, relative or absolute URLs, anchors, and mailto links, along with configurable vertical section breaks, layout clearfixes, and raw code or HTML injection blocks.
Content Blocks (13 blocks): Structure components such as accordions, two-column text fields, flex grids, case study blocks, customizable callout rows, and styled quote layouts.
Media Blocks (12 blocks): Display components including multi-image grids, profile and team layout cards, video promo tiles, file download buttons, image galleries, and related content grids.
All included blocks ship with default front-end HTML templates that can be individually overridden with your own templates.
EDIT: This package is now available on PyPI!
The project repository and source code are on my git server: wagtail-extended-blocks.
Base/Utility Blocks
RelativeOrAbsoluteURLBlock: A text field validating external URLs, relative links (/about), anchors (#contact), or mailto links.ButtonBlock: A custom link button.ButtonChooserBlock: A link button allowing selection of EITHER an internal page OR a custom URL.InternalButtonBlock: A button linking only to internal pages.SectionBreakBlock: Inserts adjustable vertical spacing.ClearfixBlock: Clear floated layouts.CustomCodeBlock: Inserts custom styles or scripts.CustomHtmlBlock: Paste raw HTML safely.
Content Blocks
QuoteBlock: Standard blockquote text with author attribution.QuoteImageBlock: A layout combining an image and rich text quote.FootnoteBlock: Styled text specifically for footnotes.TwoColumnTextBlock: Side-by-side rich text columns.FlexGridBlock: A flexible grid of rich text blocks.CaseStudyBlock: Title, body text, image, and CTA link.CalloutBlock: Small styled callout row.CalloutRowMediumBlock: Callout row featuring a CTA button.CalloutRowBlock: Callout with left image, right text, and CTA button.CalloutRowLightBlock: Full-width callout row, light style, with button.CalltoactionBlock: Banner CTA block with customizable classes.MetacontentBlock: Rich text blocks intended for the footer or end of articles.AccordionBlock: Collapsible accordion items list.
Media Blocks
ImageLinkedBlock: Renders an image linking to external or relative URLs.ImageTextBlock: Image aligned side-by-side with rich text.ImageAlignedBlock: Aligns an image left, right, center, or full width.ImageGridBlock: Layout gallery for multiple images at a set width.ProfileBlock: Biography box containing name, title description, photo, and bio text.ProfileGridBlock: A grid layout displaying multiple user profiles.ImageGalleryBlock: List of gallery items with captions.VideoPromoTileBlock: Video card with thumbnail aspect ratio, title description, and internal page link.NextPreviousBlock: Pagination buttons for navigating between pages.DownloadBlock: File download link button.RelatedContentBlock: Grid tiles linking to other articles or external sites.ProgramBlock: Icon or logo block with details.
I hope these are useful, they've come in handy for me. If you have issues, suggestions, or questions let me know!
