Buttons
A row or column of styled buttons that link out to a website or across to another Confluence page.
Use it when a page needs an obvious next action, such as "Raise a request", "Open the runbook" or "Go to the dashboard", rather than a link tucked inside a sentence. You can put several buttons in one macro and they lay out as a row or a column with a gap you control, so it doubles as a small navigation strip at the top of a landing page. Each button is styled on its own: pick a preset colour variant, or set your own fill and label colours from your organisation's brand palette. A button can point at an external URL, at a Confluence page you pick from a search box, or at nothing at all when you just want the look.
#See it
Every example below is a real macro on this page, and each one is a configuration taken from a page somebody actually built. Open this page in the editor to see how any of them is set up.
#Seven custom colours in a row
#Four preset variants
#Pill-shaped buttons, centred
#Icon on the right
#Settings
Most settings belong to a single button, so each one in the macro can look and link differently. The last five rows apply to the whole group.
Setting | Values | What it changes |
|---|---|---|
Title | Free text | The button label. When "Icon only" is on, the label is hidden and shows as a tooltip when you hover instead. |
Type | URL, Page, None | Chooses the destination. URL uses the URL field; Page uses the Page picker; None gives you a button that looks the part but isn't clickable. |
URL | Any URL | Where the button goes. Only used when Type is URL. |
Page | A Confluence page chosen from a search picker | Which page the button opens. Only shown and used when Type is Page. |
Icon | A picture list including none, arrows (left/right/up/down), check, file, folder, home, info, minus, plus, search, times, globe, user, book, users, cloud, server, palette, sparkles, warning triangle, calendar, shield, swords, pen and more | Puts a small icon on the button, on the side set by "Icon position" (or the button's own override). |
Variant | Default, Success, Warning, Destructive, Outline, Secondary, Ghost, Link, Custom | The colour preset. Choosing Custom (or picking any Fill or Label colour) switches the button to your own colours instead of the preset. |
Size | S, M, L | Sets the button's height and text size. S, M and L are 32, 36 and 40 pixels tall. |
Corners | None, S, M, L, Pill | How rounded the corners are. Pill gives fully rounded ends, the look you often see on social links. |
Fill | A brand-palette colour or a custom hex (clearable) | Background colour for this button. Setting it switches Variant to Custom automatically. |
Label | A brand-palette colour or a custom hex (clearable) | Text colour for this button. Setting it also switches Variant to Custom. |
Full width | On / Off | Stretches this button to fill the row. |
Icon only | On / Off | Hides the label and shows a square button with just the icon. The title becomes the hover tooltip. |
Alignment | Left, Center, Right | Where the whole group of buttons sits across the page. |
Direction | Row, Column | Whether the buttons flow across the page or stack vertically. |
Gap | 0 to 48 (px slider) | Space between the buttons. |
Icon position | Left, Right | Which side the icon sits on, by default, for every button in this macro. |
Open links | New tab, Same tab | Applies to every button in this macro. Same tab opens the link in the tab you're in; New tab opens a new browser tab. |
#Related
The two most used macros here.
