{"id":2645,"date":"2020-12-10T11:52:37","date_gmt":"2020-12-10T11:52:37","guid":{"rendered":"https:\/\/gaconnector.com\/docs\/?p=2645"},"modified":"2025-09-24T13:59:53","modified_gmt":"2025-09-24T13:59:53","slug":"integrate-ga-connector-form-plugin-doesnt-allow-customization-id-class-name-attributes","status":"publish","type":"post","link":"https:\/\/gaconnector.com\/docs\/integrate-ga-connector-form-plugin-doesnt-allow-customization-id-class-name-attributes\/","title":{"rendered":"How to integrate GA Connector if your form plugin doesn&#8217;t allow customization of id, class or name attributes"},"content":{"rendered":"<p data-pm-slice=\"1 1 [&quot;blockquote&quot;,{}]\">The instructions below apply to\u00a0<strong>Cookie-Based integration<\/strong>.<\/p>\n<p data-pm-slice=\"1 1 [&quot;blockquote&quot;,{}]\">If you are using\u00a0<strong>API-Based integration<\/strong>, please note that you will need to follow the <strong>Cookie-Based integration<\/strong>\u00a0steps instead.<\/p>\n<p data-pm-slice=\"1 1 [&quot;blockquote&quot;,{}]\">Not sure which instructions to follow? Start here:\u00a0<strong><a class=\"ProsemirrorEditor-link\" href=\"https:\/\/gaconnector.com\/docs\/how-to-check-which-ga-connector-integration-type-youre-using\/\">How to Check Which GA Connector Integration Type You\u2019re Using<\/a>.<\/strong><\/p>\n<p data-pm-slice=\"1 1 [&quot;blockquote&quot;,{}]\">\n<p>GA Connector relies on your hidden input fields\u2019 attributes so that it would be able to find them and fill them with tracking information. Our default GA Connector script will be able to fill your hidden fields with tracking information as long as you are able to set their id\/name with its equivalent GA Connector ID.<\/p>\n<p><span style=\"font-weight: 400;\">However, there are cases where the <\/span><span style=\"font-weight: 400;\">third-party form plugin that you are using doesn&#8217;t allow you to control the form\u2019s attributes and customize its input class or ID. For these cases, we have prepared specific instructions on how to integrate GA Connector with your form.<\/span><\/p>\n<h3>If your form doesn\u2019t allow you to customize the class\/id attributes but you are able to set a default value<\/h3>\n<ol>\n<li style=\"font-weight: 400;\">Create an input element and have it set to \u201c<em>hidden<\/em>\u201d<\/li>\n<li style=\"font-weight: 400;\">Add a default value to the input element you\u2019ve just added. The default value must be equivalent to the field that you are trying to track. See the table below for the full list of fields that you can track using GA Connector.<\/li>\n<\/ol>\n\n<table id=\"tablepress-7\" class=\"tablepress tablepress-id-7\">\n<thead>\n<tr class=\"row-1 odd\">\n\t<th class=\"column-1\">Label<\/th><th class=\"column-2\">Input ID<\/th><th class=\"column-3\">Label<\/th><th class=\"column-4\">Input ID<\/th>\n<\/tr>\n<\/thead>\n<tbody class=\"row-hover\">\n<tr class=\"row-2 even\">\n\t<td class=\"column-1\"><strong>All Traffic Sources <\/strong><\/td><td class=\"column-2\">gaconnector_all_traffic_sources<\/td><td class=\"column-3\"><strong>Last Click Campaign<\/strong><\/td><td class=\"column-4\">gaconnector_lc_campaign<\/td>\n<\/tr>\n<tr class=\"row-3 odd\">\n\t<td class=\"column-1\"><strong>Browser<\/strong><\/td><td class=\"column-2\">gaconnector_browser<\/td><td class=\"column-3\"><strong>Last Click Channel<\/strong><\/td><td class=\"column-4\">gaconnector_lc_channel<\/td>\n<\/tr>\n<tr class=\"row-4 even\">\n\t<td class=\"column-1\"><strong>City (from IP address)<\/strong><\/td><td class=\"column-2\">gaconnector_city<\/td><td class=\"column-3\"><strong>Last Click Content<\/strong><\/td><td class=\"column-4\">gaconnector_lc_content<\/td>\n<\/tr>\n<tr class=\"row-5 odd\">\n\t<td class=\"column-1\"><strong>Country (from IP address)<\/strong><\/td><td class=\"column-2\">gaconnector_country<\/td><td class=\"column-3\"><strong>Last Click Landing Page<\/strong><\/td><td class=\"column-4\">gaconnector_lc_landing<\/td>\n<\/tr>\n<tr class=\"row-6 even\">\n\t<td class=\"column-1\"><strong>First Click Campaign<\/strong><\/td><td class=\"column-2\">gaconnector_fc_campaign<\/td><td class=\"column-3\"><strong>Last Click Medium<\/strong><\/td><td class=\"column-4\">gaconnector_lc_medium<\/td>\n<\/tr>\n<tr class=\"row-7 odd\">\n\t<td class=\"column-1\"><strong>First Click Channel<\/strong><\/td><td class=\"column-2\">gaconnector_fc_channel<\/td><td class=\"column-3\"><strong>Last Click Referrer<\/strong><\/td><td class=\"column-4\">gaconnector_lc_referrer<\/td>\n<\/tr>\n<tr class=\"row-8 even\">\n\t<td class=\"column-1\"><strong>First Click Content<\/strong><\/td><td class=\"column-2\">gaconnector_fc_content<\/td><td class=\"column-3\"><strong>Last Click Source<\/strong><\/td><td class=\"column-4\">gaconnector_lc_source<\/td>\n<\/tr>\n<tr class=\"row-9 odd\">\n\t<td class=\"column-1\"><strong>First Click Landing Page<\/strong><\/td><td class=\"column-2\">gaconnector_fc_landing<\/td><td class=\"column-3\"><strong>Last Click Term<\/strong><\/td><td class=\"column-4\">gaconnector_lc_term<\/td>\n<\/tr>\n<tr class=\"row-10 even\">\n\t<td class=\"column-1\"><strong>First Click Medium <\/strong><\/td><td class=\"column-2\">gaconnector_fc_medium<\/td><td class=\"column-3\"><strong>Last Click Timestamp<\/strong><\/td><td class=\"column-4\">gaconnector_lc_timestamp<\/td>\n<\/tr>\n<tr class=\"row-11 odd\">\n\t<td class=\"column-1\"><strong>First Click Referrer<\/strong><\/td><td class=\"column-2\">gaconnector_fc_referrer<\/td><td class=\"column-3\"><strong>Longitude<\/strong><\/td><td class=\"column-4\">gaconnector_longitude<\/td>\n<\/tr>\n<tr class=\"row-12 even\">\n\t<td class=\"column-1\"><strong>First Click Source<\/strong><\/td><td class=\"column-2\">gaconnector_fc_source<\/td><td class=\"column-3\"><strong>Latitude<\/strong><\/td><td class=\"column-4\">gaconnector_latitude<\/td>\n<\/tr>\n<tr class=\"row-13 odd\">\n\t<td class=\"column-1\"><strong>First Click Term<\/strong><\/td><td class=\"column-2\">gaconnector_fc_term<\/td><td class=\"column-3\"><strong>Number of Website Visits<\/strong><\/td><td class=\"column-4\">gaconnector_page_visits<\/td>\n<\/tr>\n<tr class=\"row-14 even\">\n\t<td class=\"column-1\"><strong>First Click Timestamp<\/strong><\/td><td class=\"column-2\">gaconnector_fc_timestamp<\/td><td class=\"column-3\"><strong>Operating System<\/strong><\/td><td class=\"column-4\">gaconnector_OS<\/td>\n<\/tr>\n<tr class=\"row-15 odd\">\n\t<td class=\"column-1\"><strong>Google Analytics CID<\/strong><\/td><td class=\"column-2\">gaconnector_GA_Client_ID<\/td><td class=\"column-3\"><strong>Device<\/strong><\/td><td class=\"column-4\">gaconnector_device<\/td>\n<\/tr>\n<tr class=\"row-16 even\">\n\t<td class=\"column-1\"><strong>Google Analytics Measurement ID<\/strong><\/td><td class=\"column-2\">gaconnector_GA_Measurement_ID<\/td><td class=\"column-3\"><strong>Region<\/strong><\/td><td class=\"column-4\">gaconnector_region<\/td>\n<\/tr>\n<tr class=\"row-17 odd\">\n\t<td class=\"column-1\"><strong>Google Analytics Session ID<\/strong><\/td><td class=\"column-2\">gaconnector_GA_Session_ID<\/td><td class=\"column-3\"><strong>Pages Visited <\/strong><\/td><td class=\"column-4\">gaconnector_pages_visited_list<\/td>\n<\/tr>\n<tr class=\"row-18 even\">\n\t<td class=\"column-1\"><strong>Google Click Identifier<\/strong><\/td><td class=\"column-2\">gaconnector_gclid<\/td><td class=\"column-3\"><strong>Time Spent on Website <\/strong><\/td><td class=\"column-4\">gaconnector_time_passed<\/td>\n<\/tr>\n<tr class=\"row-19 odd\">\n\t<td class=\"column-1\"><strong>IP Address<\/strong><\/td><td class=\"column-2\">gaconnector_ip_address<\/td><td class=\"column-3\"><strong>Time Zone <\/strong><\/td><td class=\"column-4\">gaconnector_time_zone<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<!-- #tablepress-7 from cache -->\n<h3>If your form doesn\u2019t allow you to customize the class\/id attributes and you are unable to set a default value<\/h3>\n<ol>\n<li>Create the hidden input elements in your form editor and publish it. (This is because we need to list down the created input element\u2019s ID\/class)<\/li>\n<li>Open up page inspector (cmd + shift + c for MacOS, ctrl + shift+ c for Windows) and look for the created input and list down its class or ID<\/li>\n<li>Modify the code below and add the GA Connector field ID (without the &#8220;<em>gaconnector_&#8221;<\/em>\u00a0prefix) along with the class\/id of the input you\u2019ve created.<br \/>\n<span style=\"font-weight: 400;\"><strong><br \/>\nExample<\/strong>: You want to track the field <\/span><i><span style=\"font-weight: 400;\">\u2018All Traffic Sources<\/span><\/i><span style=\"font-weight: 400;\"><span style=\"font-weight: 400;\"><span style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">\u2019. Add the equivalent id of the field and on the right side of the code, add id\/class of the hidden input you\u2019ve created for it in quotation marks. (repeat this for all the fields that you need to track)<\/span><\/span><\/span><\/span>all_traffic_sources: &#8216;id-of-created-input&#8217;,<\/p>\n<pre class=\"lang:default decode:true\">&lt;script&gt;\r\n\/* Add GA Connector field ID name and the class\/id\/name of the input you've created *\/\r\n var fieldMapping = {\r\n all_traffic_sources: 'sample1-input-id',\r\n lc_source: 'sample2-input-class',\r\n fc_referrer: 'sample3-input-name',\r\n }\r\n&lt;\/script&gt; \r\n<\/pre>\n<\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">After adding all the fields that you need. Install the code that you have modified above in the &lt;head&gt; of your website.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Add the code below in the &lt;head&gt; of your website, this needs to be placed right after the <em>fieldMapping<\/em> code that you have just added.<br \/>\n<\/span><\/p>\n<pre class=\"lang:default decode:true \">&lt;script data-cfasync=\"false\" type=\"text\/javascript\" src=\"https:\/\/tracker.gaconnector.com\/gaconnector.js\"&gt;&lt;\/script&gt;\r\n&lt;script&gt;\r\nfunction setGaconnectorHiddenFieldsViaMapping() {\r\n var gaFields = gaconnector.getCookieValues();\r\n for (var gaconnectorField in fieldMapping) {\r\n var selectors = \"input[name='\" + fieldMapping[gaconnectorField] + \"'], \" + \"input[class='\" + fieldMapping[gaconnectorField] + \"'], \" + \"input[id='\" + fieldMapping[gaconnectorField] + \"']\";\r\n var inputs = document.querySelectorAll(selectors);\r\n if (inputs !== null) {\r\n for (var i = 0; i &lt; inputs.length; i++) {\r\n inputs[i].value = gaFields[gaconnectorField];\r\n }\r\n }\r\n }\r\n}\r\ngaconnector.setCallback(setGaconnectorHiddenFieldsViaMapping);\r\nsetInterval(setGaconnectorHiddenFieldsViaMapping, 1000);\r\n&lt;\/script&gt;\r\n<\/pre>\n<\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Done! You should now have tracking information filling up your hidden fields.<br \/>\n<\/span><\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"<p>The instructions below apply to\u00a0Cookie-Based integration. If you are using\u00a0API-Based integration, please note that you will need to follow the Cookie-Based integration\u00a0steps instead. Not sure which instructions to follow? Start here:\u00a0How to Check Which GA Connector Integration Type You\u2019re Using. GA Connector relies on your hidden input fields\u2019 attributes so that it would be able [&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[17,16],"tags":[],"_links":{"self":[{"href":"https:\/\/gaconnector.com\/docs\/wp-json\/wp\/v2\/posts\/2645"}],"collection":[{"href":"https:\/\/gaconnector.com\/docs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/gaconnector.com\/docs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/gaconnector.com\/docs\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/gaconnector.com\/docs\/wp-json\/wp\/v2\/comments?post=2645"}],"version-history":[{"count":17,"href":"https:\/\/gaconnector.com\/docs\/wp-json\/wp\/v2\/posts\/2645\/revisions"}],"predecessor-version":[{"id":3744,"href":"https:\/\/gaconnector.com\/docs\/wp-json\/wp\/v2\/posts\/2645\/revisions\/3744"}],"wp:attachment":[{"href":"https:\/\/gaconnector.com\/docs\/wp-json\/wp\/v2\/media?parent=2645"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/gaconnector.com\/docs\/wp-json\/wp\/v2\/categories?post=2645"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/gaconnector.com\/docs\/wp-json\/wp\/v2\/tags?post=2645"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}