Alert Center Properties

Prev Next

This article will show you how to configure the Properties within the Alert Center module.

Important Note:

  • Properties fields for Alert Bar styling support any valid hexadecimal values, but WCAG 2.0 level AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text. To ensure compliance, check the font against background color values.

  • A maximum of two alerts will show in the Alert Bar at once.

Who can use this feature?

System Administrator | Owner

Instructions

  1. Sign in to your site

  2. Click Modules The drop down labeled Modules.

  3. Click Content The left hand navigation tab labeled Content.

  4. Click Alert Center The URL labeled Alert Center.

  5. Select the Properties tabThe tab labeled Properties, to the left of the tab labeled Main.

  6. Edit the fields as needed The properties text entry fields.

    Note: Make sure you check color contrast before saving changes to the background or font colors.

    • Alert Bar Main Background: The background color of the main Alert Bar area in HEX color code. The default is dark grey #222222.

    • Alert Bar Text Color: The text color of the Alert titles in the Alert Bar is in hex color code. The default is white #FFFFFF.

    • Alert Bar Font Size: The text size in pixels of Alert item titles in the Alert Bar. This property scales all other Alert item text based on the ratio of increase or decrease. The default is 12.

    • Alert Bar Read More Color: Color of "Read More" link text on Alert Bar in hex color code. The default is red #030303.

    • Alert Bar Icon: The relative link to the Alert Bar icon. The default flashing alert icon is /Common/Images/AlertCenter/alertBarBlink.SVG.

    • Left Alert Bar Item Border: The color of the left border lines of the Alert Item area. The default is grey #635e65.

    • Right Alert Bar Item Border: The color of the right border lines of the Alert Item area. The default is black #000000.

    • Social Media Open Graph Image: the image shared on Facebook from the Alert Center module level. Use any full or relative image links. Images should meet the minimum size constraint of 600px by 600px. Pre-cache your images by running the URL through the URL Sharing Debugger tool to pre-fetch metadata for the website. You should also do this if you update the image for a piece of content. The debug tool also refreshes any scraped content for your websites, so it can be useful if you need to update them more often than the standard 24-hour update period.

  7. Select Save Changes Save changes button.