Skip to content

newsuk/tls-web-push

Repository files navigation

TLS Web Push Notifications Plugin

A comprehensive WordPress plugin for implementing web push notifications with detailed analytics tracking. Perfect for promoting weekly articles, special offers, and product updates.

Features

Core Functionality

  • ✅ Web Push Notifications (browser-based)
  • ✅ Service Worker implementation
  • ✅ VAPID authentication support
  • ✅ Subscription management
  • ✅ Notification templates

Analytics & Tracking

The plugin tracks all the key metrics you requested:

  1. Opt-In Presentations - How many users were shown the opt-in prompt
  2. Opt-In Acceptance - How many users subscribed (with conversion rate)
  3. Notifications Delivered - How many users received each notification
  4. Click-Through Tracking - How many users arrived at the website from notifications

Additional Features

  • Beautiful admin dashboard with statistics
  • Notification templates (Weekly Articles, Special Offers, Product Packs)
  • Real-time preview of notifications
  • Top performing notifications report
  • Insights and recommendations based on performance
  • Responsive design for mobile and desktop
  • Privacy-friendly (no email required)

Installation

  1. Upload the tls-web-push folder to /wp-content/plugins/
  2. Activate the plugin through the 'Plugins' menu in WordPress
  3. Go to Web Push > Settings to configure VAPID keys

Setup Guide

Step 1: Generate VAPID Keys

VAPID keys are required for web push notifications. You have two options:

Option A: Online Generator

  1. Visit Web Push Code Lab
  2. Click "Generate Keys"
  3. Copy both keys

Option B: Using NPM

npm install -g web-push
web-push generate-vapid-keys

Step 2: Configure Plugin

  1. Go to Web Push > Settings in your WordPress admin
  2. Paste your VAPID Public Key
  3. Paste your VAPID Private Key
  4. Click "Save Settings"

Step 3: Test Subscription

  1. Visit your website's frontend
  2. You'll see an opt-in prompt after 10 seconds (or immediately for testing)
  3. Click "Allow Notifications"
  4. You're now subscribed!

Step 4: Send Test Notification

  1. Go to Web Push > Send Notification
  2. Fill in:
    • Title: "Test Notification"
    • Message: "This is a test from TLS Web Push"
    • URL: Your article or page URL
  3. Click "Send to All Subscribers"

Step 5: Monitor Analytics

  1. Go to Web Push > Analytics
  2. View key metrics:
    • Opt-in presentation count
    • Opt-in conversion rate
    • Total notifications sent
    • Click-through rate
    • Top performing notifications

Usage

Sending Notifications

From Admin Panel

  1. Go to Web Push > Send Notification
  2. Fill in the notification details
  3. Preview how it will look
  4. Send to all subscribers

Using Templates

The plugin includes quick templates for:

  • New Weekly Article - Perfect for Thursday releases
  • Special Offer - For limited-time promotions
  • New Product Pack - For new product announcements

Click "Use Template" to auto-fill the form with template content.

Analytics Dashboard

The analytics page provides:

  • Key Metrics Overview

    • Total opt-in presentations
    • Subscription conversion rate
    • Notifications delivered
    • Click-through rate
  • Top Performing Notifications

    • See which notifications got the most clicks
    • Compare CTR across campaigns
    • Identify what content resonates
  • Insights & Recommendations

    • Automatic suggestions based on performance
    • Best practices for notification timing
    • Content optimization tips

Best Practices

  1. Timing

    • Send notifications when your articles publish (Thursdays)
    • Avoid sending too frequently (1-2 per week max)
    • Consider user timezone
  2. Content

    • Keep titles under 50 characters
    • Make messages compelling and actionable
    • Always include a clear call-to-action
    • Use high-quality icons (192x192px recommended)
  3. Targeting

    • Start with broad notifications to all subscribers
    • Monitor which content performs best
    • Adjust your strategy based on analytics

Requirements

  • WordPress 5.0 or higher
  • PHP 7.2 or higher
  • HTTPS (required for web push, except on localhost)
  • Modern browser with push notification support

Browser Support

  • ✅ Chrome 50+
  • ✅ Firefox 44+
  • ✅ Edge 17+
  • ✅ Safari 16+ (macOS 13+)
  • ✅ Opera 37+
  • ❌ iOS Safari (limited support)

Important Notes

Production Requirements

For production use, you'll need to install the web-push PHP library:

cd wp-content/plugins/tls-web-push
composer require minishlink/web-push

The current version includes a simplified sender for testing. For actual notification delivery, the library is required.

HTTPS Requirement

Web Push notifications require HTTPS. Your Local by Flywheel setup should work fine for testing, but ensure your production site has a valid SSL certificate.

Service Worker

The plugin automatically registers a service worker at:

/wp-content/plugins/tls-web-push/service-worker.js

This handles the actual notification display and click tracking.

Measuring Success

Based on your requirements, the plugin tracks:

1. Opt-In Funnel

  • ✅ Users presented with opt-in prompt
  • ✅ Users who accepted (subscribed)
  • ✅ Conversion rate calculation

2. Notification Delivery

  • ✅ Total notifications sent
  • ✅ Failed delivery tracking
  • ✅ Per-notification statistics

3. Engagement

  • ✅ Users who clicked notifications
  • ✅ Click-through rate
  • ✅ Traffic attribution

Use Cases

Weekly Articles (Thursdays)

Title: "New Article: [Your Article Title]"
Message: "This week's article is now live! Click to read more."
URL: https://yoursite.com/article-url

Special Offers

Title: "Limited Time Offer - Save 30%!"
Message: "Exclusive discount for our subscribers. Don't miss out!"
URL: https://yoursite.com/offers

New Product Packs

Title: "New Product Pack Available!"
Message: "Check out our latest bundle with exclusive content."
URL: https://yoursite.com/products/new-pack

Troubleshooting

Notifications Not Appearing

  1. Check if VAPID keys are configured
  2. Ensure you're using HTTPS (or localhost)
  3. Check browser console for errors
  4. Verify browser supports push notifications

Low Opt-In Rate

  1. Adjust timing of the opt-in prompt
  2. Improve prompt messaging
  3. Consider timing (show after user engagement)

Low Click-Through Rate

  1. Make titles more compelling
  2. Ensure content is relevant to subscribers
  3. Test different notification formats
  4. Check timing of notifications

Support & Customization

The plugin is fully customizable. Key files:

  • tls-web-push.php - Main plugin file
  • includes/class-notification-sender.php - Notification logic
  • includes/class-analytics.php - Analytics tracking
  • assets/js/frontend.js - Frontend subscription handling
  • templates/admin-*.php - Admin pages

Roadmap

Potential future enhancements:

  • Scheduled notifications
  • User segmentation
  • A/B testing
  • Advanced targeting rules
  • Integration with post publishing
  • Automatic Thursday article notifications

License

GPL v2 or later

Author

Varun Kumar


Ready to boost your site traffic with web push notifications! 🚀

About

TLS Webpush plugin

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors