# Embed Guide — Add Pledge Now, Pay Later to Your Website

## Option 1: QR Code + Direct Link (Recommended)

The simplest way — just share your pledge page URL or print the QR code.

### Get Your Link
Every QR source generates a unique link:
```
https://your-domain.com/p/{code}
```

### Add a Button to Your Website
```html
<a href="https://your-domain.com/p/YOUR_CODE"
   style="display:inline-block; background:#1e40af; color:#fff; padding:16px 32px;
          border-radius:12px; font-weight:700; font-size:18px; text-decoration:none;">
  Pledge Now →
</a>
```

### Embed as Full-Page iframe
```html
<iframe
  src="https://your-domain.com/p/YOUR_CODE"
  width="100%"
  height="700"
  style="border:none; border-radius:16px; max-width:480px;"
  title="Make a Pledge"
></iframe>
```

## Option 2: QR Code for Print Materials

1. Go to **Dashboard → Events → [Your Event] → QR Codes**
2. Click **Download PNG** for each QR code
3. Print on table cards, flyers, or banners

### Recommended Sizes
- **Table cards**: 5cm × 5cm QR with label below
- **Banners**: 15cm × 15cm QR
- **Flyers**: 3cm × 3cm QR (still scannable)

### Print Template (HTML)
```html
<div style="text-align:center; padding:20px; border:2px solid #1e40af; border-radius:16px; width:200px;">
  <img src="/api/events/EVENT_ID/qr/QR_ID/download?code=CODE" width="150" height="150" />
  <p style="font-weight:700; margin-top:8px;">Scan to Pledge</p>
  <p style="font-size:12px; color:#666;">Table 5 · Ramadan Gala 2025</p>
</div>
```

## Option 3: Webhook Integration (Advanced)

Connect reminders to your existing email/SMS tools:

### Poll for Due Reminders
```bash
curl -X GET "https://your-domain.com/api/webhooks?since=2025-01-01T00:00:00Z" \
  -H "x-org-id: YOUR_ORG_ID"
```

### Response Format
```json
{
  "events": [
    {
      "event": "reminder.due",
      "timestamp": "2025-03-17T10:00:00Z",
      "data": {
        "reminderId": "clx...",
        "pledgeId": "clx...",
        "step": 1,
        "channel": "email",
        "donor": {
          "name": "Sarah Khan",
          "email": "sarah@example.com",
          "phone": "07700900001"
        },
        "pledge": {
          "reference": "PNPL-7K4P-50",
          "amount": 5000,
          "rail": "bank"
        },
        "event": "Ramadan Gala 2025"
      }
    }
  ]
}
```

### Zapier / Make Setup
1. Create a scheduled trigger (every 15 minutes)
2. HTTP GET to `/api/webhooks?since={{last_run}}`
3. For each event, send email/SMS via your provider
4. Templates available in Dashboard → Exports

## Option 4: CRM Integration

### Export Pledge Data
```bash
curl -X GET "https://your-domain.com/api/exports/crm-pack" \
  -H "x-org-id: YOUR_ORG_ID" \
  -o pledges.csv
```

### CSV Fields
| Field | Description |
|-------|-------------|
| pledge_reference | Unique ref (PNPL-XXXX-NN) |
| donor_name | Donor's name |
| donor_email | Email address |
| donor_phone | Phone number |
| amount_gbp | Amount in pounds |
| payment_method | bank / gocardless / card |
| status | new / initiated / paid / overdue / cancelled |
| event_name | Source event |
| source_label | QR source label |
| volunteer_name | Assigned volunteer |
| table_name | Table assignment |
| gift_aid | Yes / No |
| pledged_at | ISO timestamp |
| paid_at | ISO timestamp (if paid) |
| days_to_collect | Number of days to payment |

### Salesforce Import
1. Download CRM pack CSV
2. Salesforce → Setup → Data Import Wizard
3. Map fields: pledge_reference → External ID, amount_gbp → Amount, etc.

### Beacon CRM Import
1. Download CRM pack CSV
2. Beacon → Contacts → Import
3. Map donor fields and donation amount