Skip to main content
This guide walks you through the minimum steps to deploy a working wedding invitation with RSVP collection. For deeper configuration, see the Setup and Customization sections.
1

Get the code

Fork or download the repository from GitHub:
git clone https://github.com/letsparty20251025/letsparty20251025.github.io.git
cd letsparty20251025.github.io
Or click Fork on GitHub to create your own copy under your account.
2

Create your Google Sheet and deploy the Apps Script

  1. Go to sheets.google.com and create a new spreadsheet.
  2. Rename the first sheet tab to RSVP_responses.
  3. Copy the Sheet ID from the URL — it’s the long string between /d/ and /edit: 
    https://docs.google.com/spreadsheets/d/YOUR_SHEET_ID_HERE/edit
  4. In your spreadsheet, open Extensions → Apps Script.
  5. Replace all existing code with the contents of google-apps-script.js from this repo.
  6. Find the SHEET_ID variable near the top of the script and replace the placeholder with your Sheet ID:
    google-apps-script.js
    var SHEET_ID = "YOUR_SHEET_ID_HERE";
  7. Find the sendEmail() function and update the johnnyEmail variable with your own address:
    google-apps-script.js
    var johnnyEmail = 'your-email@gmail.com';
  8. Click Save, then run the setup() function to initialize headers and formatting.
  9. Click Deploy → New deployment → Web app. Set:
    • Execute as: Me
    • Who has access: Anyone
  10. Click Deploy, authorize permissions, and copy the Web app URL.
The deployment access must be set to Anyone — not “Anyone with Google account”. If this is set incorrectly, RSVP submissions will fail silently.
3

Connect the website to your Apps Script

Open script.js and replace the URL in the submitForm() function with your web app URL:
script.js
$.ajax({
    url: "https://script.google.com/macros/s/YOUR_SCRIPT_ID/exec",
    method: "POST",
    dataType: "json",
    data: formData,
    timeout: 10000,
    // ...
});
4

Customize your wedding details

Open index.html and update the following:Couple names (hero section):
index.html
<h1 class="couple-names">Johnny & Josephine</h1>
Date and time:
index.html
<div class="date-time">2025.10.25 17:30</div>
Venue:
index.html
<div class="venue-name">晶宴會館｜桃園館</div>
<div class="venue-name">三樓-詠劇場</div>
The Love Story section, gallery images, and Wedding Details cards also contain content to personalize. See Wedding Details for the full guide.
5

Update the countdown timer date

Open script.js and set your actual wedding date and time:
script.js
const weddingDate = new Date("Oct 25, 2025 17:30:00").getTime();
Replace Oct 25, 2025 17:30:00 with your wedding date in the same format.
6

Deploy to GitHub Pages

  1. Push your code to a GitHub repository.
  2. Go to Settings → Pages in your repository.
  3. Under Source, select branch main and folder / (root).
  4. Click Save. Your site will be live at https://your-username.github.io/repository-name within a minute.
Before deploying, open index.html directly in your browser to test the layout. To test RSVP form submission, you need the site served over HTTP/HTTPS — run python3 -m http.server 8000 in the project directory and open http://localhost:8000.

​
Next steps

Setup Guide

Detailed Google Sheets and Apps Script configuration

Customization

Personalize every section of your invitation

Styling

Change colors, fonts, and images

Troubleshooting

Solutions to common setup issues

Build docs developers (and LLMs) love

Get started for freeTalk to us