Flex Alert Dynamic Banners
By using the code snippets below, your website can help inform Californians on how to prevent blackouts during hot weather and electrical emergencies.
Typically, when no Flex Alert has been called, the banners display an educational conservation message (green version), but when California is facing an electrical emergency, the banners will automatically switch out to an active Flex Alert message (orange version).
Warning!
- Do not copy and host the image file on your server. Use the preferred banner size code snippet, which allows the Flex Alert Campaign to dynamically swap the Education banner (green) for an Active Flex Alert banner (orange), whenever state officials call a Flex Alert.
- Do not wrap font tags or styles that affect the font size around this new image.
- The Flex Alert Campaign servers will host the dynamic banners. Once the image is displaying properly on your website, the webmaster does not need to update the banner during official Flex Alerts. This will happen dynamically.
Code Snippets
Copy and paste the code for each snippet you would like to display on your website. Examples provided below each code snippet for reference.
Icon (234px x 60px)
<script src="//s3.amazonaws.com/flexyourpower/banners/234x60.js" type="text/javascript"></script>
Examples
Flex Alert On | Flex Alert Off |
Icon (199px x 50px)
<script src="//s3.amazonaws.com/flexyourpower/banners/199x50.js" type="text/javascript"></script>
Examples
Flex Alert On | Flex Alert Off |
Icon (179px x 50px)
<script src="//s3.amazonaws.com/flexyourpower/banners/179x50.js" type="text/javascript"></script>
Examples
Flex Alert On | Flex Alert Off |
Icon (115px x 50px)
<script src="//s3.amazonaws.com/flexyourpower/banners/115x50.js" type="text/javascript"></script>
Examples
Flex Alert On | Flex Alert Off |
Icon (93px x 69px)
<script src="//s3.amazonaws.com/flexyourpower/banners/93x69.js" type="text/javascript"></script>
Examples
Flex Alert On | Flex Alert Off |
Tips (728px x 90px)
<script src="//s3.amazonaws.com/flexyourpower/banners/728x90.js" type="text/javascript"></script>
Examples
Flex Alert On: Summer |
Flex Alert Off: Summer |
Tips (300px x 250px)
<script src="//s3.amazonaws.com/flexyourpower/banners/300x250.js" type="text/javascript"></script>
Examples
Flex Alert On: Summer | Flex Alert Off: Summer |
Tips (160px x 600px)
<script src="//s3.amazonaws.com/flexyourpower/banners/160x600.js" type="text/javascript"></script>
Examples
Flex Alert On: Summer | Flex Alert Off: Summer |