How to see three-step paths in the navigation flow

Hover a page on the left of the flow and see where visitors who came from it went next.

1. Custom dimension 1: previous page

   In Analytics: Admin (gear) → Data display → Custom definitions → Create custom dimension. Dimension name Previous page. Scope Event. Event parameter prev_path. Save.

   prev_path Copy
   Open Google Analytics ↗

2. Custom dimension 2: page before that

   Same screen, Create custom dimension again. Name Page before previous. Scope Event. Event parameter prev2_path. Save.

   prev2_path Copy

3. Add the script to the site

   It must run on every page after GA4. With Cloudflare Zaraz it sends through zaraz.track, otherwise through gtag. On WordPress paste it in the footer with a code-snippet plugin. On your own site, telling your coding agent "add the nav_step snippet from seops" is enough.

   <script>
   // seops · three-step navigation (Traffic › Navigation › Flow). Run on every page, after GA4.
   (function () {
     try {
       var S = sessionStorage, h = JSON.parse(S.getItem("nav_hist") || "[]"), c = location.pathname, r = "";
       try { var u = new URL(document.referrer); if (u.host === location.host) r = u.pathname; } catch (e) {}
       if (h[h.length - 1] === c) return; // reload
       if (r && r !== c) {
         var p = { prev_path: r.slice(0, 100), prev2_path: (h[h.length - 1] === r ? h[h.length - 2] || "(entry)" : "(unknown)").slice(0, 100) };
         if (window.zaraz && zaraz.track) zaraz.track("nav_step", p); else if (window.gtag) gtag("event", "nav_step", p);
       }
       S.setItem("nav_hist", JSON.stringify(r ? [r, c] : [c]));
     } catch (e) {}
   })();
   </script>

4. Using Zaraz? Forward the event to GA4

   In Cloudflare: Zaraz → Tools → Google Analytics 4 → Actions → Create action. Trigger: Create trigger with rule {{ client.__zarazTrack }} Equals nav_step. Action type Event, event name nav_step. Add field twice: prev_path = {{ client.prev_path }}, prev2_path = {{ client.prev2_path }}. Save.

   Cloudflare Zaraz ↗

5. Check

   Browse a few pages on your site. In GA4 → Reports → Realtime the nav_step event should appear. The flow in seops starts filling within a day; custom dimensions only cover data from the day they were created.