The Adaptavist Group LogoDocumentation

Dialog

The Dialog macro allows you to create Atlassian user Interface styled dialogs that are triggered using a button. The dialog macro is used in combination with the Button Hyperlink macro and the Span macro. Using this combination of macros you create a popup box with options that can lead to different locations. You can customise the look of the dialog using our CSS Style Sheet macro.

Add a Dialog to your Page

  1. Navigate to the page you want to edit.
  2. Click Edit.
  3. Click Insert More Content → Other Macros .
  4. Select the Dialog macro from the Macro Browser.
  5. Complete the required parameters.
    ParameterDescriptionTypeDefaultRequired
    TitleSpecifies the title of the displayed dialogstringnone
    SizeSpecifies the size of the dialogenummedium
    IDSpecifies the HTML ID applied to the dialog that is used in the trigger link.stringnone
    CSS Class Option to apply a custom CSS class to the element. Enter the CSS class name(s) to apply to the macro (case sensitive); multiple classes can be separated by a space or comma. Do not include the . selector in the class name. Classes must be part of your Global Confluence CSS or defined in a CSS Stylesheet macro that you have added to your page. stringnone
  6. Specify an ID to use with the dialog trigger. eg. Location_Dialog
  7. Click Insert.
    The macro placeholder displays.
  8. Add a Span macro to hold any text you wish to display in the dialog box.
  9. Add a Button Group with Button Hyperlink Macros for the options inside the dialog box.
  10. Outside of the dialog box insert one more Button Hyperlink Macro. This is the button that when pressed will open the dialog box. Set the Destination to the ID you gave the dialog macro, after adding a '#' before it. eg, #Location_dialog.
  11. Save the page.
    The macro will not display properly in preview mode. Once you publish the page you will be able to test that it is working correctly.
  12. Once the page is published, click the button to display the dialog.

Search documentation

Start typing to search the docs.