Alert

The Alert macro allows you to create a pop-up message that is displayed when visitors first come to your page. With this, you can alert viewers about the content of the page or highlight important information. There are a number of standard options for quick and easy implementation, or you can create your own custom version with your choice of content, image, and layout. You can also choose to make the alert appear every time a user navigates to the page, or it can be permanently dismissed so they only have to view the message once. 


Instructions

  1. Navigate to the page you want to edit.

  2. Click the Edit icon.

  3. Click Insert > View More.

  4. Select the Alert macro in the Browse screen.

  5. Customize your alert using the following options. Changes your make will be shown in the dynamic preview of the editor.

    ParameterDescriptionRequired Notes
    Alert TypeThere are several standard options to choose from. The options are:
    • Work in Progress
    • Success
    • Error
    • Info
    • Sensitive
    • Warning 
    • Outdated
    • Custom
    (tick)You can customize any of the alert types to suit your needs.
    StyleThere are two options for the style

    Image Alert: (Default Option) An image is displayed above the title and content of the card. 

    Simple Alert: The alert content is shown without an image
    (tick)Most alert types have an image included. The only exception is the custom type. However, you can change the image on any of the alerts.
    TitleType in your desired heading or title for your alert(tick)The maximum character length is 50 characters
    BodyType the alert content or description(tick)

    The maximum character length is 255 characters

    Image

    Selecting this button will give you two options; Upload or Stock image. Once you have selected your image, use the left arrow to return to the main editor.

    a) Upload. This option allows you to add your own image. You can drag and drop an image file into the macro window or click Upload image to select an image file from your local file storage.

    Once you have selected your image, an image cropper displays to allow you to refine the size and section of the image. See Resizing images.

    b) Stock image. This option allows you to search for an image from our free image library. Simply select the image you want to see how it will look on your card. 

    (error)

    Accepted image formats: JPEG, PNG, GIF, ICO BMP, and WEBP 

    Maximum file size: 15 MB

    The fixed-ratio image size can have a maximum height or width of 300 pixels.


    Permanently DismissSelect if you want to add a button to allow users to permanently dismiss the alert(error)

    When this is active, users have two options. They can permanently dismiss the alert so it will not be seen on subsequent visits to the page, or it can just be closed.

    Color Palettes

    Changing the color palette will change the presented options for Background Color and Text Color.

    The options are:-
    Default - The options are a standard selection of colors that do not change. There are different options for the background and text colors.

    Recently used - The options offered will be the last seven colors you have used in any of our macros. 

    Local Space  - The options offered in this palette are specific to the space. The Space Admin can create and edit this palette. This may be used for your team's colors of choice.

    Organization - The options offered in this palette are the same in every space. Confluence Admins can create and edit this palette. This may be used for your organization's brand colors.

    (error)If you have not yet saved a macro, there will be no color options in the recently used palette.
    Background Color

    Choose the background color for the card.

    You can select from one of the options shown. If you don't see the color you want, select the Paint bucket button: to open a color picker and choose any color.

    (error)

    The appearance of the color picker will depend on which browser you are using.


    Text Color

    Choose the text color for the card.

    You can select from one of the options shown. If you don't see the color you want, select the Paint bucket button: to open a color picker and choose any color.

    (error)

    The appearance of the color picker will depend on which browser you are using.


  6. Click Save. A macro placeholder is displayed.

  7. Click Publish to see the Alert macro in action.

You can add more than one alert macro to a page. They will appear one after the other when a user views the page, however the order in which they appear will be random.

Resizing images

The image cropper lets you reposition and resize the selection area of your chosen image.

  • To reposition the image area, drag it to the desired position. You may need to scroll to display the desired area if your image is large.
  • To resize the image, click a corner and drag it until the area is the desired size. The fixed-ratio image size can have a maximum height or width of 300 pixels.

Change the Background Color 

The color scheme option lets you select any color you want for the background of your alert. You can use one of the preset options or use your browser color picker. You access this by clicking on the pencil icon. This will open the color picker nearby. The color of the text will automatically change to be a contrasting tone for readability.

Edit an Alert

To make changes to an alert after it is published, first display the page in Edit mode.

  1. Click the card, then click the Edit icon.
  2. Make your desired changes, then click Save. If you want to edit an alert image, you will need to upload it again.

Remove an Alert Macro

To remove an alert after it is published, first display the page in Edit mode.

  1. Click the alert, then click the Trash icon.

Examples

Image Alerts



Simple Alerts



Limitations

Due to Atlassian limitations, there are a couple of things that do not behave as you might expect:

  • Copy paste: copying and pasting Alert macros that contain image attachments results in the same image ID being assigned to all copies. 
  • Google Chrome Incognito mode: Alert image attachments do not render if Confluence is opened in a Chrome Incognito tab.

Video Walkthrough

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

On this page