Archive Notice Banner

About

The archive notice banner identifies web pages as "archived" to meet ADA Title II compliance. Under this rule, inaccessible content created before April 26, 2027, may be exempt if it meets specific criteria and provides a clear way for visitors to request an accessible version. For details on assessing if your content qualifies, see the Archived or legacy digital content section of UW–Madison’s ADA guidelines.

This banner:

Informs visitors that the page is archived content
Notifies visitors that the page may not meet accessibility guidelines
Provides a contact link for visitors to request an accessible version

Demo

How To Use

Three options are available:

Web Component (drop-in) — a single <script> tag plus the <uw-archive-notice> custom element.
Plain HTML — a static HTML snippet for environments where JavaScript or custom elements cannot be used.
WordPress plugin — includes a site-wide settings page, per-post option, shortcode, PHP template tag, and block.

Note: The banner renders at a high z-index to ensure it appears above other positioned elements on the page. Because it is injected dynamically, fixed or sticky elements (such as headers or navigation bars) cannot automatically adjust for its height. The banner includes a dismiss button so users can close it if it overlaps page content. A cookie remembers this action for 1 day.

Web Component (Drop-In)

Add the following code snippet to your webpage. Place it in the <head> or before the closing </body> tag. Both the email and archive-date attributes are required — the notice will not render without them.

<script src="https://cdn.wisc.cloud/archive-notice/uw-archive-notice.min.js"></script>
<uw-archive-notice
  email="yourteam@wisc.edu"
  archive-date="February 19, 2026"
  scope="website"
></uw-archive-notice>

Attributes

email (required) — The contact email address.
archive-date (required) — The date the page was archived (e.g. "February 19, 2026").
scope (optional) — Set to "website" or "webpage". Controls the banner message text and the dismiss cookie scope. When set to "website", the message reads "This website is archived…" and dismissing the notice sets a cookie that applies across the entire domain. When set to "webpage" (default), the message reads "This webpage is archived…" and the dismiss cookie only applies to the current page.

Versioned

To pin a specific version, use a versioned URL:

<script src="https://cdn.wisc.cloud/archive-notice/1.0.0/uw-archive-notice.min.js"></script>
<uw-archive-notice
  email="yourteam@wisc.edu"
  archive-date="February 19, 2026"
  scope="website"
></uw-archive-notice>

Plain HTML

If you cannot use the Web Component, copy and paste the following HTML into your page and edit the archive date and contact email as needed:

<div class="uw-archive-notice" role="alert"
  style="background-color:#e1e5e7;color:#000;font-family:'Red Hat Text',sans-serif;font-size:16px;line-height:1.5;width:100%">
  <div style="max-width:1200px;margin:0 auto;padding:16px;display:flex;align-items:flex-start;gap:12px">
    <span style="flex-shrink:0;width:24px;height:24px;margin-top:2px">
      <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
        <path d="M12 24C8.8174 24 5.76516 22.7357 3.51472 20.4853C1.26428 18.2348 0 15.1826 0 12C0 8.8174 1.26428 5.76516 3.51472 3.51472C5.76516 1.26428 8.8174 0 12 0C15.1826 0 18.2348 1.26428 20.4853 3.51472C22.7357 5.76516 24 8.8174 24 12C24 15.1826 22.7357 18.2348 20.4853 20.4853C18.2348 22.7357 15.1826 24 12 24ZM10.6875 15.1875V17.8125H13.3125V15.1875H10.6875ZM10.5 6L11.1 13.5H12.9L13.5 6H10.5Z" fill="#B70101"/>
      </svg>
    </span>
    <div>
      <h2 style="font-weight:700;font-size:16px;margin:0 0 4px 0;color:#000">This web page is archived and no longer updated</h2>
      <p style="margin:0;color:#000">
        It was archived on <span class="uw-archive-date">February 19, 2026</span> and it may not be accessible.
        To request an accessible version or a reasonable accommodation due to disability, please email
        <a href="mailto:web.strategiccommunication@wisc.edu" style="color:#000;text-decoration:underline">web.strategiccommunication@wisc.edu</a>.
      </p>
    </div>
  </div>
</div>

Available versions:

1.0.0, 1.0.1, 1.0.2

WordPress Plugin

A WordPress plugin version is available for sites running WordPress. It exposes the banner via a settings page (site-wide or per-post), a block, a shortcode, and a PHP template tag. All surfaces render the same <uw-archive-notice> web component.

Download

Download the latest plugin zip

Install

In wp-admin, go to Plugins → Add New → Upload Plugin.
Upload the zip, then click Install Now and Activate.
Configure in Settings → Archive Notice.

Usage

Site-wide or per-post — configure in Settings → Archive Notice.
Shortcode — [uw_archive_notice email="team@wisc.edu" date="February 19, 2026"]
Block — insert the "Archive Notice" block in the block editor.
PHP template tag — <?php uw_madison_archive_banner( [ 'email' => 'team@wisc.edu', 'archive_date' => 'February 19, 2026', 'scope' => 'website' ] ); ?>

Available plugin versions:

1.0.2

Accessibility

The banner uses role="alert" so screen readers are notified of the archive status immediately upon page load. The email link is keyboard accessible with a visible focus indicator. When the dismiss button is activated, focus is moved to the next meaningful element on the page.

Help

Contact the Office of Strategic Communication web team for help.