SP/49 Temp - 49th SWA Charity Gala Dinner 2026 (STAGING)

Status: Internal Review & Development Version Live Version: https://swa.org.sg/sp/49/ Event Date: 19 July 2026 Venue: Grand Copthorne Waterfront Hotel

Overview

This is the staging/development microsite for the 49th Singapore Women’s Association Charity Gala Dinner. Content and features are developed here for internal review and approval before being promoted to the live site.

Note: This temp version is for internal development and testing. Search engines are blocked from indexing this version. Once approved, the contents will replace the live /sp/49/ version.

Architecture

Content-Driven Design

All dynamic content is managed through Astro content collections in src/content/sp49/:

• sponsors.yaml - Sponsor tiers (Platinum, Gold, Silver, Bronze, Official, Door Gifts)
• schedule.md - Programme timeline
• messages.yaml - Welcome messages (GOH, President, Chairperson)
• committee.yaml - Organising and working committees
• contestants.yaml - MSPI 2026 contestants
• judges.yaml - Chief judge and judging panels
• acknowledgements.yaml - Special acknowledgements and friends
• gtw-prizes.yaml - Guess The Winner contest prizes

Components (src/components/sp/49/)

1. SPHome.astro - Hero section with event details
2. SPSchedule.astro - Programme timeline
3. SPMessages.astro - Welcome messages
4. SPAboutSWA.astro - Organisation information
5. SPDonation.astro - Donation options (Giving.sg + WhatsApp)
6. SPSponsors.astro - All sponsor tiers
7. SPPageant.astro - MSPI 2026 feature
8. SPContestants.astro - Contestant profiles
9. SPContest.astro - GTW contest information
10. SPJudges.astro - Judge panels
11. SPCommittee.astro - Organising committee
12. SPThanks.astro - Acknowledgements

Shared Components (src/components/sp/shared/)

• SPLayout.astro - Base layout (theme-configurable)
• SPHeader.astro - Navigation header (edition-aware)
• SPFooter.astro - Footer
• SPSection.astro - Reusable section wrapper
• SPSponsorCard.astro - Sponsor display card
• SPGa4Tracker.astro - Simplified GA4 tracking

Styling (src/styles/sp49.css)

Light theme with clean white/grey background:

• Section structure classes (.sp49-section, .sp49-section-alt, .sp49-section-accent)
• Typography system (.sp49-title, .sp49-subtitle, .sp49-body)
• Card components (.sp49-card, .sp49-card-sponsor, .sp49-card-person)
• Grid layouts (.sp49-grid-sponsors, .sp49-grid-contestants, .sp49-grid-committee)
• Timeline components (.sp49-timeline-item, .sp49-timeline-time)

Updating Content

Update Sponsors

1. Edit src/content/sp49/sponsors.yaml
2. Add sponsor details (name, logo path, website, description)
3. Images should be placed in src/images/sp/49/sponsors/
4. Run npm run convert:webp src/images/sp/49/sponsors/ to optimise images

Update Schedule

1. Edit src/content/sp49/schedule.md
2. Add/modify schedule items with time, timeOrder, title, subtitle, description
3. Use 24-hour format for timeOrder (e.g., 1800 for 6.00pm)

Update Other Content

Follow the same pattern for:

• messages.yaml - Welcome messages
• committee.yaml - Committee members
• contestants.yaml - Contestant profiles
• judges.yaml - Judge panels
• acknowledgements.yaml - Special thanks
• gtw-prizes.yaml - Contest prizes

GA4 Tracking

SP/49 uses simplified tracking with 4 essential events:

1. page_view - Automatic GA4 tracking
2. sp49_cta_click - CTA button clicks (donation, navigation)
3. sp49_sponsor_click - Sponsor website clicks
4. sp49_donation_click - Donation button clicks

Tracking Implementation

Add data attributes to elements:

<a
  href="..."
  data-sp-track="sp49_donation_click"
  data-sp-cta-type="giving_sg"
>
  Donate Now
</a>

SEO

Metadata

• Title: “49th SWA Charity Gala Dinner 2026 | Singapore Women’s Association”
• Description: Event details with date, venue, and MSPI feature
• OG Image: /images/sp/49/og-image.jpg

Structured Data

JSON-LD schema for Event included in index page with:

• Event name and dates
• Venue details
• Organiser information
• Event description

British English Standards

All content uses British English spelling and formatting:

• organisation (not organization)
• programme (not program)
• honour (not honor)
• Date format: 19 July 2026 (not July 19, 2026)
• Time format: 6.00pm (not 6:00 PM)

Development Commands

# Development server
npm run dev

# Build for production
npm run build

# Preview production build
npm run preview

# Convert images to WebP
npm run convert:webp src/images/sp/49/

# Check British English
# Use british-english-proofreader agent

File Structure

src/
├── components/sp/
│   ├── 49/                    # SP/49 components
│   └── shared/                # Shared SP components
├── content/sp49/              # Content collections
├── images/sp/49/              # SP/49 images
│   ├── sponsors/
│   ├── contestants/
│   ├── committee/
│   └── messages/
├── pages/sp/49/               # SP/49 pages
└── styles/sp49.css            # SP/49 theme

Notes for Future Editions (SP/50, SP/51, etc.)

This SP/49 microsite serves as a template for future editions:

1. Copy folder structure: Duplicate sp/49/ to sp/50/
2. Update content collections: Copy sp49/ to sp50/ in content.config.ts
3. Update CSS theme: Copy sp49.css to sp50.css and adjust colours
4. Update components: Update references from ‘49’ to ‘50’
5. Update SEO metadata: Change dates, titles, descriptions

Contact

For updates or questions about this microsite, contact the SWA Operations Manager.