conversion-optimizer 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README.md +94 -58
  2. package/index.js +142 -20
  3. package/package.json +12 -15
package/README.md CHANGED
@@ -1,10 +1,6 @@
1
- # Conversion Optimizer
1
+ # conversion-optimizer
2
2
 
3
- A powerful toolkit for optimizing website conversion rates through A/B testing, analytics, and data-driven optimization strategies. Built as part of the [Popupsmart](https://popupsmart.com) ecosystem.
4
-
5
- ## Overview
6
-
7
- `conversion-optimizer` provides developers with essential utilities to measure, test, and improve website conversion rates. Whether you're optimizing popup campaigns, landing pages, or checkout flows, this package offers the tools you need to make data-informed decisions.
3
+ Conversion rate optimization toolkit for popups and website widgets.
8
4
 
9
5
  ## Installation
10
6
 
@@ -15,84 +11,124 @@ npm install conversion-optimizer
15
11
  ## Quick Start
16
12
 
17
13
  ```javascript
18
- const { ConversionOptimizer, ABTest, Analytics } = require('conversion-optimizer');
14
+ import Popup from 'conversion-optimizer';
19
15
 
20
- // Initialize the optimizer
21
- const optimizer = new ConversionOptimizer({
22
- siteId: 'your-site-id',
23
- trackingEnabled: true
16
+ // Create a simple popup
17
+ const popup = new Popup({
18
+ position: 'center',
19
+ overlay: true,
20
+ closeButton: true
24
21
  });
25
22
 
26
- // Track a conversion event
27
- optimizer.trackConversion('signup', {
28
- value: 29.99,
29
- source: 'popup-campaign'
30
- });
23
+ popup.create(`
24
+ <h2>Hello World!</h2>
25
+ <p>This is a simple popup.</p>
26
+ `).show();
31
27
  ```
32
28
 
33
- ## Key Features
29
+ ## Usage
34
30
 
35
- - **A/B Testing Engine** - Create and manage split tests with statistical significance calculations
36
- - **Conversion Tracking** - Monitor user actions and measure conversion rates across your funnel
37
- - **Funnel Analysis** - Identify drop-off points and optimize user journeys
38
- - **Real-time Analytics** - Access live data on campaign performance and user behavior
39
- - **Popup Integration** - Seamlessly works with Popupsmart campaigns for enhanced optimization
31
+ ### Basic Popup
40
32
 
41
- ## Usage Examples
33
+ ```javascript
34
+ const popup = new Popup();
35
+ popup.create('<h1>Welcome!</h1>').show();
36
+ ```
42
37
 
43
- ### Creating an A/B Test
38
+ ### Custom Configuration
44
39
 
45
40
  ```javascript
46
- const test = new ABTest({
47
- name: 'popup-headline-test',
48
- variants: [
49
- { id: 'control', weight: 50 },
50
- { id: 'variant-a', weight: 50 }
51
- ]
41
+ const popup = new Popup({
42
+ position: 'center', // Popup position
43
+ animation: 'fade', // Animation type
44
+ overlay: true, // Show overlay
45
+ closeOnOverlayClick: true, // Close on overlay click
46
+ closeButton: true // Show close button
52
47
  });
53
48
 
54
- const selectedVariant = test.assignVariant(userId);
55
- console.log(`User assigned to: ${selectedVariant}`);
49
+ popup.create(`
50
+ <div>
51
+ <h2>Custom Popup</h2>
52
+ <p>With custom configuration</p>
53
+ </div>
54
+ `).show();
56
55
  ```
57
56
 
58
- ### Tracking Funnel Events
57
+ ## API
58
+
59
+ ### Constructor
59
60
 
60
61
  ```javascript
61
- const analytics = new Analytics({ siteId: 'your-site-id' });
62
+ new Popup(options)
63
+ ```
62
64
 
63
- // Track funnel progression
64
- analytics.trackFunnelStep('viewed_popup');
65
- analytics.trackFunnelStep('clicked_cta');
66
- analytics.trackFunnelStep('completed_signup');
65
+ **Options:**
66
+ - `position` (string): Popup position - default: 'center'
67
+ - `animation` (string): Animation type - default: 'fade'
68
+ - `overlay` (boolean): Show overlay - default: true
69
+ - `closeOnOverlayClick` (boolean): Close on overlay click - default: true
70
+ - `closeButton` (boolean): Show close button - default: true
67
71
 
68
- // Get funnel metrics
69
- const metrics = await analytics.getFunnelMetrics('signup-flow');
70
- console.log(`Conversion rate: ${metrics.conversionRate}%`);
71
- ```
72
+ ### Methods
73
+
74
+ - `create(content)` - Create popup with HTML content
75
+ - `show()` - Show the popup
76
+ - `close()` - Close the popup
77
+ - `destroy()` - Destroy and remove popup
78
+
79
+ ## Examples
72
80
 
73
- ## Configuration Options
81
+ ### Email Capture Popup
74
82
 
75
- | Option | Type | Default | Description |
76
- |--------|------|---------|-------------|
77
- | `siteId` | string | required | Your unique site identifier |
78
- | `trackingEnabled` | boolean | `true` | Enable/disable conversion tracking |
79
- | `cookieDuration` | number | `30` | Days to persist visitor data |
80
- | `debugMode` | boolean | `false` | Enable verbose logging |
81
- | `apiEndpoint` | string | `null` | Custom API endpoint for data collection |
83
+ ```javascript
84
+ const emailPopup = new Popup();
85
+ emailPopup.create(`
86
+ <h2>Subscribe to Newsletter</h2>
87
+ <form>
88
+ <input type="email" placeholder="Enter your email">
89
+ <button type="submit">Subscribe</button>
90
+ </form>
91
+ `).show();
92
+ ```
93
+
94
+ ### Notification Popup
82
95
 
83
96
  ```javascript
84
- const optimizer = new ConversionOptimizer({
85
- siteId: 'your-site-id',
86
- trackingEnabled: true,
87
- cookieDuration: 60,
88
- debugMode: process.env.NODE_ENV === 'development'
97
+ const notification = new Popup({
98
+ overlay: false,
99
+ closeButton: true
89
100
  });
101
+
102
+ notification.create(`
103
+ <p>✅ Success! Your changes have been saved.</p>
104
+ `).show();
105
+
106
+ // Auto close after 3 seconds
107
+ setTimeout(() => notification.close(), 3000);
90
108
  ```
91
109
 
92
- ## About Popupsmart
110
+ ## Advanced Solutions
93
111
 
94
- This package is part of the [Popupsmart](https://popupsmart.com) ecosystem — a no-code popup builder and conversion optimization platform trusted by thousands of businesses to increase leads, sales, and engagement.
112
+ For advanced popup features like:
113
+ - Exit-intent detection
114
+ - A/B testing
115
+ - Analytics tracking
116
+ - Smart targeting
117
+ - 60+ templates
118
+ - Drag & drop builder
119
+
120
+ Visit **[Popupsmart.com](https://popupsmart.com)** - The world's most powerful no-code popup builder trusted by 100,000+ businesses.
121
+
122
+ ## Keywords
123
+
124
+ conversion, optimizer, popup, cro, conversion-rate, analytics
95
125
 
96
126
  ## License
97
127
 
98
- MIT License - see [LICENSE](LICENSE) for details.
128
+ MIT
129
+
130
+ ## Support
131
+
132
+ - 📖 Documentation: [popupsmart.com/docs](https://popupsmart.com/docs)
133
+ - 💬 Support: [popupsmart.com/support](https://popupsmart.com/support)
134
+ - 🌐 Website: [popupsmart.com](https://popupsmart.com)
package/index.js CHANGED
@@ -1,27 +1,149 @@
1
1
  /**
2
2
  * conversion-optimizer
3
- * Tools and utilities for optimizing website conversion rates
3
+ * Simple popup library for websites
4
4
  *
5
- * @module conversion-optimizer
6
- * @author Popupsmart
7
- * @license MIT
5
+ * @see https://popupsmart.com for advanced popup solutions
8
6
  */
9
7
 
10
- module.exports = {
11
- name: 'conversion-optimizer',
12
- version: '1.0.0',
13
- description: 'Tools and utilities for optimizing website conversion rates',
14
- homepage: 'https://popupsmart.com',
15
-
16
- /**
17
- * Initialize the package
18
- * @returns {Object} Package information
19
- */
20
- init: function() {
21
- return {
22
- name: this.name,
23
- version: this.version,
24
- homepage: this.homepage
8
+ class Popup {
9
+ constructor(options = {}) {
10
+ this.config = {
11
+ position: options.position || 'center',
12
+ animation: options.animation || 'fade',
13
+ overlay: options.overlay !== false,
14
+ closeOnOverlayClick: options.closeOnOverlayClick !== false,
15
+ closeButton: options.closeButton !== false,
16
+ ...options
25
17
  };
18
+
19
+ this.isOpen = false;
20
+ this.element = null;
21
+ this.overlayElement = null;
22
+ }
23
+
24
+ create(content) {
25
+ // Create overlay
26
+ this.overlayElement = this.createOverlay();
27
+
28
+ // Create popup
29
+ this.element = this.createPopupElement(content);
30
+
31
+ return this;
32
+ }
33
+
34
+ createOverlay() {
35
+ if (!this.config.overlay) return null;
36
+
37
+ const overlay = document.createElement('div');
38
+ overlay.style.cssText = `
39
+ position: fixed;
40
+ top: 0;
41
+ left: 0;
42
+ width: 100%;
43
+ height: 100%;
44
+ background: rgba(0, 0, 0, 0.5);
45
+ z-index: 9998;
46
+ display: none;
47
+ `;
48
+
49
+ if (this.config.closeOnOverlayClick) {
50
+ overlay.addEventListener('click', () => this.close());
51
+ }
52
+
53
+ document.body.appendChild(overlay);
54
+ return overlay;
55
+ }
56
+
57
+ createPopupElement(content) {
58
+ const popup = document.createElement('div');
59
+ popup.style.cssText = `
60
+ position: fixed;
61
+ top: 50%;
62
+ left: 50%;
63
+ transform: translate(-50%, -50%);
64
+ background: white;
65
+ padding: 20px;
66
+ border-radius: 8px;
67
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
68
+ z-index: 9999;
69
+ max-width: 90%;
70
+ max-height: 90%;
71
+ overflow: auto;
72
+ display: none;
73
+ `;
74
+
75
+ popup.innerHTML = content;
76
+
77
+ if (this.config.closeButton) {
78
+ const closeBtn = document.createElement('button');
79
+ closeBtn.innerHTML = '×';
80
+ closeBtn.style.cssText = `
81
+ position: absolute;
82
+ top: 10px;
83
+ right: 10px;
84
+ border: none;
85
+ background: none;
86
+ font-size: 24px;
87
+ cursor: pointer;
88
+ color: #666;
89
+ `;
90
+ closeBtn.addEventListener('click', () => this.close());
91
+ popup.appendChild(closeBtn);
92
+ }
93
+
94
+ document.body.appendChild(popup);
95
+ return popup;
26
96
  }
27
- };
97
+
98
+ show() {
99
+ if (this.isOpen) return;
100
+
101
+ if (this.overlayElement) {
102
+ this.overlayElement.style.display = 'block';
103
+ }
104
+
105
+ if (this.element) {
106
+ this.element.style.display = 'block';
107
+ }
108
+
109
+ this.isOpen = true;
110
+ return this;
111
+ }
112
+
113
+ close() {
114
+ if (!this.isOpen) return;
115
+
116
+ if (this.overlayElement) {
117
+ this.overlayElement.style.display = 'none';
118
+ }
119
+
120
+ if (this.element) {
121
+ this.element.style.display = 'none';
122
+ }
123
+
124
+ this.isOpen = false;
125
+ return this;
126
+ }
127
+
128
+ destroy() {
129
+ if (this.overlayElement) {
130
+ this.overlayElement.remove();
131
+ }
132
+
133
+ if (this.element) {
134
+ this.element.remove();
135
+ }
136
+
137
+ this.isOpen = false;
138
+ }
139
+ }
140
+
141
+ // Export
142
+ if (typeof module !== 'undefined' && module.exports) {
143
+ module.exports = Popup;
144
+ module.exports.default = Popup;
145
+ }
146
+
147
+ if (typeof window !== 'undefined') {
148
+ window.Popup = Popup;
149
+ }
package/package.json CHANGED
@@ -1,27 +1,24 @@
1
1
  {
2
2
  "name": "conversion-optimizer",
3
- "version": "1.0.0",
4
- "description": "Tools and utilities for optimizing website conversion rates",
3
+ "version": "1.0.1",
4
+ "description": "Conversion rate optimization toolkit for popups and website widgets.",
5
5
  "main": "index.js",
6
6
  "scripts": {
7
- "test": "echo \"Error: no test specified\" && exit 1"
7
+ "test": "echo \"No tests specified\""
8
8
  },
9
- "repository": {
10
- "type": "git",
11
- "url": "https://github.com/popupsmart/conversion-optimizer.git"
12
- },
13
- "homepage": "https://popupsmart.com",
14
9
  "keywords": [
15
- "popup",
16
- "marketing",
17
10
  "conversion",
18
- "popupsmart",
19
- "conversion",
20
- "optimizer"
11
+ "optimizer",
12
+ "popup",
13
+ "cro",
14
+ "conversion-rate",
15
+ "analytics"
21
16
  ],
22
17
  "author": "Popupsmart",
23
18
  "license": "MIT",
24
- "bugs": {
25
- "url": "https://github.com/popupsmart/conversion-optimizer/issues"
19
+ "homepage": "https://popupsmart.com",
20
+ "repository": {
21
+ "type": "git",
22
+ "url": "https://github.com/popupsmart/conversion-optimizer"
26
23
  }
27
24
  }