Button

The Button macro allows you to create stylized buttons which provide hyperlinks to other pages or websites. These can be added individually anywhere on a page or grouped as a horizontal row of button links using the Button Group macro.

Although hyperlinks can be created through the standard Confluence interface, buttons provide stronger visual integration with the application as a whole and can be used to create pages that feel like part of Confluence itself.

Walkthrough

Watch our video walkthrough to see the Button macro in action.



Instructions

  1. Navigate to the page and you want to edit.

  2. Click the Edit icon.

  3. Click Insert > View More in the Confluence editor and then select the Button macro in the Select Macro screen. (Alternatively, use / and begin to type button to access the macro via the quick insert menu.)

  4. The Insert Button Macro screen appears. Customize it according to your needs:

    1. Button Text: The text that is displayed on the button.

    2. Destination: The page (URL or file) that the user is directed to when they click the button. This field auto-completes for pages within the Confluence site, but can also take a full URL. file link such as `file:///c:/read_me.txt`, or anchor IDs.

      For security reasons, some browsers may block URL paths that point to files on a local file system or local networked folders. This can be overridden in your browser’s security settings but should only be done as part of a comprehensive security strategy. In most cases, it is best to host such files on dedicated web servers that use other protocols such as FTP. More information can be found in Atlassian’s documentation.

    3. Open in New Tab: Select if you want the button to open the URL in a new tab.

    4. Alignment: Select the alignment option for your button. the options are Left, Centre, or Right.

      If the button is inside a Button Group, it follows the alignment of the Button Group.

    5. Button Type: Select the type of button to be displayed: Standard, Primary, or Subtle. The effect on these buttons differs depending on if they are on their own or a part of a Button Group.

      1. If you select the standard button type, you can choose a color for the button's background. The default color is white. Click on the pencil to open your browser's color picker. The text in the button will automatically change to a contrasting color for clarity.
    6. Icon: Select an icon option from a list of preset options or leave it set to None.

  5. Click Save. A macro placeholder is displayed on the page.

  6. Click Publish to view the rendered button on the page.

  7. Click a button to test the link destination and behavior, e.g. if it opens in a new tab.

Edit the macro

To make changes to the macro parameters, click the macro placeholder then click the Edit icon. Make the required changes, then click Save.

Button Styles

  • Standard: 

  • Primary:

  • Subtle: 

Link a Button To A Specific Place On A Page 

You can combine the button macro with confluence's anchor macro to link to a specific point on a page. 

Link to a location on the same page

  1. Add an anchor macro to the page.
  2. Give the anchor macro a name eg. notes.
  3. Use the name of the anchor macro as the Destination for the button macro. Do this by putting #name. eg #notes.

Link to a location on a different page

  1. Add an anchor macro to the page.
  2. Give the anchor macro a name eg. notes.
  3. In the Destination field of the button macro, select the page with your anchor macro. Then add the name of the anchor to the end of the URL.
    eg.  sitename.domain/wiki/Project+seven#notes