1"use strict";(globalThis.webpackChunkbambuser_docs||=[]).push([[373],{11611(e,t,a){a.r(t),a.d(t,{assets:()=>h,contentTitle:()=>u,default:()=>p,frontMatter:()=>c,metadata:()=>r,toc:()=>m});var i=a.cw(function(e,t){const i=a.p+"assets/images/create-custom-js-variable-ccf8198c81d9b7f3f229af1dd165583f.png";a.d(t,["A",0,i])}),n=a.cw(function(e,t){const i=a.p+"assets/images/select-customer-data-variable-8c7970d15b94aa33aa32abd72090ba16.png";a.d(t,["A",0,i])}),s=a.cw(function(e,t){const i=a.p+"assets/images/choose-variable-type-640e16c5d3e70df518980ed20afe6b74.png";a.d(t,["A",0,i])}),o=a.cw(function(e,t){const i=a.p+"assets/images/variables-new-681b36fec04c0a86d0ee562dc45a4a8f.png";a.d(t,["A",0,i])});const r=JSON.parse('{"id":"oneToOneGtmCustomerData","title":"Customer data with GTM","description":"Pass dynamic customer data into the Calls Widget via the Bambuser GTM template using a Custom JavaScript variable; built-in or custom keys.","source":"@site/video-consultation/customerDataGTM.mdx","sourceDirName":".","slug":"/gtm-customer-data","permalink":"/docs/video-consultation/gtm-customer-data","draft":false,"unlisted":false,"tags":[],"version":"current","frontMatter":{"id":"oneToOneGtmCustomerData","title":"Customer data with GTM","description":"Pass dynamic customer data into the Calls Widget via the Bambuser GTM template using a Custom JavaScript variable; built-in or custom keys.","sidebar_label":"Customer data with GTM","slug":"gtm-customer-data"}}');var d=a(74848),l=a(28453);const c={id:"oneToOneGtmCustomerData",title:"Customer data with GTM",description:"Pass dynamic customer data into the Calls Widget via the Bambuser GTM template using a Custom JavaScript variable; built-in or custom keys.",sidebar_label:"Customer data with GTM",slug:"gtm-customer-data"},u=void 0,h={},m=[{value:"1. Create a variable",id:"1-create-a-variable",level:3},{value:"2. Add data to the variable",id:"2-add-data-to-the-variable",level:3},{value:"3. Add variable to tag",id:"3-add-variable-to-tag",level:3}];function b(e){const t={a:"a",admonition:"admonition",code:"code",h3:"h3",img:"img",li:"li",p:"p",pre:"pre",ul:"ul",...(0,l.R)(),...e.components};return(0,d.jsxs)(d.Fragment,{children:[(0,d.jsx)(t.admonition,{type:"info",children:(0,d.jsx)(t.p,{children:"This guide will explain how to provide dynamic customer data through the GTM tag template\ninstallation"})}),"\n",(0,d.jsx)(t.h3,{id:"1-create-a-variable",children:"1. Create a variable"}),"\n",(0,d.jsxs)(t.ul,{children:["\n",(0,d.jsx)(t.li,{children:"Click new on user defined variables"}),"\n"]}),"\n",(0,d.jsx)(t.p,{children:(0,d.jsx)(t.img,{alt:"img",src:o().A+"",width:"2532",height:"494"})}),"\n",(0,d.jsxs)(t.ul,{children:["\n",(0,d.jsx)(t.li,{children:"Choose Custom JavaScript"}),"\n"]}),"\n",(0,d.jsx)(t.p,{children:(0,d.jsx)(t.img,{alt:"img",src:s().A+"",width:"638",height:"597"})}),"\n",(0,d.jsx)(t.h3,{id:"2-add-data-to-the-variable",children:"2. Add data to the variable"}),"\n",(0,d.jsxs)(t.p,{children:["A custom javascript variable in Google Tag Manager needs to be a ",(0,d.jsx)(t.code,{children:"function"})," that returns\nsome value. A template code to start with in this case is"]}),"\n",(0,d.jsx)(t.pre,{children:(0,d.jsx)(t.code,{children:"function() {\n return {};\n}\n"})}),"\n",(0,d.jsxs)(t.p,{children:["Furthermore, you can use other variables in the code by surrounding the name of them with\ncurly brackets ",(0,d.jsx)(t.code,{children:"{{}}"})," and GTM will give you suggestions of existing matching variables, see example below when searching for ",(0,d.jsx)(t.code,{children:"name"}),"."]}),"\n",(0,d.jsx)(t.p,{children:(0,d.jsx)(t.img,{alt:"img",src:i().A+"",width:"2704",height:"1568"})}),"\n",(0,d.jsxs)(t.p,{children:["Finally, as you can see in the example above, you can provide variable names with or without the quotation marks ",(0,d.jsx)(t.code,{children:'"'}),". Bambuser support some\n",(0,d.jsx)(t.a,{href:"/video-consultation/present-customer-data-to-agent#built-in-properties",children:"built in variables"}),"\nthat would be translated into the Agent's language. However, you can also use the quotation marks\nto write a human readable name of the variable you provide, like the ",(0,d.jsx)(t.code,{children:'"Membership ID"'})," above."]}),"\n",(0,d.jsx)(t.h3,{id:"3-add-variable-to-tag",children:"3. Add variable to tag"}),"\n",(0,d.jsxs)(t.ul,{children:["\n",(0,d.jsx)(t.li,{children:"Go to the Bambuser one-to-one tag."}),"\n",(0,d.jsx)(t.li,{children:'Look for "Advanced Bambuser Features" and select the variable.'}),"\n"]}),"\n",(0,d.jsx)(t.p,{children:(0,d.jsx)(t.img,{alt:"img",src:n().A+"",width:"718",height:"254"})})]})}function p(e={}){const{wrapper:t}={...(0,l.R)(),...e.components};return t?(0,d.jsx)(t,{...e,children:(0,d.jsx)(b,{...e})}):b(e)}},28453(e,t,a){a.d(t,{R:()=>o,x:()=>r});var i=a(96540);const n={},s=i.createContext(n);function o(e){const t=i.useContext(s);return i.useMemo(function(){return"function"==typeof e?e(t):{...t,...e}},[t,e])}function r(e){let t;return t=e.disableParentContext?"function"==typeof e.components?e.components(n):e.components||n:o(e.components),i.createElement(s.Provider,{value:t},e.children)}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.