DNN SiteAnalytics.config (Google Tag Manager?) Blocking Save for the DNN HTML Module

Question

We have a site where Google Tag Manager seems to be blocking the saving of changes in the HTML Module. GTM is implemented to spec and otherwise functions the way we expect.

When Google Tag Manager is on the page HTML Module changes do not save. When it's removed changes save properly.

No javascript errors are being thrown. No DNN Admin Log errors are being recorded.

I am searching for answers and hoping someone else has seen this before.

To insert GTM I am using the following as my SiteAnalytics.config and GoogleAnalytics.config:

        <!-- SiteAnalytics.config -->
    <?xml version="1.0" encoding="utf-8" ?>
    <AnalyticsEngineConfig>
      <Engines>
        <AnalyticsEngine>
          <EngineType>DotNetNuke.Services.Analytics.GoogleAnalyticsEngine, DotNetNuke</EngineType>
          <ElementId>Head</ElementId>
          <InjectTop>True</InjectTop>
          <ScriptTemplate>
            <![CDATA[
        <!-- Google Tag Manager -->
        <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
        new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
        j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
        'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
        })(window,document,'script','dataLayer','[TRACKING_ID]');</script>
        <!-- End Google Tag Manager -->
        <script>
          window.dataLayer = window.dataLayer || [];
          function gtag(){dataLayer.push(arguments);}
          gtag('js', new Date());

          gtag('config', '[TRACKING_ID]');
        </script>
            ]]>
          </ScriptTemplate>
        </AnalyticsEngine>
        <AnalyticsEngine>
          <EngineType>DotNetNuke.Services.Analytics.GoogleAnalyticsEngine, DotNetNuke</EngineType>
          <ElementId>Body</ElementId>
          <InjectTop>True</InjectTop>
          <ScriptTemplate>
            <![CDATA[
        <!-- Google Tag Manager (noscript) -->
        <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=[TRACKING_ID]"
        height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
        <!-- End Google Tag Manager (noscript) -->            
            ]]>
          </ScriptTemplate>
        </AnalyticsEngine>
      </Engines>
    </AnalyticsEngineConfig>

    <!-- GoogleAnalytics.config -->   
    <?xml version="1.0" encoding="utf-8"?>
        <AnalyticsConfig xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema">
          <Settings>
            <AnalyticsSetting>
              <SettingName>TrackingId</SettingName>
              <SettingValue>GTM-CODEHERE</SettingValue>
            </AnalyticsSetting>
            <AnalyticsSetting>
              <SettingName>UrlParameter</SettingName>
              <SettingValue />
            </AnalyticsSetting>
            <AnalyticsSetting>
              <SettingName>TrackForAdmin</SettingName>
              <SettingValue>true</SettingValue>
            </AnalyticsSetting>
          </Settings>
        </AnalyticsConfig>

So far I have tried:

removing all tags from GTM except Universal Analytics
setting the GTM code to .defer=true instead of .async=true (see Google Tag Manager delaying window.load?)
minimizing my theme (skin.ascx) by removing my custom javascript
loading GTM on DOMContentLoaded (see JavaScript that executes after page load)
Validating the skin template the W3C's HTML checker

Continuing on today.

Conflicts like this happen and I would say it is best if you can code it in a way where you can identify that the page is in "edit mode" and not render the GTM snippets. — XTOTHEL, Oct 25 '18 at 20:12
There really isn't enough information to help you. Have you confirmed this is actually due to GTM, and not due to some tag implemented within GTM (e.g. it's easy to accidentally create a global js variable in a custom HTML tag that overrides existing variables in the page code). — Eike Pierstorff, Oct 26 '18 at 11:37
Thanks for the thoughts. I do like the idea of restricting GTM while in edit mode. As to narrowing down the problem: All I have in there is Universal Analytics and a trigger that captures legacy Google Event pushes, but I think I'll strip everything I've added to GTM and see if the the problem persists. — MDM, Oct 26 '18 at 22:36

score 0 · Accepted Answer · answered Nov 06 '18 at 17:06

This was a strange issue with a stranger solution, so strange that I should probably change the title of the question. Maybe the site with this issue was a one-off but just in case here is the answer.

I discovered that it wasn't Google Analytics code causing the issue but something in DNN that was conflicting between SiteAnalytics.config and the DNN HTML module. In the code snippet below (from SiteAnalytics.config) I was inserting the noscript tag for GTM using this XML:

<AnalyticsEngine>
  <EngineType>DotNetNuke.Services.Analytics.GoogleAnalyticsEngine, DotNetNuke</EngineType>
  <ElementId>Body</ElementId>
  <InjectTop>True</InjectTop>
  <ScriptTemplate>
    <![CDATA[
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=[TRACKING_ID]"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->            
    ]]>
  </ScriptTemplate>
</AnalyticsEngine>

I discovered by accident that my issue was resolved when I removed everything between the CDATA tags or the whole CDATA itself. Next I tried reinserting the noscript while changing InjectTop from True to False. That also solved my issue.

So what I know is that injecting anything at the top of the Body using SiteAnalytics.config caused a conflict with the DNN HTML module on this particular site. One would assume that this would be due to some bad HTML on the page or a custom script causing a conflict. However I validated the template through W3C's checker and there were no issues. I also removed all our custom scripts to no avail. So the exact mechanism of the original conflict is unknown but the issue is solved. Below is the updated code:

    <!-- SiteAnalytics.config -->
<?xml version="1.0" encoding="utf-8" ?>
<AnalyticsEngineConfig>
  <Engines>
    <AnalyticsEngine>
      <EngineType>DotNetNuke.Services.Analytics.GoogleAnalyticsEngine, DotNetNuke</EngineType>
      <ElementId>Head</ElementId>
      <InjectTop>True</InjectTop>
      <ScriptTemplate>
        <![CDATA[
    <!-- Google Tag Manager -->
    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
    })(window,document,'script','dataLayer','[TRACKING_ID]');</script>
    <!-- End Google Tag Manager -->
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());

      gtag('config', '[TRACKING_ID]');
    </script>
        ]]>
      </ScriptTemplate>
    </AnalyticsEngine>
    <AnalyticsEngine>
      <EngineType>DotNetNuke.Services.Analytics.GoogleAnalyticsEngine, DotNetNuke</EngineType>
      <ElementId>Body</ElementId>
      <InjectTop>False</InjectTop>
      <ScriptTemplate>
        <![CDATA[
    <!-- Google Tag Manager (noscript) -->
    <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=[TRACKING_ID]"
    height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
    <!-- End Google Tag Manager (noscript) -->            
        ]]>
      </ScriptTemplate>
    </AnalyticsEngine>
  </Engines>
</AnalyticsEngineConfig>

<!-- GoogleAnalytics.config -->   
<?xml version="1.0" encoding="utf-8"?>
    <AnalyticsConfig xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema">
      <Settings>
        <AnalyticsSetting>
          <SettingName>TrackingId</SettingName>
          <SettingValue>GTM-CODEHERE</SettingValue>
        </AnalyticsSetting>
        <AnalyticsSetting>
          <SettingName>UrlParameter</SettingName>
          <SettingValue />
        </AnalyticsSetting>
        <AnalyticsSetting>
          <SettingName>TrackForAdmin</SettingName>
          <SettingValue>true</SettingValue>
        </AnalyticsSetting>
      </Settings>
    </AnalyticsConfig>

DNN SiteAnalytics.config (Google Tag Manager?) Blocking Save for the DNN HTML Module

1 Answers1