Logic Hop Goals : Indigo

Quick Reference
Overview
Anatomy of a Goal
Creating a Goal
Goal Groups
Using Goals
Set/Unset Goals from Anchor Links
Set/Unset Goals from HTML Elements
Set/Unset Goals with Javascript
Code Samples
Set Goals with PHP
Deleting a Goal

Overview

Goals are how Logic Hop stores user actions. You create a goal for any event or action you would like to store and track. When a goal is set for a user it is accessible for their current and future visits to your site.

Goals can be used within conditions to dynamically display content to a specific user or redirect them to a different page.

Uses for Goals include:

Did the user visit your site by clicking a specific link
Has the user purchased your product
Did the user abandon a shopping cart
Has the user viewed your overview video
Which options on a survey did the user select

Goals can be triggered on page load, when a condition is met or by a combination of events, including Javascript events. This allows for goals to be easily integrated with third-party plugins.

Goal Lifespan

Goals are stored by Logic Hop and associated with a user by a single cookie. Logic Hop Goals can be stored for up to a year per user. As with all cookies, Logic Hop data is specific to the user and their browser. If a user clears their cookies, the data will be disassociated with that browser.

Anatomy of a Goal

Goal Example

Goal Title
- Used to generate Goal Slug – Example: newsletter-signup
Goal Description
- Describes Goal functionality
Lead Score
- Value to increment Lead Score by when goal is completed
- Learn more about Lead Scores
Lead Score Increment Options
- Increment on every complete
- Increment on first complete only
- Increment on first complete each session
Logic Tag
- Logic Tag to copy & paste into WordPress content
Goal Slug
- WordPress slug – Used when working with Javascript & PHP
Goal Group
- Group(s) goal is associated with for segmentation (Optional)

Creating a Goal

Creating and managing goals with Logic Hop is similar to creating posts with WordPress.

Step 1
- Click Goals under the Logic Hop menu in your WordPress Dashboard
Step 2
- Click Add New or click the title a goal to edit
Step 3
- Enter a title and description for the goal
  - It’s best to use short, descriptive titles such as Newsletter Signup
Step 4
- Click Publish

Congratulations! Your Goal is now ready for use.

Note: Similar to WordPress Post and Page titles, the goal title becomes the slug for your goal. If you are using Javascript Tracking, the slug may be visible in the source code of your page. For example, a goal titled Newsletter Signup may appear as the following Javascript function: logichop_goal(‘newsletter-signup’);

Goal Groups

Goal Groups allow you to associate two or more goals together as a group. A single goal from a group can be active for a user at any given time. If the user is added to another goal within the group any other active goal from that group will be removed for the user.

For example:

You have the following three goals in a group titled User Type
- Marketer
- Designer
- Developer
When the user visits a blog post about marketing, you assign them the Marketergoal
- The user now has the Marketer goal
The user completes a form identifying themselves as a designer, you assign them the Designergoal
- The Marketer goal is automatically removed
- The user now has the Designer goal

A goal can be assigned to multiple groups. This can provide advanced segmentation scenarios.

Note Goal Groups are optional. Goals do not need to be assigned to a group.

Working with Goal Groups

Add a New Group to a Goal

Type a group name into the Goal Group input field and click Add
Click Publish or Update to save your goal

Add an Existing Group to a Goal

Click Choose from the most used groups
Click on the name of the group(s) you’d like to add
Click Publish or Update to save your goal

Remove a Goal from a Group

Click the (x) icon to the right of the Goal Group you’d like to remove
Click Publish or Update to save your goal

Using Goals

Set/Unset Goals from Anchor Links

Goals can be set and deleted when a user clicks on any <a> tag by simply adding a query string and Goal Slug to the URL.

Set a Goal from an Anchor Link

To set a Goal from an anchor link, add the query string ?logichop_goal= followed by the Goal Slug.

The following anchor link will set the Newsletter Subscribed goal when the link is clicked:

<a href="https://your-domain.com/about/?logichop_goal=newsletter-subscribed"

