The first step is to create a goal through the UI. Name it whatever you want (for example "Mailing List Signup" or "Add to Basket") and give it a unique handle.
Triggering goals
Now you want to trigger that handle in your code - to do that simply call:
\ Thoughtco \ StatamicABTester \ Facades \ Goal :: completed ( ' your-goal-handle ' )
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
\ Thoughtco \ StatamicABTester \ Facades \ Goal :: completed ( ' your-goal-handle ' )
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
If your goal is completed on a page, you may just want to use the antlers tag:
{ { ab : goal : completed handle = " your-goal-handle " } }
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
{ { ab : goal : completed handle = " your-goal-handle " } }
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
Alongside the handle, we also log the time the goal was completed, the user's IP, and their ID if they are logged in.
You can also (optionally) record failures, if your test requires it:
\ Thoughtco \ StatamicABTester \ Facades \ Goal :: failed ( ' your-goal-handle ' )
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
\ Thoughtco \ StatamicABTester \ Facades \ Goal :: failed ( ' your-goal-handle ' )
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
{ { ab : goal : failed handle = " your-goal-handle " } }
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
{ { ab : goal : failed handle = " your-goal-handle " } }
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
Javascript Helper
If you need to trigger goals from Javascript, include the {{ ab:js }} in your layout, then:
To register a hit on an experiment:
abTester . hit ( ' experiment-id ' , { custom : ' data ' } )
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
abTester . hit ( ' experiment-id ' , { custom : ' data ' } )
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
To register a goal completed:
abTester . completed ( ' goal-id ' , { custom : ' data ' } )
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
abTester . completed ( ' goal-id ' , { custom : ' data ' } )
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
To register a goal failure:
abTester . failed ( ' goal-id ' , { custom : ' data ' } )
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy
abTester . failed ( ' goal-id ' , { custom : ' data ' } )
{ copied = false; }, 3000); $copy($el.parentNode.querySelector('pre').innerText)"
x-text="copied ? 'Copied' : 'Copy'"
>Copy