Push Notifications
Overview
CloudCusp Mailer integrates web push notification capabilities to deliver targeted messages directly to your subscribers' browsers. Complement your email marketing with timely browser notifications for increased engagement and click-through rates without relying on email deliverability.
Push Notification Basics
What are Push Notifications?
Browser-based messages delivered directly to subscriber devices:
Characteristics:
- Displayed in browser notifications (even when tab not active)
- Non-intrusive but attention-grabbing
- High engagement rates compared to email
- Timely delivery for breaking news
- Complementary to email campaigns
- Works on desktop and mobile browsers
Supported Browsers:
- Chrome/Chromium-based browsers
- Firefox
- Edge
- Opera
- Mobile browsers (Android)
Firebase Cloud Messaging Integration
Setup Firebase
Configure Firebase Cloud Messaging for push delivery:
Prerequisites:
- Google/Firebase account
- Firebase project created
- Service account credentials
- Web application registered
Configuration Steps:
- Go to CloudCusp Mailer → Push Notifications → Settings
- Click Firebase Configuration
- Enter Firebase API Key
- Upload service account JSON
- Configure Web app credentials
- Test connection
- Save settings
Service Account JSON:
{
"type": "service_account",
"project_id": "your-project-id",
"private_key_id": "key-id",
"private_key": "-----BEGIN PRIVATE KEY-----\n...\n-----END PRIVATE KEY-----\n",
"client_email": "firebase-account@project.iam.gserviceaccount.com",
"client_id": "1234567890",
"auth_uri": "https://accounts.google.com/o/oauth2/auth",
"token_uri": "https://oauth2.googleapis.com/token",
"auth_provider_x509_cert_url": "https://www.googleapis.com/oauth2/v1/certs"
}Push Notification Setup
Device Registration
Enable subscribers to receive notifications:
Client-side Registration:
- JavaScript code requests browser permission
- Subscriber grants notification permission
- Browser generates device token
- Token sent to CloudCusp Mailer
- Device added to subscriber profile
Implementation:
<!-- Add to website -->
<script src="https://your-site.com/ccsp-push-notifications.js"></script>
<script>
CCFMessaging.requestPermission({
serverKey: 'YOUR_PUBLIC_KEY'
});
</script>Device Management
View and manage subscriber devices:
- Go to CloudCusp Mailer → Push Notifications → Device Management
- View all registered devices
- See device details:
- Device ID
- Subscriber email
- Device type
- Registration date
- Last active
- Platform (Chrome, Firefox, etc.)
Device Actions:
- Remove device
- Disable notifications for device
- Test notification to device
- View notification history
Subscriber Opt-in
Control notification permissions:
Notification Settings:
- Allow notifications: ON/OFF
- Notification frequency
- Notification categories
- Quiet hours (time range without notifications)
- Device preferences
Subscriber Preferences Page:
- Navigate to notification preferences
- Toggle notification permission
- Set notification frequency
- Choose notification types
- Configure quiet hours
- Save preferences
Push Notification Creation
Notification Composer
Create professional push notifications:
Components:
- Notification title (max 65 characters)
- Notification body/message (max 240 characters)
- Action buttons (up to 3)
- Icon/badge image
- Click action URL
- Analytics tags
Composer Interface
Fields:
| Field | Max Length | Required | Notes |
|---|---|---|---|
| Title | 65 chars | Yes | Main message headline |
| Body | 240 chars | Yes | Detailed message |
| Icon | N/A | Optional | Logo/image URL |
| Badge | N/A | Optional | Small badge icon |
| Click URL | N/A | Yes | Target URL on click |
| Action 1 | 20 chars | Optional | Button text |
| Action 2 | 20 chars | Optional | Button text |
| Action 3 | 20 chars | Optional | Button text |
Notification Types
Standard Notification:
Title: "New Sale Alert"
Body: "Get 30% off your favorite products. Use code: SAVE30"
Click URL: https://example.com/saleAction Buttons:
Main: "Shop Now" → https://example.com/sale
Button 1: "Learn More" → https://example.com/details
Button 2: "Dismiss" → (close notification)Rich Media:
Icon: https://example.com/logo.png
Badge: https://example.com/badge.png
Title: "New Blog Post"
Body: "Check out our latest article on email marketing"
Click URL: https://example.com/blog/latest-articleSending Notifications
Schedule Notification
Send notification at optimal time:
- Create notification in composer
- Click Schedule
- Select delivery date/time
- Choose timezone handling
- Select target subscribers/devices
- Review before sending
- Schedule notification
Scheduling Options:
- Send immediately
- Schedule for specific date/time
- Optimize send time per subscriber
- Timezone-aware scheduling
Targeted Distribution
Send to specific subscriber segments:
Target Options:
- All subscribers with notifications enabled
- Specific lists
- Specific segments
- Subscribers with specific tags
- Custom filter conditions
Filter Conditions:
Send to:
├─ All subscribers in "Premium" list
├─ Who have opened email in last 30 days
├─ AND have "Engaged" tag
├─ AND are from United States
└─ Exclude: unsubscribed or bouncedBatch Processing
Manage large notification sends:
Batch Features:
- Configurable batch size
- Rate limiting
- Automatic retry on failure
- Progress tracking
- Real-time statistics
Notification Analytics
Performance Metrics
Track notification engagement:
Available Metrics:
- Total sent
- Delivery rate
- Click rate
- Button click breakdown
- Click-through rate (CTR)
- Unique clickers
- Repeat clickers
- Device breakdown
- Geographic breakdown
Device Management
View All Devices
See all registered notification devices:
- Go to CloudCusp Mailer → Push Notifications → Device Management
- Browse all devices
- Filter by status, subscriber, platform
Device Information:
- Device ID
- Subscriber email
- Platform (Chrome, Firefox, etc.)
- Browser version
- Registration date
- Last active date
- Active status
Device Actions
Manage individual devices:
Available Actions:
- Send test notification
- Disable/enable notifications
- Remove device
- View notification history
- Update subscriber info
- Refresh device token
Device Cleanup
Remove inactive devices:
- Go to Device Management
- Click Cleanup
- Select criteria:
- Not active for X days
- Failed delivery rate exceeds X%
- Status = inactive
- Review devices to remove
- Confirm cleanup
Cleanup Process:
- Automatic removal of stale tokens
- Re-request permissions from inactive users
- Clean up failed delivery addresses
- Improve delivery rate
Notification Templates
Create Templates
Save notification designs for reuse:
- Go to CloudCusp Mailer → Push Notifications → Templates
- Click Create Template
- Enter template name
- Create notification design
- Add variable placeholders
- Save template
Template Variables:
{subscriber_name} - Subscriber first name
{subscriber_email} - Subscriber email
{site_name} - Website name
{date} - Current date
{custom_field} - Custom subscriber fieldTemplate Example:
Title: "Hello {subscriber_name}!"
Body: "Check out new content on {site_name}"
Click URL: https://example.comTemplate Library
Browse and use saved templates:
Template Features:
- Quick start with templates
- Modify template for specific use
- Duplicate template
- Delete unused templates
- Preview template rendering
- Template categories
Compliance & Best Practices
Permission Management
Handle notification permissions properly:
Permission Levels:
- Granted: User allowed notifications
- Denied: User blocked notifications
- Prompt: User hasn't decided yet
Handling Denials:
- Don't repeatedly request if denied
- Provide way to re-enable in settings
- Respect user preference
Notification Frequency
Avoid notification fatigue:
Best Practices:
- Frequency: 1-3 notifications per week maximum
- Timing: Send during business hours (9 AM - 5 PM)
- Relevance: Only send relevant notifications
- Quiet Hours: Respect subscriber preferences
- Value: Ensure each notification provides value
Privacy & GDPR
Ensure compliance:
Requirements:
- Explicit permission to send notifications
- Clear opt-out mechanism
- Privacy policy disclosure
- No personal data in notification body
- Secure device token storage
- GDPR compliance for EU subscribers
Content Guidelines
Write effective notifications:
Do's:
- Use clear, action-oriented language
- Keep title short and compelling
- Include primary action button
- Personalize when possible
- A/B test different messages
- Time sends optimally
Don'ts:
- Send too frequently (notification fatigue)
- Use all caps or excessive punctuation
- Send irrelevant notifications
- Include sensitive information
- Request confirmation on trivial actions
- Send during off hours without reason
Analytics Integration
Combine Email & Push
Track multi-channel engagement:
Integrated Metrics:
- Email + Push clicks
- Multi-channel engagement score
- Customer journey tracking
- Attribution modeling
- Combined ROI
Comparison:
Campaign Performance:
├─ Email Only: 5% CTR
├─ Push Only: 24% CTR
├─ Email + Push: 31% CTR (stacking effect)Troubleshooting
Common Issues
Notifications Not Appearing:
- Check subscriber permission granted
- Verify Firebase configuration
- Check browser notification settings
- Test with specific device
- Review browser console for errors
Low Delivery Rate:
- Check invalid device tokens
- Run device cleanup
- Verify Firebase API key
- Check browser push service status
- Verify notification content
High Opt-out Rate:
- Reduce notification frequency
- Improve notification relevance
- Respect quiet hours
- Personalize messages
- A/B test different approaches