Every Bloqs component in this boilerplate, demonstrated with example content using the macro call pattern.
Jump to a specific component to see how it's used in the template.
Section headers provide a consistent heading block with optional eyebrow text above the title and a descriptive paragraph below. Text alignment and max-width are configurable.
Write Nunjucks templates for static HTML preview. The same files power the EE deployment — no double maintenance. Component atoms map directly to Bloqs fields, so what you see in the static preview is exactly what editors see in the CP.
Cards support icons, subtitles, body text, and optional link buttons. Styles include shadow, bordered, and flat variants.
Cards can be linked — wrapping the whole card in an anchor tag — or show a discrete link button in the card footer.
Icon background shape, color, and icon color are all configurable per card via Bloqs atom selectors in the CP.
Card Blank is a styled container that accepts any Bloqs block as a child — section headers, buttons, icon titles, or custom HTML snippets.
Nesting a button group inside a card blank gives you a CTA card pattern without needing a dedicated block type.
Multi-Column wraps Column blocks in a responsive CSS grid. Each column can hold any block — text, media, buttons, cards, or other nested components.
Grid type, column count, spacing, padding, alignment, and carousel mode are all configurable. Reverse column order on mobile is a single toggle.
Displays an icon alongside a heading, with an optional description paragraph below. Useful for feature introductions, step headings, or category labels.
Bloqs is an ExpressionEngine add-on that lets content editors compose page layouts from reusable block components, each with its own atom fields — similar to Gutenberg or a headless CMS block editor.
Page NJK templates are parsed by build-seeds.js to extract block data into JSON seed files. The deploy_tools:seed CLI command reads those files and creates EE entries with Bloqs blocks and atoms pre-populated.
The macro call pattern lets build-seeds.js recognize parent-with-children blocks via Pass C. The call body is recursively parsed, and child blocks are attached as _children in the seed JSON — enabling the SeedRunner to create correctly nested Bloqs hierarchies in EE.
Basic Content renders the full output of EE's Rich Text Editor. Use it for editorial copy, blog-style prose, or any content that benefits from full typographic control — headings, lists, blockquotes, inline links, and images.
A generic padded container with configurable border radius, padding, and background color. Nest any content block inside it to create callout boxes, highlighted sections, or framed content areas.
A flex column container that applies consistent vertical gap between child blocks. Mobile and desktop spacing values are independently configurable. Horizontal alignment of child items is also configurable. Used as the primary spacing wrapper inside every Section.
The outermost wrapper for page content. Configurable background color, container width, top/bottom padding removal, and an optional section_id for anchor links. All page content lives inside Section blocks.