Blocks

Reusable content across pages

Blocks are standalone content components that exist outside of any specific page. They're designed for content that appears in multiple places across your site.

Common uses for blocks:

• Header/Navigation — site logo, menu items, CTA button
• Footer — contact info, social links, legal links
• Announcement bar — promotions, alerts, notifications
• Sidebar widgets — newsletter signup, popular posts, social feeds

Unlike sections (which are tied to pages), blocks are global — they're managed independently and accessed through the API by their key.

Define and populate blocks

Blocks are tied to Content Types, which define their structure (similar to how sections have structures).

To create a block:

• Go to Blocks in the sidebar
• Create or select a Content Type that defines the block's fields
• Add content to the block for each language
• Publish the block to make it available via the API

Each block has its own revision history, so changes are tracked and can be rolled back just like page content.

Translations per language

Blocks support full multilingual content. Each block has separate content entries per language, so your header, footer, and other global components can be properly translated.

When your frontend requests a block through the API, it receives the content for the requested language. If a translation doesn't exist, you can configure fallback behavior in your frontend application.

Fetch blocks via the API

Blocks are retrieved through the GraphQL API using dedicated queries:

• Single block — fetch a specific block by its key or ID
• Block list — retrieve all blocks or filter by content type

In a typical Next.js setup, blocks are fetched at the layout level (not per page), since they appear on every page. This means the header and footer are loaded once and shared across all routes.

Blocks are cached and optimized for performance, so they don't add significant overhead to your page loads.