Event Handling
Hushly JavaScript Events API adds the capability to trigger functions on certain states of Hushly, providing the tools needed to extend Hushly further to suit your specific needs.
Usage:
hushly('bind', EVENT-NAME, function(event) {
// event handling code.
});
Parameter | Optional/Required | Type | Description |
method | Required | String | Method Name |
eventName | Required | String | Name of the Event |
function_to_trigger | Required | Function | Function to Trigger on Event |
event object will contain information about the Hushly event. Please take a look at the event documentation below to find the attributes available in the event object.
Example: Publishing a custom event to Google Analytics when content is viewed via Hushly Experience.
// use hushly event handler to publish a custom event to google analytics. hushly('bind', 'content-view', function(event) { ga('send', 'event', { 'eventCategory': 'Hushly Experience', 'eventAction': 'Content View', 'eventLabel': event.experienceName }); });
Configuring the Event Handlers
Follow the steps below to configure Event handlers directly in Hushly.
- Navigate to Setup > Settings
- Scroll to the Tracking section, Configure the event handlers in the Event Handlers field
- Event handlers can be appended by clicking on the available event names below the field.
Events
Events are user interactions with content that can be measured independently from a web page or screen load. Downloads, link clicks, form submissions, scroll or video plays are all examples of actions you might want to analyze as Events.
Before Experience Trigger Activate: before-trigger-activate
Fired before the Experience Trigger is activated, This event is fired only when the user is interacting with Experiences.
hushly('bind', 'before-trigger-activate', function(options) { // your integration code for before-trigger-activate event });
Attribute | Description | Experience | Hub |
assetId | Id of the Asset the user is interacting with | ✓ | |
assetName | Name of the Asset the user is interacting with | ✓ | |
experienceId | Id of the Experience the user is interacting with | ✓ | |
experienceName | Name of the Experience the user is interacting with | ✓ | |
triggerType | Type of Trigger (ExitIntent/Click...) | ✓ | |
contentRuleId | (Optional) Id of the Content Personalization Rule | ✓ |
Content View: content-view
Fired after the Hushly Experience is popped or the Stream Content Page is viewed.
hushly('bind', 'content-view', function(options) { // your integration code for content view });
Attribute | Description | Experience | Hub | ABM Page |
assetId | Id of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetName | Name of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetType | Asset Type the user is interacting with | ✓ | ✓ | |
experienceId | Id of the Experience the user is interacting with | ✓ | ||
experienceName | Name of the Experience the user is interacting with | ✓ | ||
streamId | Id of the Stream the user is Interacting with | ✓ | ✓ | |
streamName | Name of the Stream the user is interacting with | ✓ | ✓ | |
triggerType | Type of Trigger (ExitIntent/Click...) | ✓ | ||
contentRuleId | (Optional) Id of the Content Personalization Rule | ✓ | ||
visitor | ABM Visitor accessing the Page | ✓ | ||
account | ABM Account | ✓ | ||
page | ABM Page | ✓ |
Content Interaction: content-interaction
Fired when a user interacts with the content like scrolling the pages or clicking the Play button for video-type content
hushly('bind', 'content-interaction', function(options) { // your integration code for content-interaction event });
Attribute | Description | Experience | Hub | ABM Page |
assetId | Id of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetName | Name of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetType | Asset Type the user is interacting with | ✓ | ✓ | |
experienceId | Id of the Experience the user is interacting with | ✓ | ||
experienceName | Name of the Experience the user is interacting with | ✓ | ||
streamId | Id of the Stream the user is Interacting with | ✓ | ✓ | |
streamName | Name of the Stream the user is interacting with | ✓ | ✓ | |
triggerType | Type of Trigger (ExitIntent/Click...) | ✓ | ||
contentRuleId | (Optional) Id of the Content Personalization Rule | ✓ | ||
category | Type of the Asset (video/pageFlip/toolbarAction) | ✓ | ✓ | ✓ |
type | Type of Interaction Toolbar Actions (Common for Documents and Videos)
| ✓ | ✓ | ✓ |
pageNumber | Page Number of the Document (Only for Document type Assets) | ✓ | ✓ | ✓ |
visitor | ABM Visitor accessing the Page | ✓ | ||
account | ABM Account | ✓ | ||
page | ABM Page | ✓ |
Recommendation Open: recommendation-open
When a user selects content in the Recommendation section by clicking on it and views the Content Page.
hushly('bind', 'recommendation-open', function(options) { // your integration code for recommendation-open event });
Attribute | Description | Experience | Hub | ABM Page |
assetId | Id of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetName | Name of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetType | Asset Type the user is interacting with | ✓ | ✓ | |
experienceId | Id of the Experience the user is interacting with | ✓ | ||
experienceName | Name of the Experience the user is interacting with | ✓ | ||
streamId | Id of the Stream the user is Interacting with | ✓ | ✓ | |
streamName | Name of the Stream the user is interacting with | ✓ | ✓ | |
triggerType | Type of Trigger (ExitIntent/Click...) | ✓ | ||
contentRuleId | (Optional) Id of the Content Personalization Rule | ✓ | ||
visitor | ABM Visitor accessing the Page | ✓ | ||
account | ABM Account | ✓ | ||
page | ABM Page | ✓ |
Form View: form-view
Fired when a user views the Hushly Form in an Experience or Stream Item Page
hushly('bind', 'form-view', function(options) { // your integration code for form-view event });
Attribute | Description | Experience | Hub | ABM Page |
assetId | Id of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetName | Name of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetType | Asset Type the user is interacting with | ✓ | ✓ | |
experienceId | Id of the Experience the user is interacting with | ✓ | ||
experienceName | Name of the Experience the user is interacting with | ✓ | ||
streamId | Id of the Stream the user is Interacting with | ✓ | ✓ | |
streamName | Name of the Stream the user is interacting with | ✓ | ✓ | |
triggerType | Type of Trigger (ExitIntent/Click...) | ✓ | ||
contentRuleId | (Optional) Id of the Content Personalization Rule | ✓ | ||
Email Address that the user submitted | ✓ | ✓ | ✓ | |
country | Country selected by the user in Hushly Form | ✓ | ✓ | ✓ |
pageUrl | URL of the Page where the user Submitted the Form | ✓ | ✓ | ✓ |
referrer | Referrer URL of the Page | ✓ | ✓ | ✓ |
visitor | ABM Visitor accessing the Page | ✓ | ||
account | ABM Account | ✓ | ||
page | ABM Page | ✓ |
Invalid Form Submit: invalid-form-submit
Fires when a form submission is failed. Eg. when a user submits a non-business email address or a role email address.
hushly('bind', 'invalid-form-submit', function(formData) { // your integration code for invalid form submit event });
Attribute | Description | Experience | Hub | ABM Page |
assetId | Id of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetName | Name of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetType | Asset Type the user is interacting with | ✓ | ✓ | |
experienceId | Id of the Experience the user is interacting with | ✓ | ||
experienceName | Name of the Experience the user is interacting with | ✓ | ||
streamId | Id of the Stream the user is Interacting with | ✓ | ✓ | |
streamName | Name of the Stream the user is interacting with | ✓ | ✓ | |
triggerType | Type of Trigger (ExitIntent/Click...) | ✓ | ||
contentRuleId | (Optional) Id of the Content Personalization Rule | ✓ | ||
Email Address that the user submitted | ✓ | ✓ | ✓ | |
country | Country selected by the user in Hushly Form | ✓ | ✓ | ✓ |
pageUrl | URL of the Page where the user Submitted the Form | ✓ | ✓ | ✓ |
referrer | Referrer URL of the Page | ✓ | ✓ | ✓ |
visitor | ABM Visitor accessing the Page | ✓ | ||
account | ABM Account | ✓ | ||
page | ABM Page | ✓ |
Valid Form Submit: form-submit
Fired when a user successfully submits a Hushly Form in an Experience or Stream Item Page
hushly('bind', 'form-submit', function(formData) { // your integration code for form-submit event });
Attribute | Description | Experience | Hub | ABM Page |
assetId | Id of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetName | Name of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetType | Asset Type the user is interacting with | ✓ | ✓ | |
experienceId | Id of the Experience the user is interacting with | ✓ | ||
experienceName | Name of the Experience the user is interacting with | ✓ | ||
streamId | Id of the Stream the user is Interacting with | ✓ | ✓ | |
streamName | Name of the Stream the user is interacting with | ✓ | ✓ | |
triggerType | Type of Trigger (ExitIntent/Click...) | ✓ | ||
contentRuleId | (Optional) Id of the Content Personalization Rule | ✓ | ||
Email Address that the user submitted | ✓ | ✓ | ✓ | |
country | The country selected by the user in Hushly Form | ✓ | ✓ | ✓ |
pageUrl | URL of the Page where the user Submitted the Form | ✓ | ✓ | ✓ |
referrer | Referrer URL of the Page | ✓ | ✓ | ✓ |
visitor | ABM Visitor accessing the Page | ✓ | ||
account | ABM Account | ✓ | ||
page | ABM Page | ✓ |
Experience Close: experience-close
Fired when the Experience is closed, This event is fired when the user closes the Experience.
hushly('bind', 'experience-close', function(options) { // your integration code for experience-close event });
Attribute | Description | Experience | Hub |
assetId | Id of the Asset the user is interacting with | ✓ | |
assetName | Name of the Asset the user is interacting with | ✓ | |
experienceId | Id of the Experience the user is interacting with | ✓ | |
experienceName | Name of the Experience the user is interacting with | ✓ | |
triggerType | Type of Trigger (ExitIntent/Click...) | ✓ | |
contentRuleId | (Optional) Id of the Content Personalization Rule | ✓ |
Anonymous Download: anonymous-download
Fired when the user anonymously downloads an Asset at the Experience or Stream level.
hushly('bind', 'anonymous-download', function(options) { // your integration code for anonymous-download event });
Attribute | Description | Experience | Hub | ABM Page |
assetId | Id of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetName | Name of the Asset the user is interacting with | ✓ | ✓ | ✓ |
assetType | Asset Type the user is interacting with | ✓ | ||
experienceId | Id of the Experience the user is interacting with | ✓ | ||
experienceName | Name of the Experience the user is interacting with | ✓ | ||
streamId | Id of the Stream the user is Interacting with | ✓ | ✓ | |
streamName | Name of the Stream the user is interacting with | ✓ | ✓ | |
triggerId | Id of the trigger | ✓ | ||
triggerType | Type of Trigger (ExitIntent/Click...) | ✓ | ||
widgetId | Id of the Widget the user is interacting | ✓ | ||
contentRuleId | (Optional) Id of the Content Personalization Rule | ✓ | ||
visitor | ABM Visitor accessing the Page | ✓ | ||
account | ABM Account | ✓ | ||
page | ABM Page | ✓ |
Search: search
Fired when the user performs a search in the Hub.
hushly('bind', 'search', function(options) { // your integration code for search event });
Attribute | Description | Experience | Hub |
query | The search query is entered by the user. | ✓ | |
filters | V2Hub Only - The filters selected by the user in a JSON format.{ | ✓ |
ABM CTA Click: abm-cta-click
Fired when the user clicks on the CTA Button.
hushly('bind', 'abm-cta-click', function(options) { // your integration code for abm-cta-click event });
Attribute | Description | ABM Page |
visitor | ABM Visitor accessing the Page | ✓ |
account | ABM Account | ✓ |
page | ABM Page | ✓ |
Stream View: stream-view
Fired when the user views a Stream on the Hub.
hushly('bind', 'stream-view', function(options) { // your integration code for stream-view event });
Attribute | Description | Hub |
streamId | Id of the Stream the user is interacting with | ✓ |
streamName | Name of the Stream the user is interacting with | ✓ |
Hub CTA Click: hub-cta-click
Fired when the user clicks on a Hub CTA.
hushly('bind', 'hub-cta-click', function(options) { // your integration code for hub-cta-click event });
Attribute | Description | Hub | ABM Page | Embed Stream |
ctaName | Name of the CTA | ✓ | ✓ | ✓ |
ctaUrl | URL of the Page the user would be taken to on-click | ✓ | ✓ | ✓ |
embedStreamId | Id of the Embed Stream the user is interacting with | ✓ | ||
embedStreamName | Name of the Embed Stream the user is interacting with | ✓ | ||
source | Source page where the user clicked the CTA [Stream / ABMPage / Embed Stream] | ✓ | ✓ | ✓ |
streamId | Id of the Stream the user is interacting with | ✓ | ✓ | ✓ |
streamName | Name of the Stream the user is interacting with | ✓ | ✓ | ✓ |
Disable Exit Intent Trigger
Disables the Exit Intent Triggers for all the Experiences on the Page.
Usage:
hushly('disableExitIntentTriggers')
Exclude Forms from Form Submission Tracking
All the form submissions on the landing page are being tracked, sometimes this may not provide accurate information to the customers, as there can be other forms on the same landing page like search forms, chatbot forms, etc.
To exclude some forms from being tracked.
Usage:
hushly('excludeForms', 'form1, form2');
Publish an event to activate an Experience
When setting up an experience you have the option of using javascript event triggers. This means you can have your experience triggered by any custom event on your website. This can be when your visitor clicks a button or comes from a certain source - or any other event you need.
To trigger an experience, you need to call a Hushly function.
Usage:
hushly("event", "my-event-name");
Common Use Cases
Trigger an experience when clicking an element
To trigger an experience on a click, you first need to create a click handler for the element that should be clicked. In this example, we'll have the user click a button:
<button id="download-content" type="button">Download Whitepaper</button>
Using the ID of this button, we can easily create a click handler:
$('#download-content').click( function() { hushly('event', 'download-white-paper'); });
That's it. The experience will now be triggered when the button is clicked.
Trigger a campaign for specific referrers
Triggering an experience for certain referrers can be useful if you want to target visitors from a certain source. In this example, we'll target all visitors from google.com. First, we'll use the referrer property in JavaScript:
This property will return a string containing the URL of the referral page. If that page was google.com, the string could look like this:
We can then use JavaScript to look at the value of this property for each visitor - and to trigger the Feedback campaign if the string contains a certain value. In this case, we'll look for the value 'google.com':
if (document.referrer.indexOf('google.com') > -1) { hushly('event', 'download-white-paper'); }
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article