pnt.md

PNT

Do not delete this gist. Consider using window loaded for GoNorth going forward (look into.)

Add PNT Snippets

<script>
    document.querySelectorAll('form')[0].classList.add('pnt')
</script>

<script>
    document.getElementById('form').classList.add('pnt')
</script>

<script>
    document.getElementsByClassName('form')[0].classList.add('pnt')
</script>

When to fire a tag in GTM

Global Site Tag > Google Event Snippet

• on GOOGLE EVENT SNIPPET, setup to fire SITE TAG before GES

PNT > GoNorth

• on GONORTH, setup to fire PNT before GoNorth

GoNorth - Marketo

• pntQuery (Not sure what this means)

Descriptions & Workflow

Workflow

1. If we have the ability to edit the HTML code of the form in question, add class="pnt" directly to the element
2. If form has an existing ID, use that by adding a 'selector' property in the GNL tracking code
3. If form has an existing class that is unique enough, use that by adding a 'selector' property in the GNL tracking code
4. If none of the above are true, use Javascript to add pnt class

Descriptions

• only use selector or pollforform, redundant

selector: [‘.form-class’]

• This is used when you're trying to target a form to add pnt. Use this when other methods of adding pnt are not working.

leads.pollForForm(‘.late-form’)

• When script can't collect the form data. (No leads showing in data storage.)
• ** IF USING POLLFORFORM AND SELECTOR, YOU CAN JUST USE POLLFORFORM AND REMOVE THE SELECTOR **

leads.submitOn(‘click’, ‘a.link-submit’)

• Use this when form-inquiry isn't being passed or if the submit button is not a standard one. Simply target the submit button, replace a.link-submit to class or id of submit button.

ignoreFields

• If you want to ignore fields such as password or other personal information

More Add PNT Snippets

<script>
    document.getElementsByTagName("element")[0].classList.add('pnt');
</script>

<script>
    document.getElementById('form_id').classList.add('pnt')
</script>

<script>
    document.querySelector('firstElement')[0].classList.add('pnt')
</script>

<script>
    document.querySelectorAll('allElementsOfType')[0].classList.add('pnt')
</script>

<script>
    document.querySelectorAll('form')[3].classList.add('pnt')
</script>

Hit all elements of

<script>
var forms = document.querySelectorAll('form')
for (var i = 0; i < forms.length; i++) {
  forms[i].classList.add('pnt')
}
</script> 

Form Tracking Testing

1. Open incognito browser
2. Open dev pane > network tab > check preserve log
3. Visit page > Network tab > see 2x “visit” entries
4. Go to page with form
5. Application tab > Local storage > site.com
6. Type into forms and notice lead_ keys show up with your data in value column
7. Go back to network tab > submit form > see 2x “form-inquiry” go through

Testing GA Event Tracking

Example: https://www.illinoissafety.com/ Setup tracking for “SIGN UP” link in NAV and content When clicked submit event

To test this: (Testing in Firefox right now)

1. Load the page and open devpane
2. Target the link in the inspector pane
3. Open network pane
4. Click the link - See "200 - collect?v=...."
5. Click the collect file and see in the right pane “Params”
6. (Based on the category/action/ etc…):

T: event
ec: “Sign Up Via Click” 
Ea: Sign up for class

Old PNT Snippets

$( "form" ).addClass( "pnt" );
jQuery( "form" ).addClass( "pnt" );
pntjQuery( "form" ).addClass( "pnt" );
document.getElementsByClassName('form')[0].classList.add('pnt');

jQuery Loop Version 1

<script>
jQuery(function(){
    (function loop() {
        setTimeout(function () {
            var f = jQuery('form');
            if (f[0]) {
                f.addClass('pnt');
                
            } else {
                loop();
            }
        }, 250);
    }());
});
</script>

jQuery Loop Version 2

<script>
$(function() {
    var loop = setInterval(function () {
            var $form = $('form')
        if ($form.length) {
            $form.addClass('pnt')
            clearInterval(loop)
        }
    }, 250);
});
</script>