Purpose: To collect customer bike sale inquiry data from a Shopify storefront and send it to a Google Sheet, with photos uploaded to Google Drive.

Form Fields:

1. Name

2. Email

3. Phone

4. Bike Brand

5. Bike Model

6. Insurance Active (Yes/No)

7. RTO Detail

8. Manufacturing Year

9. Photo Upload (up to 5 images)

Technology Stack:

• HTML/CSS/JavaScript (Frontend)

• Google Apps Script (Backend for Google Sheet and Drive)

• Shopify (hosted as a custom page or embedded app)

Frontend Flow:

1. HTML form collects the user data.

2. JavaScript handles form validation, converts images to Base64, and submits data via fetch() to Google Apps Script Web App.

3. Loading animation is shown while data is being submitted.

4. On successful submission:

   • Data is stored in a Google Sheet.

   • Images are uploaded to a folder in Google Drive.

   • A thank-you message is shown.

Backend (Google Apps Script) Responsibilities:

1. Parse incoming POST request.

2. Save text fields to Google Sheet.

3. Save each base64 image to Google Drive (convert and name properly).

4. Link image URLs in the corresponding row in the Google Sheet.

5. Return "Success" or error message.

How to Use in Shopify:

1. Add the HTML code to a custom page or a custom app block in your Shopify theme.

2. Host the form as a separate file or use Shopify's theme editor.

3. Deploy your Google Apps Script Web App (get the URL).

4. Replace the placeholder YOUR_WEB_APP_URL in the form JavaScript with the actual URL.

Brand Use Case: Perfect for bike dealers and resellers who want to collect high-quality leads with full bike details and photo uploads directly through their Shopify store.