WP（DIVI主题）元素dataLayer.push互扰致标签显示「not set」异常

Let's break down why your sectionLabel is stuck on "not set" even though the trigger fires, and how to fix it without relying on iframes.

1. Check for dataLayer Initialization Timing Issues #

DIVI (and many WordPress themes) loads scripts in a specific order, and your window.onload might be firing before the dataLayer object is properly initialized by Google Tag Manager (GTM) or your analytics setup.

• Fix: Replace window.onload with a listener that waits for the DOM to be ready (it fires earlier, after the DOM is parsed but before all assets finish loading):

  document.addEventListener('DOMContentLoaded', function() {
    dataLayer.push({'sectionLabel': 'Test section'});
  });
  

  Alternatively, add your script to DIVI's "Footer Scripts" section (under Theme Options > Integration) instead of the header—this ensures it loads after most core scripts like GTM.

2. Debug Conflicts with Toggle Panel Scripts #

You mentioned the toggle panel's similar dataLayer pushes work flawlessly—they might be overriding or interfering with your header element's push, especially if they share the same variable name.

• Debug Step: Open your browser's DevTools (F12), go to the Console tab, and run console.log(dataLayer) right after the trigger fires. Check if your sectionLabel entry exists, or if it's being overwritten by another push from the toggles.
• Fix: Use a unique variable name for your header section (e.g., headerSectionLabel instead of sectionLabel) to avoid collisions.

3. DIVI's Dynamic DOM Manipulation Might Be Breaking the Trigger #

DIVI frequently modifies the DOM dynamically (especially with modules like toggles, sliders, or AJAX-loaded sections). Even if your trigger element <p class="GASectionVisible"> exists, DIVI might re-render it after your script runs, causing the trigger to fire but the dataLayer push to fail.

• Fix: Use a MutationObserver to detect when the GASectionVisible class is added to the element, then push to dataLayer:

  // Target the parent container of your header section
  const targetNode = document.querySelector('#your-header-section-id');
  const config = { attributes: true, childList: true, subtree: true };
  
  const observer = new MutationObserver(function(mutations) {
    mutations.forEach(function(mutation) {
      if (document.querySelector('.GASectionVisible')) {
        dataLayer.push({'sectionLabel': 'Test section'});
        observer.disconnect(); // Stop observing after the push is done
      }
    });
  });
  
  observer.observe(targetNode, config);
  

  Replace #your-header-section-id with the actual CSS ID of your header section (you can set this in DIVI's module settings under Advanced > CSS ID).

4. Verify Trigger Configuration in GTM (If Using It) #

If you're using Google Tag Manager to track this sectionLabel, double-check your setup:

• Make sure your trigger listens for the correct event. If you're using a custom event, include it in your push: dataLayer.push({'event': 'sectionVisible', 'sectionLabel': 'Test section'});
• Confirm your sectionLabel variable is configured to read from the dataLayer correctly (not stuck on a default "not set" value).

5. Test for Plugin/Theme Conflicts #

Other WordPress plugins (like caching, optimization, or security tools) can minify or defer scripts in ways that break dataLayer functionality.

• Debug Step: Temporarily disable all plugins except DIVI and your analytics/GTM plugin. If the push works, re-enable plugins one by one to find the culprit.
• Fix: For caching plugins, add your dataLayer script to the "exclude from minification/deferral" list.

内容的提问来源于stack exchange，提问作者Kacper