Difference between revisions of "ATC/Current/SDK/Display icons in the Journey gadget"
From Genesys Documentation
DannaShirley (talk | contribs) (Published) |
m (Text replacement - "Genesys Cloud" to "Genesys Cloud CX") |
||
(8 intermediate revisions by 3 users not shown) | |||
Line 3: | Line 3: | ||
|DisplayName=Display icons in the Journey gadget | |DisplayName=Display icons in the Journey gadget | ||
|TocName=Display icons in the Journey gadget | |TocName=Display icons in the Journey gadget | ||
− | |Context=Learn how to use the SDK to display icons for tracked | + | |Context=Learn how to use the SDK to display icons for tracked visitor behavior on the Journey map. |
+ | |Dimension=DevTracking | ||
|ComingSoon=No | |ComingSoon=No | ||
− | |Platform= | + | |Platform=PureConnect, GenesysCloud, GenesysEngage-cloud |
|Section={{Section | |Section={{Section | ||
+ | |alignment=Vertical | ||
+ | |structuredtext={{NoteFormat|1=This article only applies to customers using {{Link-AnywhereElse|product=ATC|version=Current|manual=AdminGuide|topic=About_web_chats|display text=web chat}}. If you are a Genesys Cloud CX customer, we encourage you to use the new {{Link-AnywhereElse|product=ATC|version=Current|manual=AdminGuide|topic=About_web_messaging|display text=web messaging}} feature to replace web chat.|2=}}<br /> | ||
+ | |Status=No | ||
+ | }}{{Section | ||
|sectionHeading=About the icons | |sectionHeading=About the icons | ||
|anchor=About icons | |anchor=About icons | ||
Line 12: | Line 17: | ||
|Media=Image | |Media=Image | ||
|image=IconColors.png | |image=IconColors.png | ||
− | |structuredtext=Use the <code>{{Link-SomewhereInThisVersion|manual=SDK|topic=Record|display text=ac('record')}}</code> method to display | + | |structuredtext=Use the <code>{{Link-SomewhereInThisVersion|manual=SDK|topic=Record|display text=ac('record')}}</code> method to display a {{MINTYDOCSPRODUCT}} icon on the {{Link-SomewhereInThisVersion|manual=AdminGuide|topic=Customer_journey_map}} when a visitor completes a tracked behavior. |
===Available icons=== | ===Available icons=== | ||
Line 26: | Line 31: | ||
|structuredtext=[[File:ShoppingCartEx.png]] | |structuredtext=[[File:ShoppingCartEx.png]] | ||
− | This code example shows how to use <code>{{Link-SomewhereInThisVersion|manual=SDK|topic=Record|display text=ac('record')}}</code> to display the {{Link-SomewhereInThisVersion|manual=SDK|topic=Display_icons_in_the_Journey_gadget|anchor=PurchaseIcons|display text=Product added}} icon in the {{Link-SomewhereInThisVersion|manual=AdminGuide|topic=Customer_journey_map}} when a | + | This code example shows how to use <code>{{Link-SomewhereInThisVersion|manual=SDK|topic=Record|display text=ac('record')}}</code> to display the {{Link-SomewhereInThisVersion|manual=SDK|topic=Display_icons_in_the_Journey_gadget|anchor=PurchaseIcons|display text=Product added}} icon in the {{Link-SomewhereInThisVersion|manual=AdminGuide|topic=Customer_journey_map}} when a visitor adds a t-shirt to their shopping cart.<source lang="javascript"> |
ac('record', 'product_added', [optionalExtraDataObject] | ac('record', 'product_added', [optionalExtraDataObject] | ||
ac('record', 'product_added', { name: 't-shirt', id: 'hkds9d8j', price: '$45.45' }); | ac('record', 'product_added', { name: 't-shirt', id: 'hkds9d8j', price: '$45.45' }); | ||
Line 42: | Line 47: | ||
!Name | !Name | ||
{{!}}- | {{!}}- | ||
− | {{!}}[[File:Product added to cart.png | + | {{!}}[[File:Product added to cart.png{{!}}left{{!}}frameless{{!}}50x50px]] |
{{!}}Product added to cart | {{!}}Product added to cart | ||
− | {{!}} | + | {{!}}Visitor added a product to their shopping cart. |
{{!}}"product_added" | {{!}}"product_added" | ||
{{!}}- | {{!}}- | ||
− | {{!}}[[File:Product removed from cart.png | + | {{!}}[[File:Product removed from cart.png{{!}}left{{!}}frameless{{!}}50x50px]] |
{{!}}Product removed from cart | {{!}}Product removed from cart | ||
− | {{!}} | + | {{!}}Visitor removed a product from their shopping cart. |
{{!}}"product_removed" | {{!}}"product_removed" | ||
{{!}}- | {{!}}- | ||
− | {{!}}[[File:Checkout successful.png | + | {{!}}[[File:Checkout successful.png{{!}}frameless{{!}}50x50px]] |
{{!}}Checkout complete | {{!}}Checkout complete | ||
− | {{!}} | + | {{!}}Visitor completed the purchase of the items in their shopping cart. |
{{!}}"product_purchased" | {{!}}"product_purchased" | ||
{{!}}} | {{!}}} | ||
Line 62: | Line 67: | ||
|anchor=FormIcons | |anchor=FormIcons | ||
|alignment=Vertical | |alignment=Vertical | ||
− | |structuredtext={{NoteFormat|You can display the icons in this section | + | |structuredtext={{NoteFormat|You can display the icons in this section using <code>{{Link-SomewhereInThisVersion|manual=SDK|topic=Record|display text=ac('record')}} </code>or auto form tracking.|}} |
{{{!}} class="wikitable" | {{{!}} class="wikitable" | ||
!Icon | !Icon | ||
Line 69: | Line 74: | ||
!Name | !Name | ||
{{!}}- | {{!}}- | ||
− | {{!}}[[File:Form submitted.png | + | {{!}}[[File:Form submitted.png{{!}}frameless{{!}}50x50px]] |
{{!}}Form submitted | {{!}}Form submitted | ||
− | {{!}} | + | {{!}}Visitor submitted a form. |
{{!}}"form_submitted" | {{!}}"form_submitted" | ||
{{!}}- | {{!}}- | ||
− | {{!}}[[File:Form abandoned.png | + | {{!}}[[File:Form abandoned.png{{!}}frameless{{!}}50x50px]] |
{{!}}Form abandoned | {{!}}Form abandoned | ||
− | {{!}} | + | {{!}}Visitor navigated away from a form before completing it. |
{{!}}"form_abandoned" | {{!}}"form_abandoned" | ||
{{!}}} | {{!}}} | ||
Line 91: | Line 96: | ||
!Name | !Name | ||
{{!}}- | {{!}}- | ||
− | {{!}}[[File:Search.png | + | {{!}}[[File:Search.png{{!}}left{{!}}frameless{{!}}50x50px]] |
{{!}}Searched | {{!}}Searched | ||
− | {{!}} | + | {{!}}Visitor searched for the string shown in the tooltip. |
{{!}}"search_performed" | {{!}}"search_performed" | ||
{{!}}} | {{!}}} |
Latest revision as of 21:28, November 9, 2021
This topic is part of the manual Journey JavaScript SDK for version Current of Genesys Predictive Engagement.
Contents
Learn how to use the SDK to display icons for tracked visitor behavior on the Journey map.
Important
This article only applies to customers using web chat. If you are a Genesys Cloud CX customer, we encourage you to use the new web messaging feature to replace web chat.About the icons
Use the ac('record')
method to display a Genesys Predictive Engagement icon on the Visit journey map (admin view) when a visitor completes a tracked behavior.
Available icons
Code example
This code example shows how to use
ac('record')
to display the Product added icon in the Visit journey map (admin view) when a visitor adds a t-shirt to their shopping cart.ac('record', 'product_added', [optionalExtraDataObject]
ac('record', 'product_added', { name: 't-shirt', id: 'hkds9d8j', price: '$45.45' });
Purchase-related icons
Form-related icons
Important
You can display the icons in this section using ac('record')
or auto form tracking.Icon | Tooltip text | Description | Name |
---|---|---|---|
![]() |
Form submitted | Visitor submitted a form. | "form_submitted" |
![]() |
Form abandoned | Visitor navigated away from a form before completing it. | "form_abandoned" |
Miscellaneous icons
Comments or questions about this documentation? Contact us for support!