This is the build source for the ca.gov/alerts web snippet.
To see what this alert will look like on your website, paste this code into your web browser console.
- Navigate to your website.
- Open the developer console (
F12key on Windows,Cmd + Option + Jon Mac). - Paste the code from below in the console line and press enter.
document.head.appendChild(document.createElement('script')).src='https://alert.cdt.ca.gov/sample/sample-alert.js';Once you have dismissed the message in your browser, it won't display again (by design). You can clear your dismissal in the console with...
localStorage.clear();To install the production service on your website, add the following HTML code to your <HTML><HEAD> section.
<html>
...
<head>
...
<script defer src="https://alert.cdt.ca.gov" crossorigin="anonymous"></script>
...
</head>
...If you don't have access to the <HTML><HEAD> section on your site, but you can still place <SCRIPT> tags in your content, you can create a Javascript section in the <BODY> like this.
<html>
...
<body>
...
<script>
document.head.appendChild(
Object.assign(document.createElement("script"), {
src: "https://alert.cdt.ca.gov",
defer: true,
crossOrigin: "anonymous"
})
);
</script>
...
</body>
...Once you have code properly installed, you can run this script in the Developer console on your site to verify installation.
alert(
`Alert installation ${
[...document.head.getElementsByTagName("script")].find(
x =>
x.src == "https://alert.cdt.ca.gov/" &&
x.defer == true &&
x.crossOrigin == "anonymous"
)
? "✅ Pass"
: "❌ Fail"
}`
);If you would like to write your own method to display the alert on your website, you can monitor the live JSON feed here...
https://alert.cdt.ca.gov/alerts.json
{
"$schema": "https://alert.cdt.ca.gov/alerts.schema.json",
"active": true,
"Heading": "EMERGENCY ALERT",
"CreatedAt": "2023-08-22T12:19:30.5629019-07:00",
"Message": "The Governor has declared a state of emergency in all California counties.",
"Url": "https://www.caloes.ca.gov/"
}activewill betruewhen an alert should be displayed.Urlwill benullwhen there is no "Get More Info" link.
Descriptions for the data fields can be optained in the schema file here...