Last active
June 5, 2022 17:51
-
-
Save sahava/212fdbb6cd4d250fa97eeaa8ba693913 to your computer and use it in GitHub Desktop.
Facebook Pixel custom tag template for Google Tag Manager
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| ___INFO___ | |
| { | |
| "displayName": "Facebook Pixel", | |
| "description": "This is a template prototype for the Facebook Pixel.", | |
| "securityGroups": [], | |
| "id": "cvt_temp_public_id", | |
| "type": "TAG", | |
| "version": 1, | |
| "brand": { | |
| "displayName": "Facebook (unofficial)", | |
| "id": "brand_dummy" | |
| }, | |
| "containerContexts": [ | |
| "WEB" | |
| ] | |
| } | |
| ___TEMPLATE_PARAMETERS___ | |
| [ | |
| { | |
| "alwaysInSummary": true, | |
| "valueValidators": [ | |
| { | |
| "errorMessage": "You must provide a Pixel ID", | |
| "type": "NON_EMPTY" | |
| }, | |
| { | |
| "args": [ | |
| "^[0-9,]+$" | |
| ], | |
| "errorMessage": "Invalid Pixel ID format", | |
| "type": "REGEX" | |
| } | |
| ], | |
| "displayName": "Facebook Pixel ID(s)", | |
| "simpleValueType": true, | |
| "name": "pixelId", | |
| "type": "TEXT", | |
| "valueHint": "e.g. 12345678910" | |
| }, | |
| { | |
| "alwaysInSummary": true, | |
| "selectItems": [ | |
| { | |
| "displayValue": "PageView", | |
| "value": "PageView" | |
| }, | |
| { | |
| "displayValue": "Lead", | |
| "value": "Lead" | |
| }, | |
| { | |
| "displayValue": "CompleteRegistration", | |
| "value": "CompleteRegistration" | |
| }, | |
| { | |
| "displayValue": "Custom", | |
| "value": "Custom" | |
| } | |
| ], | |
| "displayName": "Event Name", | |
| "simpleValueType": true, | |
| "name": "eventName", | |
| "type": "SELECT", | |
| "subParams": [ | |
| { | |
| "enablingConditions": [ | |
| { | |
| "paramName": "eventName", | |
| "type": "EQUALS", | |
| "paramValue": "Custom" | |
| } | |
| ], | |
| "displayName": "Custom Event Name", | |
| "simpleValueType": true, | |
| "name": "customEventName", | |
| "type": "TEXT" | |
| } | |
| ] | |
| }, | |
| { | |
| "displayName": "Object Properties", | |
| "name": "objectProperties", | |
| "groupStyle": "ZIPPY_CLOSED", | |
| "type": "GROUP", | |
| "subParams": [ | |
| { | |
| "displayName": "", | |
| "name": "propertyList", | |
| "simpleTableColumns": [ | |
| { | |
| "valueValidators": [], | |
| "defaultValue": "", | |
| "displayName": "Property Name", | |
| "name": "name", | |
| "isUnique": true, | |
| "type": "TEXT" | |
| }, | |
| { | |
| "defaultValue": "", | |
| "displayName": "Property Value", | |
| "name": "value", | |
| "type": "TEXT" | |
| } | |
| ], | |
| "type": "SIMPLE_TABLE", | |
| "newRowButtonText": "Add property" | |
| } | |
| ] | |
| }, | |
| { | |
| "displayName": "More Settings", | |
| "name": "moreSettings", | |
| "groupStyle": "ZIPPY_CLOSED", | |
| "type": "GROUP", | |
| "subParams": [ | |
| { | |
| "help": "Facebook collects some metadata (e.g. structured data) and user interactions (e.g. clicks) automatically. Check this box to disable this automatic configuration of the pixel.", | |
| "simpleValueType": true, | |
| "name": "disableAutoConfig", | |
| "checkboxText": "Disable Automatic Configuration", | |
| "type": "CHECKBOX" | |
| } | |
| ] | |
| } | |
| ] | |
| ___WEB_PERMISSIONS___ | |
| [ | |
| { | |
| "instance": { | |
| "key": { | |
| "publicId": "access_globals", | |
| "versionId": "1" | |
| }, | |
| "param": [ | |
| { | |
| "key": "keys", | |
| "value": { | |
| "type": 2, | |
| "listItem": [ | |
| { | |
| "type": 3, | |
| "mapKey": [ | |
| { | |
| "type": 1, | |
| "string": "key" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "read" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "write" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "execute" | |
| } | |
| ], | |
| "mapValue": [ | |
| { | |
| "type": 1, | |
| "string": "fbq" | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": true | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": true | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": false | |
| } | |
| ] | |
| }, | |
| { | |
| "type": 3, | |
| "mapKey": [ | |
| { | |
| "type": 1, | |
| "string": "key" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "read" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "write" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "execute" | |
| } | |
| ], | |
| "mapValue": [ | |
| { | |
| "type": 1, | |
| "string": "_fbq_gtm" | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": true | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": true | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": false | |
| } | |
| ] | |
| }, | |
| { | |
| "type": 3, | |
| "mapKey": [ | |
| { | |
| "type": 1, | |
| "string": "key" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "read" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "write" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "execute" | |
| } | |
| ], | |
| "mapValue": [ | |
| { | |
| "type": 1, | |
| "string": "_fbq" | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": false | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": true | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": false | |
| } | |
| ] | |
| }, | |
| { | |
| "type": 3, | |
| "mapKey": [ | |
| { | |
| "type": 1, | |
| "string": "key" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "read" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "write" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "execute" | |
| } | |
| ], | |
| "mapValue": [ | |
| { | |
| "type": 1, | |
| "string": "_fbq_gtm_ids" | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": true | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": true | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": false | |
| } | |
| ] | |
| }, | |
| { | |
| "type": 3, | |
| "mapKey": [ | |
| { | |
| "type": 1, | |
| "string": "key" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "read" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "write" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "execute" | |
| } | |
| ], | |
| "mapValue": [ | |
| { | |
| "type": 1, | |
| "string": "fbq.callMethod.apply" | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": true | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": false | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": true | |
| } | |
| ] | |
| }, | |
| { | |
| "type": 3, | |
| "mapKey": [ | |
| { | |
| "type": 1, | |
| "string": "key" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "read" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "write" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "execute" | |
| } | |
| ], | |
| "mapValue": [ | |
| { | |
| "type": 1, | |
| "string": "fbq.queue.push" | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": false | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": false | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": true | |
| } | |
| ] | |
| }, | |
| { | |
| "type": 3, | |
| "mapKey": [ | |
| { | |
| "type": 1, | |
| "string": "key" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "read" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "write" | |
| }, | |
| { | |
| "type": 1, | |
| "string": "execute" | |
| } | |
| ], | |
| "mapValue": [ | |
| { | |
| "type": 1, | |
| "string": "fbq.queue" | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": true | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": true | |
| }, | |
| { | |
| "type": 8, | |
| "boolean": false | |
| } | |
| ] | |
| } | |
| ] | |
| } | |
| } | |
| ] | |
| }, | |
| "clientAnnotations": { | |
| "isEditedByUser": true | |
| }, | |
| "isRequired": true | |
| }, | |
| { | |
| "instance": { | |
| "key": { | |
| "publicId": "inject_script", | |
| "versionId": "1" | |
| }, | |
| "param": [ | |
| { | |
| "key": "urls", | |
| "value": { | |
| "type": 2, | |
| "listItem": [ | |
| { | |
| "type": 1, | |
| "string": "https://connect.facebook.net/en_US/fbevents.js" | |
| } | |
| ] | |
| } | |
| } | |
| ] | |
| }, | |
| "clientAnnotations": { | |
| "isEditedByUser": true | |
| }, | |
| "isRequired": true | |
| } | |
| ] | |
| ___SANDBOXED_JS_FOR_WEB_TEMPLATE___ | |
| const createQueue = require('createQueue'); | |
| const callInWindow = require('callInWindow'); | |
| const aliasInWindow = require('aliasInWindow'); | |
| const copyFromWindow = require('copyFromWindow'); | |
| const setInWindow = require('setInWindow'); | |
| const injectScript = require('injectScript'); | |
| const makeTableMap = require('makeTableMap'); | |
| const initIds = copyFromWindow('_fbq_gtm_ids') || []; | |
| const pixelIds = data.pixelId; | |
| // Utility function to use either fbq.queue[] | |
| // (if the FB SDK hasn't loaded yet), or fbq.callMethod() | |
| // if the SDK has loaded. | |
| function getFbq() { | |
| // Return the existing 'fbq' global method if available | |
| let fbq = copyFromWindow('fbq'); | |
| if (fbq) { | |
| return fbq; | |
| } | |
| // Initialize the 'fbq' global method to either use | |
| // fbq.callMethod or fbq.queue) | |
| setInWindow('fbq', function() { | |
| const callMethod = copyFromWindow('fbq.callMethod.apply'); | |
| if (callMethod) { | |
| callInWindow('fbq.callMethod.apply', null, arguments); | |
| } else { | |
| callInWindow('fbq.queue.push', arguments); | |
| } | |
| }); | |
| aliasInWindow('_fbq', 'fbq'); | |
| // Create the fbq.queue | |
| createQueue('fbq.queue'); | |
| // Return the global 'fbq' method, created above | |
| return copyFromWindow('fbq'); | |
| } | |
| // Get reference to the global method | |
| const fbq = getFbq(); | |
| // Build the fbq() command arguments | |
| const props = data.propertyList ? makeTableMap(data.propertyList, 'name', 'value') : {}; | |
| const command = data.eventName !== 'Custom' ? 'trackSingle' : 'trackSingleCustom'; | |
| const eventName = data.eventName !== 'Custom' ? data.eventName : data.customEventName; | |
| // Handle multiple, comma-separated pixel IDs, | |
| // and initialize each ID if not done already. | |
| pixelIds.split(',').forEach(function(pixelId) { | |
| if (initIds.indexOf(pixelId) === -1) { | |
| // If the user has chosen to disable automatic configuration | |
| if (data.disableAutoConfig) { | |
| fbq('set', 'autoConfig', false, pixelId); | |
| } | |
| // Initialize pixel and store in global array | |
| fbq('init', pixelId); | |
| initIds.push(pixelId); | |
| setInWindow('_fbq_gtm_ids', initIds, true); | |
| } | |
| // Call the fbq() method with the parameters defined earlier | |
| fbq(command, pixelId, eventName, props); | |
| }); | |
| injectScript('https://connect.facebook.net/en_US/fbevents.js', data.gtmOnSuccess, data.gtmOnFailure, 'fbPixel'); | |
| ___NOTES___ | |
| Created on 07/05/2019, 15:54:25 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment