A single-page Eleventy template for announcing or celebrating any special occasion with curated text, photos, video, audio, and music.

You can find the demo here. https://project-joy.pages.dev/

• Hero, story, gallery, video, audio, and playlist sections driven by editable Eleventy data files, i.e. json, yaml, etc.
• Responsive single-page layout with lazy-loaded media and custom audio controls.
• Works with local or external assets, plus configurable MIME hints for Safari-friendly audio playback.
• Built-in dev server and production build scripts for quick previews and static deployment.

• Node 18 or newer
• npm installed locally

1. Install dependencies with npm install.
2. Run npm run dev for a live preview at http://localhost:8080/ .
3. Run npm run build to generate the static build in dist/.

• Update src/_data/celebration.yml with the event name, date, copy, and media references.
• Fine-tune section headings or remove optional sections by editing the same data file.
• Provide a video.youtube_id, video.file, or video.google_drive_id depending on what you want to embed.

• Add images to src/assets/images/ or link to external http/https URLs.
• Populate src/_data/gallery.yml with items that include src, alt, and a span value to control layout.

• Place an audio file (for example celebration-message.m4a) in src/assets/audio/ or point to an external URL.
• Set audio.type in celebration.yml to the file's MIME type (defaults to audio/mp4) so browsers like Safari get the right hint; update it if you swap in formats such as audio/mpeg or audio/webm.
• Remove or comment out the audio block in celebration.yml if you do not need an audio section.

• When music.playlist_id is present the page loads the matching YouTube playlist. Replace the sample id or delete the block to hide the widget.

• The generated dist/ directory is ready for static hosting (Netlify, Vercel, GitHub Pages, etc.).
• Swap in your own media assets before sharing the link publicly.