Hide header and footer on macro editor

Hi, we need to customize the macro editor with a custom dialog UI.
I’ve found no way to hide the standard header/footer on macro editor.

For standard dialogs there is the “chrome” option, but this feature is missing on the editor description.

Is there a way to hide header and footer?

Hi @adapps,

I don’t think this is possible. Can you explain why you need to remove the header and footer.

Regads,
Dugald

Hi @dmorrow

I’d like to replicate the behavior of the Editor Help Panel (/help macro).

I need an information panel, without buttons. I don’t have to enter custom content on page, just display some data in edit mode.

1 Like

Hi @adapps,

The macro editor dialog is opened after a user clicks on a macro when in preview mode (in a page being edited) and clicks the pencil icon. The purpose of the editor is to allow the user to specify a configuration and/or content to be displayed by the macro. It seems your use case is a bit different to this pattern. Technically you can launch a chromeless dialog from the editor dialog, but launching dialogs from dialogs is not recommended.

Regards,
Dugald

1 Like

our main purpose is to show some data to the user, exactly as the macro help does.
In short:

  • the user types /our-macro
  • Confluence opens directly a popup (like the help macro)
  • the user interacts with the popup by consulting its data
  • the user closes the popup without adding data to the page

This pattern could also be activated through a classic webitem. The problem is that Confluence Cloud has no extension points within the editor. Only macros can be used.

Hi @adapps,

I think I understand what you’re trying to do. Your pattern is a little different to macros because macros contribute content to the page, however, you could try using the {output.type} parameter to discriminate your macro’s behaviour. When the {output.type} is display then don’t render anything, but when the {output.type} is preview, open a chromeless dialog using AP.dialog.create. I’m not confident the solution will feel right, but you may like to give it a go.

Regards,
Dugald

1 Like

Ok I’ll give it a try.
Thanks for your support!

This has been a recurring problem in our apps. Not only does it make the UI look inconsistent with our other dialogs, it also makes our code inconsistent because of the largely different way how we have to handle the buttons in the dialog footer, and it is really painful to work with AtlasKit components that are not adapted to small viewport sizes (such as dropdowns and inline dialogs) when the size of the iframe is restricted to the dialog body.

While experimenting around, I have found a workaround for this problem, which I want to share here for anyone else who comes across it.

When setting "height": "100%" and "width": "100%" in the macro editor settings in the connect app descriptor, the dialog is suddenly opened as a fullscreen dialog without chrome (header and footer). I am pretty sure that this is not documented and that it also didn’t behave like this before. By making the background of the iframe body transparent, we can then use the AtlasKit Dialog component to render our own dialog, with full control of the dialog header and footer.

3 Likes