Skip to content

Integration Guide

Muhammad Adil Shaikh edited this page Oct 9, 2020 · 14 revisions

Steps

  1. Add Template Tags
  2. Send events
  3. Synchronize Products

1. Add Template Tags

Every page should load Personide Connect JS script.

<script type='text/javascript' async src="//connect.personide.com/lib/js/$store_id"></script>

Personide Connect JS loads certain set of information from template HTML tags in following format on every page related to store.

<div class="personide_$key" style="display: none\">$value</div>

Valid Page Types

front Front or landing page

listing Listing, shop, index or catalogue page with all listed products

item Single product / item page

category Category listing or catalogue page

cart Cart or basket page

checkout All pages related to checkout inlcuding page that shows checkout confirmation

search Search page

tag Page that shows listing by a tag

other Any other page

Keys Required

user_email Logged in user's email address

user_firstname Logged in user's first name

user_lastname Logged in user's last name

page Current page type

product_id Product id if on product page

category_name Category name if on category page

tag_name Tag names if available in context

2. Inject personide connect api methods for tracking events

Methods

Events can be sent to Personide

  1. Using Personide Connect JS API event methods
  2. Using Personide Connect JS dispatch method
  3. Using direct API calls to Personide Connect server

Implicit Method

Personide Connect JS upon page loading, dispatches the page view event.

Cart Event

createCartEvent(type) where type is either add or remove

Purchase Event

createPurchaseEvent(cartDetails) where cartDetails is as per purchase event's properties example following.

Events Modeling

event: Object

event.event: String

Accepted Values $set $delete view add-to-cart remove-from-cart purchase

event.entityType: String

Accepted Values user item

event.entityId: String

Set implicitly when entityType: user

event.targetEntityType: String

Not required for $set and $delete events

Accepted Values For view event: One of the valid page types For $ events: user, item

event.targetEntityId: String

Corresponding identifier for targetEntityType

Required if event.targetEntityType is set

event.referrer: String

Page Referrer URL

Set implicitly

event.utm: Object

All available utm query parameters

event.properties: Object

When event.event: add-to-cart
{
	quantity: String
}
When event.event: purchase
{
    items: [{
        id: String,
        variation_id: String,
        categories: Array,
        price: Number, // current active price for one SKU
        quantity: Number, 
        subtotal: Number, // total amount before discounts
        total: Number // total amount after discounts
    }],
    total_amount: Number // total amount charged for all items after discounts and taxes
}

event.meta: Object

Note: Personide Connect sets meta property automatically if personide query parameter is set in url

page: String

A valid page name

strategy: String

A valid strategy name

container: String

The personide element / container that referred the target product

Accepted values hotslot, emailbox

placement: String

The personide placement identifier, either default or custom

event and targetEntityType valid combinations

event.event event.targetEntityType event.entityType
view A valid page type user
add-to-cart, remove-from-cart item user
purchase cart user
$set, $delete Not required item, user

3. Synchronize Products

Product Properties

In supported platforms like WooCommerce and Magento, data can be sent as is without converting to following standard format.

As passed to event.properties

id Unique ID within the store

title Name or title of the product

categories Array of categories

description Complete description of the product

in_stock Availability of item. Accepted Values: true, false

regular_price regular_price if set

sale_price Sale price if set

on_sale Whether the item is on sale. Accepted Valyes: true, false

url Direct permanent url to single product page

image_url Primary image permanent url