Monthly Archives: October 2016

Live Chat Integration: Intercom and Zingtree

z-integrations-blog

Live chat is an incredibly useful way to connect to our customers, both for offering support and for getting insights into new product ideas we may never have thought of ourselves. We are happily using Intercom, which allows us to track chat and email conversations with each customer.

For technical inquiries, we use Zingtree Data Entry forms to get the tree ID, node and URL of any problem reports. To save our customers some typing, and make it faster for us to answer questions, we’ve built our own Contact page using Zingtree. For technical and sales inquiries, the decision tree leads to an end point that opens Intercom chat, with information about the problem already pre-populated.

Once you submit a technical question, here’s what appears in Intercom:

Intercom chat with Zingtree

Demos:

Requirements:

  • Your tree must be embedded on your site.
  • You need to have the Intercom chat client in place on the page that contains your tree.

How to open an Intercom chat session, and include the Zingtree transcript and data entry:

  1. Go to Overview.
  2. Edit the node you want to trigger the chat, and  set the Parent Action to Intercom: New: #session#.When a customer lands on this node, this Parent Action is triggered.
  3. On the hosting page, include this script before the </body> tag:
    <script src="//zingtree.com/api/chat/intercom.js"></script>

It’s that easy!

Source Code:

From the Zingtree Gallery, you can see two examples:

Decision Tree Analytics: About Traffic Map Reports

adding-search-to-decision-trees-6

Zingtree has powerful built-in analytics. In this series, we’re taking a closer look at some of these in-depth reports and how they help you learn even more about how customers use your trees. 


Traffic Map Reports

The Traffic Map report shows a visual overview of the amount of traffic to each node in your particular decision tree. Set in the Zingtree Designer view, you can quickly access a complete view of the content in your decision tree nodes, as well as a breakdown of the traffic to each, shown in both number of clicks and percentage of total traffic.

To access the this report, go to Overview > Reports and select Traffic Map from the dropdown menu. You can specify an exact date range to pull the results from before clicking “Show Report.”

Because your report generates automatically in the Zingtree Designer, you can easily see how much traffic your tree nodes received at-a-glance — the thicker, heavier lines indicate more traffic, while the thinner lines show the least visited nodes.

Select “Buttons” to show or hide button labels from your view, depending on your preference.

If you’re looking at a more complex tree, get a closer or further view with the Zoom In / Zoom Out buttons.

And use the scroll bar to pan up / down or left / right as needed, which is also particularly helpful for larger decision trees.


Learn more about our powerful reports and analytics:

Reach out to us any time with questions!

Google Analytics for Zingtree: How to Integrate Decision Trees With GA

Google Analytics is an industry-leading web analytics tool that gives you greater insight as to how users are interacting with just about any online or mobile property. Zingtree can use Google Analytics to allow you to get even more robust and powerful tracking data.

As part of this series, we will guide you through some of the Google Analytics basics, as well as information about how you can integrate Zingtree into your reporting process in a strategic way.

Getting Started

To integrate Zingtree with Google Analytics, you’ll need just two things: a Zingtree account and an existing Google Analytics account. If your organization doesn’t currently use Google Analytics, you can create a brand new account for free. Please follow these easy instructions to integrate your trees with Google Analytics:

http://blog.zingtree.com/advanced-decision-tree-tracking-with-google-analytics/

Pro Tip! If you’d like to track your trees separate from your main website or support portal data, please set up a new Google Analytics property and use that to integrate with Zingtree.

Key Metrics: Data to Track

Google Analytics offers a lot of features and functionality, some of which may not be relevant to your organization. However, there are several key metrics that are applicable to many using Zingtree.

See how users are interacting with your trees, including the total number of sessions (or visits) and time spent on each tree, by going to Audiences > Overview.

See what devices are utilizing your trees by heading over to Audiences > Mobile > Overview.

Use the Behavior > Overview report to see when your trees are most commonly visited. This will give you insight into the most common days that your decision trees are in use, and may help you bulk up your staff on days with consistently higher activity.

See your most popular tree nodes and more by visiting Behavior > Site Content > All Pages. For the most user-friendly view, we recommend switching the Primary Dimension from “Page” to “Page Title.”


Want more information about Google Analytics? Check out some of these resources:

https://support.google.com/analytics/answer/1008015?hl=en

https://moz.com/blog/absolute-beginners-guide-to-google-analytics

Have any questions? Please reach out to us at any time.

Form Fields: Decision Trees with Data Entry

blog-howto-2

One of the most requested features for Zingtree interactive decision trees is to have the ability to collect key customer information from users while they are navigating your tree. So, we made it happen!

With Zingtree’s data entry feature, you can do things like…

  • Add form fields to your trees (text, list boxes, check boxes, radio buttons, dates and numbers).
  • Include form data dynamically in other parts of the tree (i.e. you can ask for a name in the first node, and have that name appear in other parts of the tree).
  • Export form data into any other system, including Help Desk or CRM applications.

