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. 


Walkthrough

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

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

    Drag and drop an image file into the macro window or click Upload 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.

    (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 Scheme

    Choose the background color for the text box. If you don't select any the background will default to white.


    You can choose one of the preselected colors, or you can select the Pencil, to open a color picker and choose any color you want.

    (error)

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

    The text will automatically change to a contrasting color to maintain clarity.

  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.