popup-builder-widget 1.0.0
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.
- package/README.md +110 -0
- package/index.js +27 -0
- package/package.json +28 -0
package/README.md
ADDED
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
```markdown
|
|
2
|
+
# Popup Builder Widget
|
|
3
|
+
|
|
4
|
+
A customizable popup builder widget for creating engaging, conversion-optimized popups on websites. Built with exit-intent detection and A/B testing capabilities to maximize your conversion rates.
|
|
5
|
+
|
|
6
|
+
Part of the [Popupsmart](https://popupsmart.com) ecosystem - a leading popup builder and marketing conversion platform.
|
|
7
|
+
|
|
8
|
+
## Installation
|
|
9
|
+
|
|
10
|
+
```bash
|
|
11
|
+
npm install popup-builder-widget
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
## Quick Start
|
|
15
|
+
|
|
16
|
+
```javascript
|
|
17
|
+
import { PopupBuilder } from 'popup-builder-widget';
|
|
18
|
+
|
|
19
|
+
// Initialize a basic popup
|
|
20
|
+
const popup = new PopupBuilder({
|
|
21
|
+
title: 'Subscribe to Our Newsletter',
|
|
22
|
+
content: 'Get exclusive deals and updates delivered to your inbox.',
|
|
23
|
+
trigger: 'exit-intent'
|
|
24
|
+
});
|
|
25
|
+
|
|
26
|
+
popup.show();
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
## Features
|
|
30
|
+
|
|
31
|
+
- **Exit-Intent Detection** - Automatically display popups when users attempt to leave your page, capturing potential lost conversions
|
|
32
|
+
- **A/B Testing** - Built-in split testing capabilities to optimize popup performance and identify winning variations
|
|
33
|
+
- **Customizable Templates** - Fully customizable popup designs with flexible styling options to match your brand
|
|
34
|
+
- **Smart Targeting** - Display popups based on user behavior, page URLs, device type, and custom conditions
|
|
35
|
+
- **Analytics Integration** - Track impressions, conversions, and engagement metrics out of the box
|
|
36
|
+
|
|
37
|
+
## Usage Examples
|
|
38
|
+
|
|
39
|
+
### Exit-Intent Popup
|
|
40
|
+
|
|
41
|
+
```javascript
|
|
42
|
+
import { PopupBuilder } from 'popup-builder-widget';
|
|
43
|
+
|
|
44
|
+
const exitPopup = new PopupBuilder({
|
|
45
|
+
title: 'Wait! Before You Go...',
|
|
46
|
+
content: 'Get 15% off your first order!',
|
|
47
|
+
trigger: 'exit-intent',
|
|
48
|
+
theme: 'modern',
|
|
49
|
+
onSubmit: (data) => {
|
|
50
|
+
console.log('Lead captured:', data);
|
|
51
|
+
}
|
|
52
|
+
});
|
|
53
|
+
|
|
54
|
+
exitPopup.init();
|
|
55
|
+
```
|
|
56
|
+
|
|
57
|
+
### A/B Testing Configuration
|
|
58
|
+
|
|
59
|
+
```javascript
|
|
60
|
+
import { PopupBuilder, ABTest } from 'popup-builder-widget';
|
|
61
|
+
|
|
62
|
+
const test = new ABTest({
|
|
63
|
+
variants: [
|
|
64
|
+
{ id: 'A', title: 'Sign Up Now', buttonColor: '#007bff' },
|
|
65
|
+
{ id: 'B', title: 'Join Free Today', buttonColor: '#28a745' }
|
|
66
|
+
],
|
|
67
|
+
trafficSplit: 50,
|
|
68
|
+
onConversion: (variant) => {
|
|
69
|
+
console.log(`Variant ${variant.id} converted`);
|
|
70
|
+
}
|
|
71
|
+
});
|
|
72
|
+
|
|
73
|
+
const popup = new PopupBuilder({
|
|
74
|
+
abTest: test,
|
|
75
|
+
trigger: 'scroll-50'
|
|
76
|
+
});
|
|
77
|
+
|
|
78
|
+
popup.init();
|
|
79
|
+
```
|
|
80
|
+
|
|
81
|
+
## Configuration Options
|
|
82
|
+
|
|
83
|
+
| Option | Type | Default | Description |
|
|
84
|
+
|--------|------|---------|-------------|
|
|
85
|
+
| `title` | string | `''` | Popup heading text |
|
|
86
|
+
| `content` | string | `''` | Main popup content or HTML |
|
|
87
|
+
| `trigger` | string | `'load'` | Trigger type: `'load'`, `'exit-intent'`, `'scroll-{percent}'`, `'delay-{ms}'` |
|
|
88
|
+
| `theme` | string | `'default'` | Popup theme: `'default'`, `'modern'`, `'minimal'` |
|
|
89
|
+
| `position` | string | `'center'` | Display position: `'center'`, `'top'`, `'bottom'`, `'bottom-right'` |
|
|
90
|
+
| `overlay` | boolean | `true` | Show background overlay |
|
|
91
|
+
| `closeOnOverlay` | boolean | `true` | Close popup when clicking overlay |
|
|
92
|
+
| `onSubmit` | function | `null` | Callback function when form is submitted |
|
|
93
|
+
| `onClose` | function | `null` | Callback function when popup is closed |
|
|
94
|
+
|
|
95
|
+
## Documentation
|
|
96
|
+
|
|
97
|
+
For comprehensive documentation, tutorials, and advanced use cases, visit the [Popupsmart Documentation](https://popupsmart.com).
|
|
98
|
+
|
|
99
|
+
## Support
|
|
100
|
+
|
|
101
|
+
If you encounter any issues or have questions, please visit [Popupsmart](https://popupsmart.com) for support resources.
|
|
102
|
+
|
|
103
|
+
## License
|
|
104
|
+
|
|
105
|
+
MIT License - see [LICENSE](LICENSE) for details.
|
|
106
|
+
|
|
107
|
+
---
|
|
108
|
+
|
|
109
|
+
Built with ❤️ by [Popupsmart](https://popupsmart.com)
|
|
110
|
+
```
|
package/index.js
ADDED
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* popup-builder-widget
|
|
3
|
+
* A customizable popup builder widget for creating engaging popups on websites
|
|
4
|
+
*
|
|
5
|
+
* @module popup-builder-widget
|
|
6
|
+
* @author Popupsmart
|
|
7
|
+
* @license MIT
|
|
8
|
+
*/
|
|
9
|
+
|
|
10
|
+
module.exports = {
|
|
11
|
+
name: 'popup-builder-widget',
|
|
12
|
+
version: '1.0.0',
|
|
13
|
+
description: 'A customizable popup builder widget for creating engaging popups on websites',
|
|
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
|
|
25
|
+
};
|
|
26
|
+
}
|
|
27
|
+
};
|
package/package.json
ADDED
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "popup-builder-widget",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "A customizable popup builder widget for creating engaging popups on websites",
|
|
5
|
+
"main": "index.js",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"test": "echo \"Error: no test specified\" && exit 1"
|
|
8
|
+
},
|
|
9
|
+
"repository": {
|
|
10
|
+
"type": "git",
|
|
11
|
+
"url": "https://github.com/popupsmart/popup-builder-widget.git"
|
|
12
|
+
},
|
|
13
|
+
"homepage": "https://popupsmart.com",
|
|
14
|
+
"keywords": [
|
|
15
|
+
"popup",
|
|
16
|
+
"marketing",
|
|
17
|
+
"conversion",
|
|
18
|
+
"popupsmart",
|
|
19
|
+
"popup",
|
|
20
|
+
"builder",
|
|
21
|
+
"widget"
|
|
22
|
+
],
|
|
23
|
+
"author": "Popupsmart",
|
|
24
|
+
"license": "MIT",
|
|
25
|
+
"bugs": {
|
|
26
|
+
"url": "https://github.com/popupsmart/popup-builder-widget/issues"
|
|
27
|
+
}
|
|
28
|
+
}
|