For example, your decision trees can gather data like this:

Example Tree

Try the Form Fields and Data Entry Demo tree from the gallery. This will ask you for some information, echo it in other parts of the tree, and finally inject it into a standard HTML form.

How to Include Data Entry Fields in your Tree

Here’s how to add a Data Entry field to a node:
  1. Edit a question node from Overview or Designer.
  2. Click Add next to Data Entry Fields.

  3. A new Data Entry field dialog appears.  Select the type of data you want to collect, and enter a variable name and a label which the end-user will see.

  4. Select Required to make this field require an entry before proceeding.
  5. For radio buttons and list boxes, you can enter the option choices as well. If you are using scoring nodes, you can enter a score variable, and a score to assign to each choice.

  6. Click Add Field when finished.

 

Inserting Form Field Data into Other Parts of the Tree

Once the end-user adds data to a form field and then clicks a button, this data can appear anywhere in the tree’s content, question or title areas. The trick is to use the variable name, surrounded by # characters. For example, after adding a text input field named name,  insert text like this into a node to show the value of name:

Hello #name#! Welcome back.

The #name# part will be replaced with whatever was entered previously into the name field.

Injecting Zingtree Form Data into Other Systems

Once your form fields are set up and your tree is running, the entered data can be injected into any other form.  Here’s how to do it:

  1. Make sure the variable names in your Zingtree form match the variable names on the form you want to inject data into.
  2. When opening the URL for the destination form, make sure to include &session_id=#session# in the link URL.
  3. In the destination form, include this piece of code:
    <script id="zingtree_field_id" value="session_data" src="//zingtree.com/api/zingtree.js">
    </script>

When the destination form is opened, it will include the data from the Zingtree session in the fields that match.

The Form Fields and Data Entry gallery tree shows a full example. Click all the way through, and you’ll see an HTML page with Zingtree forms data present.

Misc Notes

  • The form fields button in the editor is not available in Designer. You’ll need to use Overview, Edit Node to access it.
  • Tech note: If you’re hand-coding the HTML for your forms, each form element must have a class of zt-data to be recognized and saved.

Any questions? Reach out to us at any time.

Decision Tree Analytics: About the Session List Report

Zingtree has powerful built-in analytics capabilities. In this series, we’re taking a closer look at some of these in-depth reports and how they help you learn even more about how customers are using your trees. 


Session List Reports

This Zingtree report allows you to quickly and easily see every session for any given decision tree in your organization. Broken down in an easy-to-absorb list, you can navigate to each specific end-user session to learn more about how people use your tree, as well as get an overview of the amount of time users spent.

To access the Session List report, go to Overview > Reports and select Session List from the dropdown menu. You can specify an exact date range to pull the results from before clicking “Show Report.”

Once the report has generated, you can filter by Source/Agent to be shown sessions specific to an agent or other source. The Session List will give you a complete overview of every session within your filtered view, showing duration, clicks, results, and score when applicable.

The icons in your Results column will show you the exact end-result of each session: Customer was given a solution, Inconclusive, or Customer was unable to solve the problem.

Clicking on a specific Session # in the far left column will allow you to see complete click-by-click details for every node visited, as well as all data collected from that session.


Learn more about our powerful reports and analytics:

Reach out to us any time with questions!

It’s All About Context: Seeing More with History & Breadcrumbs

Making sure you are seeing the full context is best for complete understanding. Our interactive decision trees come with advanced hosting/publishing capabilities that allow your customers and end-users to easily see, and then understand, where they are in the process.

History: See Every Step

Our History feature allows your customers to view every step taken while using your decision tree. With this publishing option, users can easily click on a link and go back to any previous node visited.

When implemented, it will display the path history information like this:

history

Breadcrumbs: Your Tree’s Flow

Our Breadcrumbs feature shows the exact progression of nodes that appeared during your customer’s journey through your tree. With this publishing option, users can also click on any link and automatically jump back to another point in their decision tree journey.

When implemented, it will display the sequence information like this:

breadcrumbs

Setting Up History & Breadcrumbs

1. Login to your Zingtree account, go to My Trees and head to the decision tree you want to publish with history and/or breadcrumbs shown.

2. Click to open Publish.

3. Select the tabbed “Have Zingtree host your Tree” option, then click on the Advanced Hosting Options button shown below.

4. Select Show History and/or Show Breadcrumbs, depending on the information you’d like to display.

That’s it! Your customers and end-users will now see their decision tree history and breadcrumbs, and be able to easily identify where they are (and where they’ve been) in your tree.


Any questions? Please reach out anytime!

Please Note: History is available only for Zingtree-hosted trees and the Agent Portal. Breadcrumbs are for Zingtree-hosted trees only.

