Pager
Previous and next links for a sequential document.
Try it
Two neighbours
Documentation article navigation.
Use it
Working invocation
This code creates the configuration shown above. Copy the template and the required Python context together.
{% include "brickwork/components/_pager.html" with previous_href="/docs/install/" previous_label=previous_label next_href="/docs/theme/" next_label=next_label aria_label=aria_label %}context = {'previous_label': 'Install', 'next_label': 'Theme', 'aria_label': 'Getting started'}Guide
Add it to your project
- Calculate neighbouring URLs in the view.
- Include only when at least one neighbour exists.
Options
Public API
| Option | Type | Default | Required | Description |
|---|---|---|---|---|
| previous_href | string | Not set | No | Predecessor URL. Constraint: No additional package-level validation is documented beyond this option's stated type and its role in the component. |
| previous_label | string | Not set | No | Predecessor title. Constraint: No additional package-level validation is documented beyond this option's stated type and its role in the component. |
| next_href | string | Not set | No | Successor URL. Constraint: No additional package-level validation is documented beyond this option's stated type and its role in the component. |
| next_label | string | Not set | No | Successor title. Constraint: No additional package-level validation is documented beyond this option's stated type and its role in the component. |
| aria_label | string | More in this series | No | Landmark name. Constraint: Use a concise non-empty accessible name whenever the visible label does not name the control. |
Behaviour
Accessibility and responsive behaviour
- Accessibility
- Real links have visible direction text, decorative RTL-aware icons and `rel=prev/next`.
- Responsive
- Wraps by available inline space.
- Without JavaScript
- Normal anchor navigation.
Need help?
Troubleshooting
Contract check: renders an empty <nav> (an aria-label with no links inside it), so a
Do not render a pager with neither adjacent URL unless an empty navigation landmark is intentional; provide at least one available direction.
Explore next