Today
Loading…
Preview settings
Where the message card sits on the page.
Visitors who have reduced motion turned on see the message without the animation. To check it here, turn on reduced motion in your system settings.
The year ahead
The next twelve months from the date above. Click a day to see what plays.
Every delight
Sorted by the next time each one plays. "Needs a check" means a fact or link should be confirmed before it is turned on or left on.
Add it to the site
One tag in Google Tag Manager: a Custom HTML tag that fires on All Pages.
<script src="https://delight.labs.trlibrary.com/delight.js" async></script>
On a normal day the tag only loads a small file that checks the date. The animation's own file loads only on the day it plays. Delights never play on donate, checkout, ticketing, account or admin pages, or inside an embedded frame.
?delight=tr-birthday | Add to any trlibrary.com address to play one delight right away, on any day. |
?delight-date=2027-07-04 | Act as if it were that date. |
?delight=off | Turn delights off in this browser for the rest of the visit (?delight=on turns them back on). |
data-position | On the script tag: top (default), bottom-left or bottom-right. The card moves on its own to stay clear of anything pinned to the screen, like a ticket button or chat bubble. |
data-exclude | On the script tag: a pattern of page paths to skip, replacing the default list. |
| Analytics | Each delight pushes delight_view, delight_click and delight_close to the GTM data layer with delight_id. |