New Transition Effects: Fade and Slide

customize-blog1

Our customer Mike P.  is a graphic designer, and he suggested we add some special effects to our trees.  We thought this would be cool, and with a little research and a few days of coding, we’re happy to announce two new transition effects: Fade and Slide. You can also set a speed for each effect.

Here’s what the Fade effect looks like:

And here’s the Slide effect:

Here’s how to add these effects to your trees:

  1. Go to the Publish tool, and choose Advanced Options for either Zingtree Hosted or Embedded.
  2. Choose an effect and a speed from the menu:
  3. Try it!

Got any other ideas for special effects? Let us know!

P.S. Thanks Mike!

Managing a “Forest” of Decision Trees Using Tagging

As Zingtree is getting more and more larger companies as clients, we’ve received a lot of requests for being able to better manage a large library of trees. Some customers are planning on creating hundreds or even thousands of trees.  Our latest update makes it even easier to locate and organize large decision tree “forests.”

First Step: Tag Your Trees!

If you haven’t done so already, you should tag your trees. A tag is like a category – any tree can have multiple tags. This is the first step to being better organized.

To tag a tree:

  1. Start at My Trees, and select a tree.
  2. Go to the Settings tool.
  3. Enter a tag, or pick from a list of existing tags:
  4. Click Update Settings to save.

Locating Trees by Tag

Once you’ve tagged your trees, Zingtree has a few different ways to make it easy to stay organized:

  • For Authors: Filter your list of trees by tag in the My Trees tool.
  • For Authors: Use Tree Search to enter a list of tags to find trees that have any or all of the desired tags.
  • For Agents or End-Users: Authors can use new Macros to present a list of trees to an end-user that contain any or all tags in a list.

Authors: Filter by Tag in the My Trees Tool

When you use the My Trees tool, you’ll see an option at the top right for Has Tag. This contains a list of all the decision tree tags in use for your organization:

Select a tag, and you’ll see all the trees that have that tag.

Authors: Use Tree Search

For more powerful searching using tags, use the Search button in My TreesYou have four different search options. These two apply to tag matching:

  • Match Tree Tags (any): Enter a comma separated list of tags. The results return a list of trees that include any of the tags in the list.
  • Match Tree Tags (all):  Enter a comma separated list of tags. The results return a list of trees that include all of the tags in the list.

Using Macros to Present Lists of Trees by Tag

Inside the content area of any tree, you can insert a special macro to show all the trees in your organization that match any or all tags in a list. You can examine the Tree Tag Demo in the Zingtree Gallery to see how this is done.

The two macros you can insert into the content area are:

  • ##treetaglist-any: tags##
  • ##treetaglist-all: tags##

In the examples above, replace tags with a comma separated list of tags. treetaglist-any will return a list of trees that match any of the tags in the list.  treetaglist-all returns only those trees that contain all the tags in the list.

Examples:

#treetaglist-any: demo,gallery## – matches trees that are tagged with either demo or gallery.

#treetaglist-all: demo,gallery## – matches trees that are tagged with both demo and gallery.

Shortcut: When editing a node, you can insert these macros from the Templates editing tool in the Content editor:

Bonus: Dynamic Lists

When publishing a tree, if you add a tags= parameter to the tree URL, you can dynamically import the list of tags used by the tree macros.  Be sure to separate the tags with | characters. Example:

http://zingtree.com/host.php?style=panels&tree_id=287688184&tags=demo|gallery

Inside the tree, this macro will list trees that have tags that match ALL the tags in the passed-in tags= parameter:

##treetaglist-all:##

This macro will list  trees that have tags that match ANY tags in the passed-in tags= parameter:

##treetaglist-any:##

Node #6 from the Tree Tag Demo in the Zingtree Gallery shows how this is done. Try it!

Integrations: Dynamic Tree Lists by Passing Tags

Our customers Corey and John asked for a way to send a list of tags from their Help Desk system, and open a specific tree or show a list of matching trees. Here’s how to do it.

  1. Go to My Trees, and click Search.
  2. Use one of the tree tag searches.
  3. In the search results, click the Integration Link Template button at the bottom of the page.  This will show you a URL to use as the basis for linking from your Help Desk/CRM system to the Zingtree search.  You can add style parameters to this link from the Advanced Hosting Options page as well to ensure your trees appear with the desired look and feel.

Example:

This link is derived from a search in the Zingtree Gallery. The search, style and transition parameters are changed from the template example to customize the result.

http://zingtree.com/host-trees.php?jump=1&key=6a103737e44e4aa6e1e4b6b0bcb46f83&type=treetag-all&search=demo,gallery&style=panels&transition=fade

Credits

Thanks to Corey, John, Elise, Trey and a few others for sharing their tree management needs.  If you have a suggestion, comment, or question, please reach out and talk to us!