Google Tag Manager JSON Import for Intercom Chat Widget (see comments below for instructions)

gtm_intercom.json

{
    "exportFormatVersion": 2,
    "exportTime": "2017-12-23 01:07:53",
    "containerVersion": {
        "path": "accounts/1234567890/containers/8139018/versions/0",
        "accountId": "1234567890",
        "containerId": "12345678",
        "containerVersionId": "0",
        "container": {
            "path": "accounts/1234567890/containers/8139018",
            "accountId": "1234567890",
            "containerId": "12345678",
            "name": "example.com",
            "publicId": "GTM-W245W9T",
            "usageContext": [
                "WEB"
            ],
            "fingerprint": "1513990671635",
            "tagManagerUrl": "https://tagmanager.google.com/#/container/accounts/1234567890/containers/8139018/workspaces?apiLink=container"
        },
        "tag": [
            {
                "accountId": "1234567890",
                "containerId": "12345678",
                "tagId": "8",
                "name": "intercom_0_snippet",
                "type": "html",
                "parameter": [
                    {
                        "type": "TEMPLATE",
                        "key": "html",
                        "value": "<script>\n    window.intercomSettings = { app_id: {{intercom_chat_widget_id}} };\n</script>\n\n<script>\n    (function () { var w = window; var ic = w.Intercom; if (typeof ic === \"function\") { ic('reattach_activator'); ic('update', intercomSettings); } else { var d = document; var i = function () { i.c(arguments) }; i.q = []; i.c = function (args) { i.q.push(args) }; w.Intercom = i; function l() { var s = d.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = 'https://widget.intercom.io/widget/{{intercom_chat_widget_id}}'; var x = d.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x); } if (w.attachEvent) { w.attachEvent('onload', l); } else { w.addEventListener('load', l, false); } } })()\n</script>"
                    },
                    {
                        "type": "BOOLEAN",
                        "key": "supportDocumentWrite",
                        "value": "false"
                    }
                ],
                "fingerprint": "1513990671635",
                "firingTriggerId": [
                    "11"
                ],
                "teardownTag": [
                    {
                        "tagName": "intercom_1_widget_styles_logic",
                        "stopTeardownOnFailure": true
                    }
                ],
                "tagFiringOption": "ONCE_PER_EVENT"
            },
            {
                "accountId": "1234567890",
                "containerId": "12345678",
                "tagId": "7",
                "name": "intercom_1_widget_styles_logic",
                "type": "html",
                "parameter": [
                    {
                        "type": "TEMPLATE",
                        "key": "html",
                        "value": "<a class=\"intercom-launcher\" href=\"{{intercom_chat_widget_id}}@incoming.intercom.io\">\n  <div class=\"intercom-icon-close\"></div>\n  <div class=\"intercom-icon-open\"></div>\n  <span class=\"intercom-unread-count\"></span>\n</a>\n\n<style>\n    .intercom-launcher {\n        backface-visibility: hidden;\n        background: {{color_black}};\n        border-radius: 50%;\n        bottom: 20px;\n        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.06), 0 2px 32px rgba(0, 0, 0, 0.16);\n        cursor: pointer;\n        font-family: Helvetica, Arial, sans-serif;\n        height: 0;\n        opacity: 0;\n        outline: 0;\n        position: fixed;\n        right: 20px;\n        transform: scale(0.5);\n        transform-origin: center;\n        transition: opacity 0.25s ease, transform 0.25s ease;\n        width: 0;\n        z-index: 2147483000;\n    }\n\n    .intercom-launcher:focus {\n        outline: 0;\n    }\n\n    .intercom-launcher.intercom-booted {\n        height: 50px;\n        opacity: 1;\n        transform: scale(1);\n        width: 50px;\n    }\n\n    .intercom-launcher * {\n        cursor: pointer;\n    }\n\n    .intercom-unread-count {\n        backface-visibility: hidden;\n        background: {{color_black}};\n        border-radius: 10px;\n        box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15);\n        box-sizing: border-box;\n        color: #fff;\n        font-size: 12px;\n        height: 20px;\n        line-height: 20px;\n        min-width: 20px;\n        opacity: 0;\n        padding: 0 4px;\n        position: absolute;\n        right: -2px;\n        text-align: center;\n        top: -2px;\n        transform: scale(0.5);\n        transform-origin: center;\n        transition: opacity 0.15s ease, transform 0.15s ease;\n    }\n\n    .intercom-unread-count.active {\n        opacity: 1;\n        transform: scale(1);\n    }\n\n    .intercom-icon-open,\n    .intercom-icon-close {\n        background-position: 50%;\n        background-repeat: no-repeat;\n        border-radius: 50%;\n        bottom: 0;\n        position: absolute;\n        top: 0;\n        transition: transform 0.16s linear, opacity 0.08s linear;\n        width: 100%;\n    }\n\n    .intercom-icon-open {\n        /* below is a data uri of the open icon */\n        /* change it if you'd like a different icon */\n        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABICAYAAABGOvOzAAAAAXNSR0IArs4c6QAABrRJREFUeAHtW0tMJFUUlQZ7YGgQmYHGQQYcQV2YIAmJG9igCQlxRiJRAmYwcSERNkQSdhMJCyGRjRsTosQPK0N0gREEMokaMiREERZoEJ2F/P+B8P+155R929fVTVXTfKQrdZPLq3rv1n33nHffq08/oh45XqKOb4rIFk+wqIOBVOvkWMpgPi5znYCWkrGqxwGxEyjVAY0eHR1N3d3dbTo6Ohr2eDxr0EiRNcT8C2JvHB4eTiEWLybBh9NAkUYN/ObmZinQrkYKYoM4V9bX1+8AriEJKvgYXPAqHB4aOI20pgNgegUkxEA5wIJXO8G5Jlplb29vssvl+hw1NLSKRAPTF93d3Y8DkA+8gJMKpsijSP3GSBveUOMFtnvECCVWDbeMspDgcDqdTBVLCrBxLTCcAo7o6OhsS6IHKGDLUQjQYOozIArymFUJ8GKTbGcZsNAJIVblIACzClhjxMrIFWw+rCoBbPc1KMZWO/TDqCfAamBN8dgEmFJkcQM7Ayw+wKbw7AwwpcjiBnYGWHyATeHZGWBKkcUN7Ayw+ACbwrMzwJQiixvYGWDxATaFZ2eAKUUWN7AzwOIDbArPzgBTiixuYGeAxQfYFJ6dAaYUWdzAzoCTDvDe3t4ENhx9d3h4uHzSa8/R/gjbX35EbH+F0wd/LeWemSvQBKP9Nth3N5acnJwBuxvl5eXPbGxsfG9kfxFtBN3X18etL+mMDTH+ZtQvMUKJVfYJaT+Jh0TA4uJiGy50Q1O96h4fH689ODiYM+r0PNqwEXJzdnb2w6KiokxvTIwrbXl5+ROj/mATPgHb29s/wcF1aDKUW85YppSUlGROTk6+DyKmjTo/izZMvXUMxMeNjY3Ps2/oNW8cjOU6Yhww6gc24RNAx1tbW1+3tLTc9DpKRJkE1YjIyMi4ge21VVgjvsUIbRgFcsK2A/Q7MDEx8V5ZWdkt9CfA2Tf3NCW2trZmwuYbM7+wPR0B7ADgZubn5+/CWTzUxQCgQgQzJLWgoODm0NDQG3Nzcx8hsB+QHYtmwUk703tnZ+dXpPNnY2Nj79TX1z8Hn0xxFTj7ZN+uhYWFt3FNSNMQ9n4EcAGk8nbIbaROBLGOMiQBqAczMzONmZmZD3CB6ov+qOJba6uqqkosLS19Mi0t7Rp2bibFxMQ4HQ5HNNIaa9fuFlJ7CRk029DQMIdruatb9Mh7zFLUMz09/ZLb7b6H7W/5qA9JsFOMxO1BD6D0FfoiKCOkL/f39weXlpbuVlZWcl1gVpBldsT0ZGbIesH5ygyhcjT1ynrayLzmdVqKo6RPF+Z+6srKyrsgbUQfRyjnXj/h3QXMOkAaLiN1P0Xa36mtrSUImSIMXiWFoIQcmcdSR+KoGmCUrra2tieQHW8iS75CDKdaW7x+fQSoaXviKQBnRrKDKTKE7PgZa8AIAPyJjdgP6+rqNpSL2L+IJyUlJaq9vT0lNzf3VkJCwrNxcXEvYHtrPqZJLow4pU4t+ikQjIA19KIGdupOdQ62MIrL0G3U70K1ZxAElgBl1vD83ERPAEfdTxDYijcQv/ozPLkK/9QzdBm+K31aefBo+Xv47iLvSpUA7ZazurraFXkwwo84gIDq6uovcYv5O3yXkXWlEMDRp3i6urq2BwcH38JasPlvlbX/CgFEKU9Yh4WFhSP9/f0luIX9YW34/z2+EieXZd6CqPy/mpisrKwrPT09t9PT04txP34KKzcfTi5s+UZ/eARwJFJx7ETfpxb48XsUFjAsRZkVvD1ShRDWSbbINai6ENH6u3//fn5eXl5FUlLSbYDgS1BYYkQAHaok6MGTgP8FvBoXXofjm5ubb+PVuyI2NvZFBn0SOY4A+hBwKgk8ltFX20/S52ltJR41Fi2mjo6Op4uLiyvxKex1vBHyK5WpGBHAiwWkHKud69tMOztDA4lDBoMlM1Q7z87OdnZ2dr6ck5NTER8fX4T6gCdciUVPgNSrpXQmpXQqU+KiS1mPuDBzIYyFXoXqP8Tw1drd1NSUOzU19QGeaB/iVh4gsOFC7nsbxPGxIgRchlIdBBJCMggiDkoyCIqv0/x+wBcqTgf3wMDAa/g814nX9G1hAvUkLiQCYHcpRD8AKhmSFUIGvz/wNuf3ea6mpiYbX48a8FwzijbaMJOYyZfklQyRhCgkQxU9OTwXgtSS9XzaPYTyU5h8DjvSO0RbRIg+bjlnSSV4tZR239Mu2nnskQYcR6zoMfA8mBIgs0AD7i39bns0iHRRyZBjKQWb78WPFfpGMYr0Mhgu1gl4H75ghr5Gixwch1Ej4x/FzutRzMchPgAAAABJRU5ErkJggg==');\n        background-position: 50% 70%;\n        background-size: 67% 64%;\n        opacity: 1;\n        transform: rotate(0deg) scale(1);\n    }\n\n    .intercom-open .intercom-icon-open {\n        opacity: 0;\n        transform: rotate(30deg) scale(0);\n    }\n\n    .intercom-icon-close {\n        /* below is a data uri of the close icon */\n        /* change it if you'd like a different icon */\n        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcBAMAAACAI8KnAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAIVBMVEUAAAD///////////////////////////////////8AAADPn83rAAAACXRSTlMACq47u/I8r7wWzHxoAAAAAWJLR0QAiAUdSAAAAAlwSFlzAAALEgAACxIB0t1+/AAAAJJJREFUGNNdzzEKhDAQBdAvwtYWW9hbbSdCDrBnWBDS2Sx7A8HSKwgic1tNxj/jmirDC5P/UTSw01V4ri2nMr7xkg/HIAu+Qi6j9HhEcpB1gHFGGCuSTyQTlQ2Vg3ic4x49TVpzwcQXvI+3x/+r0p9eLAfyYhrIWNOSmfZkVlH2Kpm9Z+bJeh68oSYmnlGMnv1X7RZ2SET5id+LAAAAAElFTkSuQmCC');\n        background-size: 25%;\n        opacity: 0;\n        transform: rotate(-30deg);\n    }\n\n    .intercom-open .intercom-icon-close {\n        opacity: 1;\n        transform: rotate(0deg);\n    }\n</style>\n\n<script>\n    var launcher = document.querySelector('.intercom-launcher');\n    var unreadCount = launcher.querySelector('.intercom-unread-count');\n\n    // Initialize Intercom\n    window.Intercom('boot', {\n        app_id: {{intercom_chat_widget_id}},\n        custom_launcher_selector: '.intercom-launcher'\n    });\n\n    // Register callbacks\n    window.Intercom('onShow', function () { launcher.classList.add('intercom-open') });\n\n    window.Intercom('onHide', function () { launcher.classList.remove('intercom-open') });\n\n    window.Intercom('onUnreadCountChange', function (count) {\n        unreadCount.textContent = count;\n        if (count) {\n            unreadCount.classList.add('active');\n        } else {\n            unreadCount.classList.remove('active');\n        }\n    });\n\n    // Wait for Intercom to boot (max 30 seconds)\n    var timeout = setTimeout(function () { clearInterval(interval) }, 30000);\n    var interval = setInterval(function () {\n        if (window.Intercom.booted) {\n            // Add class to show the launcher\n            launcher.classList.add('intercom-booted');\n            clearInterval(interval);\n            clearTimeout(timeout);\n        }\n    }, 100);\n</style>"
                    },
                    {
                        "type": "BOOLEAN",
                        "key": "supportDocumentWrite",
                        "value": "false"
                    }
                ],
                "fingerprint": "1513991259707",
                "tagFiringOption": "ONCE_PER_EVENT"
            }
        ],
        "trigger": [
            {
                "accountId": "1234567890",
                "containerId": "12345678",
                "triggerId": "11",
                "name": "example.com",
                "type": "PAGEVIEW",
                "fingerprint": "1513990779440"
            }
        ],
        "variable": [
            {
                "accountId": "1234567890",
                "containerId": "12345678",
                "variableId": "1",
                "name": "color_black",
                "type": "c",
                "parameter": [
                    {
                        "type": "TEMPLATE",
                        "key": "value",
                        "value": "#000"
                    }
                ],
                "fingerprint": "1513990847622"
            },
            {
                "accountId": "1234567890",
                "containerId": "12345678",
                "variableId": "6",
                "name": "intercom_chat_widget_id",
                "type": "c",
                "parameter": [
                    {
                        "type": "TEMPLATE",
                        "key": "value",
                        "value": "abc1234"
                    }
                ],
                "fingerprint": "1513990858130"
            }
        ],
        "fingerprint": "0",
        "tagManagerUrl": "https://tagmanager.google.com/#/versions/accounts/1234567890/containers/8139018/versions/0?apiLink=version"
    }
}

I tried Patrick's snippet (great btw!) I seem to get a double image of the Intercom icon as if one is overlaid on the other. The second one comes up a second later and slightly on the edge of the original. Does anyone else get this?