Skip to main content

Newsletter Signup Rewards

Complete guide to rewarding users for newsletter signups with automatic LTZ distribution.

Overview​

Incentivize newsletter signups by automatically rewarding subscribers with LTZ tokens. Perfect for:

  • Growing your email list
  • Increasing conversion rates
  • Building loyal community
  • Encouraging social sharing

Typical Reward: 25-100 LTZ per signup

Implementation Options​

Option 1: Form Auto-Detection (Easiest)​

The SDK automatically detects and rewards newsletter form submissions.

<!-- Your existing newsletter form -->
<form data-ltz-form="newsletter_signup">
  <input type="email" name="email" placeholder="[email protected]" required>
  <button type="submit">Subscribe</button>
</form>

<!-- Add SDK -->
<script src="https://api.loyalteez.app/sdk.js"></script>
<script>
  LoyalteezAutomation.init('YOUR_BRAND_ID');
</script>

That's it! The SDK will:

  1. Detect form submission
  2. Extract email
  3. Send event to API
  4. Reward user automatically

Option 2: Manual Tracking​

Track the event explicitly in your form handler:

document.getElementById('newsletter-form').addEventListener('submit', async (e) => {
  e.preventDefault();
  
  const email = e.target.email.value;
  
  // Your existing signup logic
  await subscribeToNewsletter(email);
  
  // Track event for reward
  await LoyalteezAutomation.track('newsletter_signup', {
    userEmail: email,
    metadata: {
      source: 'website_footer',
      timestamp: Date.now()
    }
  });
  
  // Show success message
  alert('Subscribed! You earned 25 LTZ! 🎉');
});

Option 3: Backend Integration​

Track from your server (recommended for sensitive operations):

// Node.js backend
app.post('/api/newsletter/subscribe', async (req, res) => {
  const { email } = req.body;
  
  // Add to your email service (Mailchimp, SendGrid, etc.)
  await emailService.subscribe(email);
  
  // Reward user
  await fetch('https://api.loyalteez.app/loyalteez-api/manual-event', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({
      brandId: process.env.LOYALTEEZ_BRAND_ID,
      eventType: 'newsletter_signup',
      userEmail: email,
      domain: 'yourdomain.com',
      metadata: {
        source: 'backend',
        ip: req.ip,
        referrer: req.headers.referer
      }
    })
  });
  
  res.json({ success: true, message: 'Subscribed! You earned 25 LTZ!' });
});

Option 4: Email Service Integration​

Mailchimp Webhook​

// Express webhook endpoint
app.post('/webhooks/mailchimp', async (req, res) => {
  const { type, data } = req.body;
  
  if (type === 'subscribe') {
    await fetch('https://api.loyalteez.app/loyalteez-api/manual-event', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({
        brandId: process.env.LOYALTEEZ_BRAND_ID,
        eventType: 'newsletter_signup',
        userEmail: data.email,
        domain: 'yourdomain.com',
        metadata: {
          source: 'mailchimp',
          list_id: data.list_id,
          signup_date: data.timestamp
        }
      })
    });
  }
  
  res.sendStatus(200);
});

Zapier Integration​

Trigger: New Subscriber in Mailchimp
  ↓
Action: Webhooks by Zapier
  Method: POST
  URL: https://api.loyalteez.app/loyalteez-api/manual-event
  Body:
    {
      "brandId": "YOUR_BRAND_ID",
      "eventType": "newsletter_signup",
      "userEmail": "{{email}}",
      "domain": "yourdomain.com",
      "metadata": {
        "source": "zapier",
        "list": "{{list_name}}"
      }
    }

Complete Example: React​

import { useState } from 'react';

export function NewsletterSignup() {
  const [email, setEmail] = useState('');
  const [status, setStatus] = useState<'idle' | 'loading' | 'success' | 'error'>('idle');
  const [message, setMessage] = useState('');

  const handleSubmit = async (e: React.FormEvent) => {
    e.preventDefault();
    setStatus('loading');

    try {
      // Subscribe to newsletter
      const response = await fetch('/api/newsletter/subscribe', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ email })
      });

      const data = await response.json();

      if (response.ok) {
        setStatus('success');
        setMessage('🎉 Subscribed! You earned 25 LTZ!');
        setEmail('');
        
        // Optional: Track with Loyalteez SDK too
        if (window.LoyalteezAutomation) {
          window.LoyalteezAutomation.track('newsletter_signup', {
            userEmail: email,
            metadata: { source: 'react_form' }
          });
        }
      } else {
        throw new Error(data.error || 'Subscription failed');
      }
    } catch (error: any) {
      setStatus('error');
      setMessage(error.message || 'Something went wrong');
    }
  };

  return (
    <div className="newsletter-signup">
      <h3>Subscribe & Earn 25 LTZ</h3>
      <p>Join our newsletter and get rewarded with loyalty tokens!</p>
      
      <form onSubmit={handleSubmit}>
        <input
          type="email"
          value={email}
          onChange={(e) => setEmail(e.target.value)}
          placeholder="[email protected]"
          required
          disabled={status === 'loading'}
        />
        <button type="submit" disabled={status === 'loading'}>
          {status === 'loading' ? 'Subscribing...' : 'Subscribe & Earn'}
        </button>
      </form>

      {message && (
        <div className={`message ${status}`}>
          {message}
        </div>
      )}
    </div>
  );
}

