The UW Alert Banner is a means to provide important, and in some cases emergency, information to website visitors. Information comes from the UW Alert System. The Alert System is responsible for SMS, e-mail, phone and other push-style notification options.
When active, the banner displays a brief “alert” on any page where you’ve pasted the code (see the installation section below). The banner links to our emergency blog, which contains more details about the emergency or event that triggered the alert. The blog also has links and resources that could be useful during non-emergency situations.
Color description
The banner is designed to display three different colors, depending on the type of alert. Here are the general guidelines for when a certain color will be used. The content of the alert will always provide a much better sense of the actual emergency than the color will. Also, because events and emergencies are often in gray areas, similar alerts may be classified differently.
- RED – High level emergency or threat
- ORANGE – Medium emergency or threat
- STEEL – Ideal for info posted between alerts like campus weather closures.
Installation
The banner will only show up on the page where you have put the code. If you want the banner to show on every page, then you’ll want to have your header and footer in an include or delivered via a content management system. The script is very lightweight and only contains a few lines of JavaScript.
NOTE: If you copy and paste the script make sure to replace the smart quotes with straight quotes.
Above the </body> tag:
<script src="//www.washington.edu/static/alert.js" type="text/javascript"></script>
That’s it!
Testing
To verify the banner will not disrupt any elements on the page, the test code is available below. The banner will display a color of your choosing and a brief message.
Append a #uwalert-red, #uwalert-orange, or #uwalert-steel to your page’s URL.
Example: