Nav Link¶
A Nav Link is a single link. It can point at a page of the portal, at an outside web address, or at an anchor on the current page. Use it for one hand-placed link, such as Back to overview under a details panel, or a Help link in a footer.
See also Nav List, Breadcrumb and Button.
Using it¶
Drop a Nav Link onto the page and set Target to where it should go, for example /sales. When the target is a portal route, the link shows that page's name as its label, so you do not need to type one. Set Label override if you want different text. Pick an Icon to show one before the label.
Examples¶
A route built from a page parameter
Target /reports/{reportId}/overview, with the reportId field left at {$params.reportId}.
Options¶
| Option | Values | Default | Description |
|---|---|---|---|
| Target | A route, web address or anchor | Empty | Where the link goes: /sales, https://example.com, #section or /reports/{reportId}/overview. Each {name} in it is a placeholder with its own field under Page parameters. Until it is set, the canvas shows Pick a target |
| Page parameters | An expression per placeholder | {$params.name} |
One field for each {name} placeholder in the target, added by picking a page or typed. Fields for the target page's required parameters are marked with *. An empty field passes no value |
| Label override | Any text | Page name | The link text. By default a link to a portal route shows that page's name |
| Open in | New tab, Same tab, Parent frame, Top frame | Same tab | Where the linked page opens |
| Icon | An icon key | None | An icon shown before the label. The brush button beside it styles the icon |
| Match | Ignore query, Exact match, Subroute, Prefix | Ignore query | How the current address is compared with the target to decide whether the link is highlighted as active. See Good to know |
| Variant | Theme variants | Default | Picks the link's look from the theme. There are no built-in variants, so the list shows the ones your theme defines. See Variants |
| Custom Style | CSS | Empty | Extra styling for this link only |
| Box Style | Sizing and spacing | None | The box around the link |
Tips¶
- Picking another page replaces the target with that page's route and a placeholder for each of its parameters. Picking the current page keeps the target. A target typed with its own query is kept as entered.
- A query item that is a single placeholder, such as
id={id}, is passed the same way as a Button's Navigate to page action. Other placeholders, such as one in the path, are encoded in place. Either way, text such asR&D #1reaches the page intact. - A placeholder with no value is left out when it is a query item, so the parameter keeps its default. Anywhere else it is replaced with nothing.
- A placeholder that is itself an expression, such as
{$record.id}, gets a field that starts with that expression. - Removing a placeholder from the target removes its field.
- A link to a portal route takes its label from the page, so the label stays right when the page is renamed.
- Match decides when the link is highlighted as the current page. Ignore query treats
/sales?year=2025as the same page as/sales. Exact match needs the full address to match. Prefix and Subroute keep the link highlighted on its child pages too.