Best Practices​

1. Prevent Duplicate Signups​

// Server-side validation
app.post('/api/newsletter/subscribe', async (req, res) => {
  const { email } = req.body;
  
  // Check if already subscribed
  const existing = await db.subscribers.findOne({ email });
  
  if (existing) {
    return res.status(409).json({ 
      error: 'Already subscribed',
      message: 'This email is already on our list' 
    });
  }
  
  // Proceed with signup and reward
  // ...
});
// Only reward after email confirmation
app.post('/api/newsletter/confirm', async (req, res) => {
  const { token } = req.body;
  
  const subscriber = await verifyConfirmationToken(token);
  
  if (subscriber) {
    // NOW reward the user
    await rewardUser(subscriber.email, 'newsletter_signup');
    
    await db.subscribers.update(
      { email: subscriber.email },
      { confirmed: true, confirmed_at: new Date() }
    );
  }
});

3. Add Source Tracking​

// Track where signups come from
LoyalteezAutomation.track('newsletter_signup', {
  userEmail: email,
  metadata: {
    source: 'homepage_footer',
    referrer: document.referrer,
    campaign: 'summer_2024',
    device: isMobile() ? 'mobile' : 'desktop'
  }
});

4. Show Reward Amount​

<form data-ltz-form="newsletter_signup">
  <h3>Subscribe & Earn 25 LTZ!</h3>
  <p>Get exclusive updates and loyalty rewards</p>
  <input type="email" required>
  <button type="submit">
    Subscribe Now
    <span class="reward-badge">+25 LTZ</span>
  </button>
</form>

Customizing Reward Amount​

In your Partner Portal:

  1. Go to Settings → LTZ Distribution
  2. Find newsletter_signup event
  3. Adjust reward amount (default: 25 LTZ)
  4. Set cooldown period (prevent abuse)
  5. Save changes

Recommended ranges:

  • Standard: 25 LTZ
  • Premium content: 50 LTZ
  • Exclusive lists: 100 LTZ

A/B Testing​

Test different reward amounts to optimize conversion:

// Split test implementation
const rewardAmount = Math.random() > 0.5 ? 25 : 50;

LoyalteezAutomation.track('newsletter_signup', {
  userEmail: email,
  metadata: {
    test_group: rewardAmount === 25 ? 'control' : 'variant',
    reward_amount: rewardAmount
  }
});

Track in Partner Portal Analytics to see which converts better.

Email Templates​

Confirmation Email​

<html>
<body>
  <h1>Welcome to Our Newsletter! 🎉</h1>
  
  <p>Thanks for subscribing! As a welcome gift, we've sent <strong>25 LTZ tokens</strong> to your wallet.</p>
  
  <div style="background: #f5f5f5; padding: 20px; border-radius: 8px;">
    <h3>Your Loyalty Tokens</h3>
    <p><strong>Balance:</strong> 25 LTZ</p>
    <p><strong>Wallet:</strong> Auto-created</p>
    <p><a href="https://yoursite.com/wallet">View Your Wallet</a></p>
  </div>
  
  <h3>What can you do with LTZ?</h3>
  <ul>
    <li>Redeem exclusive perks</li>
    <li>Get discounts on products</li>
    <li>Access premium content</li>
    <li>Trade with other members</li>
  </ul>
  
  <p><a href="https://yoursite.com/perks">Browse Available Perks</a></p>
</body>
</html>

Measuring Success​

Track these metrics in Partner Portal:

  • Conversion Rate: Signups with rewards vs without
  • Source Attribution: Which channels drive most signups
  • Engagement: Do rewarded users stay subscribed longer?
  • Cost per Signup: LTZ cost vs email list value

Troubleshooting​

Rewards Not Distributed​

Check:

  1. ✅ Brand ID is correct
  2. ✅ Email format is valid
  3. ✅ Domain matches Partner Portal settings
  4. ✅ Event type is "newsletter_signup"
  5. ✅ No duplicate signup (check cooldown)

Debug:

// Enable debug mode
LoyalteezAutomation.init('YOUR_BRAND_ID', { debug: true });

// Check console for logs

Duplicate Rewards​

Solution:

  1. Enable cooldown in Partner Portal (24 hours recommended)
  2. Track confirmed signups only (double opt-in)
  3. Check email service for duplicates

Advanced: Referral Bonuses​

Reward both subscriber and referrer:

// Extract referral code from URL
const urlParams = new URLSearchParams(window.location.search);
const referralCode = urlParams.get('ref');

// On signup
if (referralCode) {
  // Reward new subscriber
  await rewardUser(newEmail, 'newsletter_signup', {
    referral_code: referralCode
  });
  
  // Reward referrer
  const referrer = await getReferrerByCode(referralCode);
  await rewardUser(referrer.email, 'referral_signup', {
    referred_email: newEmail
  });
}

Integration Examples​

Next Steps​

Support​

Last updated on