Unset a Goal from an Anchor Link

To unset, or delete, a Goal from an anchor link, add the query string ?logichop_goal_delete= followed by the Goal Slug.

The following anchor link will delete the Newsletter Subscribed goal when the link is clicked:

<a href="https://your-domain.com/?logichop_goal_delete=newsletter-subscribed"

Set a Goal and Unset a Goal from an Anchor Link

The following anchor link will set the Newsletter Subscribed goal when the link is clicked and delete the Just Browsing goal:

<a href="https://your-domain.com/?logichop_goal=newsletter-subscribed&logichop_goal_delete=just-browsing"

Set/Unset Goals from HTML Elements

Goals can be set based user interaction with HTML elements, such as clicking on a link. Simply add one of the following Goal Trigger CSS Classes along with a data-goal attribute with the Goal Slug.

Goal Trigger CSS Classes

logichop-click
logichop-dblclick
logichop-mouseenter
logichop-mouseleave
logichop-keypress
logichop-keydown
logichop-keyup
logichop-submit
logichop-change
logichop-focus
logichop-blur
logichop-load
logichop-resize
logichop-scroll
logichop-unload

The following example sets the goal Is a Marketer when a user clicks the link:

<a href="/marketing" class="logichop-click" data-goal="is-a-marketer">Marketing</a>

Delete a Goal from HTML Elements

To delete a goal using Goal Trigger CSS Classes add the data-delete=”true” attribute to your HTML element.

The following example deletes the goal Is a Marketer when a user clicks the link:

<a href="/marketing" class="logichop-click" data-goal="is-a-marketer" data-delete="true">Marketing</a>

Set/Unset Goals with Javascript

Goals can be set and unset with Javascript for use in themes and plugins. Pass a goal slug or ID into the __logichop_goal() or logichop_goal_delete()__ function.

The following example sets the newsletter-signup goal for the current user:

logichop_goal( 'newsletter-signup' );

The following example deletes the newsletter-signup goal for the current user:

logichop_goal_delete( 'newsletter-signup' );

Code Samples

Copy and paste the code samples into you pages and posts. Make sure to update the Goal Slug to match the slug of your goal.

Javascript samples require jQuery and use the default WordPress jQuery prefix.

Set Goal When Link is Clicked

The following code triggers a Goal when any HTML element with the class my-outbound-link is clicked. This works with link or any other element. Replace outbound-click with your Goal Slug.

<a href="https://logichop.com" class="my-outbound-link">Check out Logic Hop!</a>

<script>
    jQuery('.my-outbound-link').click(function () {
        logichop_goal( 'outbound-click' );
    });
</script>

Set Goal When YouTube Video Playback Starts

The following code uses the YouTube Iframe API and triggers a goal when the video is played. Replace ‘##YOUTUBE VIDEO ID##’ with your YouTube Video ID and video-viewed with your Goal Slug.

<div id="player"></div>

<script>
    var tag = document.createElement('script');
    tag.src = 'https://www.youtube.com/iframe_api';
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
    function onYouTubeIframeAPIReady () {
        new YT.Player('player', {
            videoId: '##YOUTUBE VIDEO ID##',
            events: {
                'onStateChange': function (e) {
                    if (e.data == 1) {
                        logichop_goal( 'video-viewed' );
                    }
        }
            }
        });
    }
</script>

Set Goal When Users Scrolls Within 100 Pixels of Page Bottom

The following code triggers a Goal when the user scrolls within 100 pixels of the bottom of the page. Replace scroll-bottom with your Goal Slug.

<script>
    jQuery(window).scroll(function() {
        if (jQuery(window).scrollTop() + jQuery(window).height() > jQuery(document).height() - 100) {
                logichop_goal( 'scroll-bottom' );
        }
    });
</script>

Set Goals with PHP

Goals can be set with PHP for use in themes and plugins. Pass a goal slug or ID into the __$logichop->set_goal()__ function. When the goal is set, true is returned. If there was a problem setting the goal, false is returned.