-
Notifications
You must be signed in to change notification settings - Fork 59
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
3f88b5c
commit cc1405d
Showing
1 changed file
with
151 additions
and
18 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,26 +1,159 @@ | ||
# Project Title | ||
# Cache Track Events Documentation | ||
|
||
A brief description of what the project is about. | ||
This documentation covers the `cacheTrackEvents` utility for managing page load and user interaction events. It caches events and fires them once the analytics service is ready. | ||
|
||
## Table of Contents | ||
## Methods | ||
|
||
- [Introduction](#introduction) | ||
- [Installation](#installation) | ||
- [Usage](#usage) | ||
- [Features](#features) | ||
- [Contributing](#contributing) | ||
- [License](#license) | ||
### 1. `cacheTrackEvents.loadEvent(events)` | ||
|
||
## Introduction | ||
Triggers an event when the page is loaded and immediately stores it in the cache if analytics is not yet ready. | ||
|
||
Provide a high-level overview of the project. Describe the problem it solves or the goal it achieves. | ||
**Example usage:** | ||
|
||
## Installation | ||
```js | ||
cacheTrackEvents.loadEvent([ | ||
{ | ||
name: "ce_virtual_signup_form", | ||
properties: { | ||
action: "email_confirmation_sent", | ||
form_source: window.location.hostname, | ||
form_name: "virtual_signup_ppc_landing", | ||
url: window.location.href, | ||
}, | ||
}, | ||
]); | ||
``` | ||
|
||
To install and run the project locally, follow these steps: | ||
### 2. `cacheTrackEvents.pageLoadEvent(events)` | ||
|
||
```bash | ||
git clone https://github.com/username/repository.git | ||
cd repository | ||
npm install | ||
npm start | ||
Triggers an event on page load with specific page targeting. You can either include or exclude pages to trigger the event accordingly. | ||
|
||
**Example usage:** | ||
|
||
```js | ||
cacheTrackEvents.pageLoadEvent([ | ||
{ | ||
excludedPages: ["signup-success"], | ||
event: { | ||
name: "ce_virtual_signup_form", | ||
properties: { | ||
action: "open", | ||
form_source: window.location.hostname, | ||
form_name: "virtual_signup_ppc_landing", | ||
url: window.location.href, | ||
}, | ||
}, | ||
}, | ||
{ | ||
pages: ["signup-success"], | ||
event: { | ||
name: "ce_virtual_signup_form", | ||
properties: { | ||
action: "email_confirmation_sent", | ||
form_source: window.location.hostname, | ||
form_name: "virtual_signup_ppc_landing", | ||
url: window.location.href, | ||
}, | ||
}, | ||
}, | ||
]); | ||
``` | ||
|
||
### 3. `cacheTrackEvents.addEventhandler(handlers)` | ||
|
||
This function waits for the specified elements to be ready. It applies click listeners that store events in cookies if analytics is not ready, or fire them immediately if analytics is available. | ||
|
||
**Example usage:** | ||
|
||
```js | ||
cacheTrackEvents.addEventhandler([ | ||
{ | ||
element: ".btn-free-demo .w-button", | ||
event: { | ||
name: "ce_cta_clicks", | ||
properties: { | ||
action: "click", | ||
cta_name: "Try free demo", | ||
}, | ||
}, | ||
}, | ||
{ | ||
element: '[data-attributes="btn-primary-fcta"][data-class="w-button"]', | ||
event: { | ||
name: "ce_cta_clicks", | ||
properties: { | ||
action: "click", | ||
cta_name: "Try free demo", | ||
}, | ||
}, | ||
}, | ||
{ | ||
element: ".livechatbtn", | ||
event: { | ||
name: "ce_widget_usage_form", | ||
properties: { | ||
action: "click", | ||
widget_name: "livechat", | ||
}, | ||
}, | ||
}, | ||
{ | ||
element: ".whatsapp_chat", | ||
event: { | ||
name: "ce_widget_usage_form", | ||
properties: { | ||
action: "click", | ||
widget_name: "whatsapp", | ||
}, | ||
}, | ||
}, | ||
{ | ||
element: ".tradershub-btn", | ||
event: { | ||
name: "ce_cta_clicks", | ||
properties: { | ||
action: "click", | ||
cta_name: "Traders Hub", | ||
}, | ||
}, | ||
}, | ||
{ | ||
element: '[data-attributes="btn-primary-nav"]', | ||
event: { | ||
name: "ce_cta_clicks", | ||
properties: { | ||
action: "click", | ||
cta_name: "Try free demo", | ||
}, | ||
}, | ||
}, | ||
{ | ||
element: '[data-attributes="btn-primary-nav"].tradershub-btn', | ||
event: { | ||
name: "ce_cta_clicks", | ||
properties: { | ||
action: "click", | ||
cta_name: "Trader's Hub", | ||
}, | ||
}, | ||
}, | ||
{ | ||
element: '[data-attributes="btn-secondary-nav"]', | ||
event: { | ||
name: "ce_cta_clicks", | ||
properties: { | ||
action: "click", | ||
cta_name: "Login", | ||
}, | ||
}, | ||
}, | ||
]); | ||
``` | ||
|
||
### 4. `cacheTrackEvents.pageView()` | ||
|
||
This triggers the RudderStack page view event when analytics is loaded. If the user moves to another page while analytics is not yet ready, it will store it in cookies to handle and fire accordingly. | ||
|
||
```js | ||
cacheTrackEvents.pageView(); | ||
``` |