Click Tracking¶

Mentionlink reports clicks on its links, hotspots, and product cards in your dashboard. If you want those clicks in your own analytics too, such as Google Analytics, Amplitude, Adobe Analytics, Segment, or Mixpanel, listen to the mentionlinkclicked event.

The script dispatches this event every time a visitor clicks something Mentionlink added to the page. It carries the same information we record for our own reporting, so your numbers and ours line up.

The mentionlinkclicked event¶

document.addEventListener("mentionlinkclicked", (event) => {
  const { text, element, href } = event.detail;
  console.log(`Mentionlink ${element} clicked: ${text} → ${href}`);
});

• It is a CustomEvent whose payload is in event.detail.
• It is dispatched on the clicked <a> or <area> element and bubbles, so you can listen on document, on a container such as your article body, or on the element itself.
• It fires on mousedown, just like our own click tracking, so it is also recorded when the visitor opens the link in a new tab, middle-clicks it, or navigates away before a click handler would run.
• It is not cancelable. Calling event.preventDefault() has no effect, and nothing in your listener can stop the link from opening.
• It is dispatched after Mentionlink records the click, so an error thrown in your listener never affects our reporting.

You can register the listener at any time, including before the Mentionlink script has loaded, as the event is only dispatched once a visitor clicks.

event.detail¶

New fields may be added over time; existing fields will not be renamed or removed.

Examples¶

Each example below sends one event per click. Send whichever fields you need; text and element are usually enough to break down clicks by product and placement.

Google Analytics 4¶

document.addEventListener("mentionlinkclicked", (event) => {
  const { text, element, href } = event.detail;
  gtag("event", "mentionlink_click", {
    link_text: text,
    link_url: href,
    mentionlink_element: element,
  });
});

Register mentionlink_element as a custom dimension to report on it.

Google Tag Manager¶

document.addEventListener("mentionlinkclicked", (event) => {
  window.dataLayer = window.dataLayer || [];
  window.dataLayer.push({ event: "mentionlink_click", ...event.detail });
});

Then create a Custom Event trigger for mentionlink_click and Data Layer Variables for the fields you need, such as text and element.

Amplitude¶

document.addEventListener("mentionlinkclicked", (event) => {
  const { text, element, href, page_url } = event.detail;
  amplitude.track("Mentionlink Click", { text, element, href, page_url });
});

As clicks often navigate away from the page, initialize Amplitude with transport: "beacon" so the event is not lost when the page unloads.

Adobe Analytics (Web SDK)¶

document.addEventListener("mentionlinkclicked", (event) => {
  const { text, element, href } = event.detail;
  alloy("sendEvent", {
    xdm: {
      eventType: "web.webinteraction.linkClicks",
      web: {
        webInteraction: {
          name: `Mentionlink ${element}: ${text}`,
          URL: href,
          type: "exit",
          linkClicks: { value: 1 },
        },
      },
    },
  });
});

Adobe Analytics (AppMeasurement)¶

document.addEventListener("mentionlinkclicked", (event) => {
  const { text, element } = event.detail;
  s.linkTrackVars = "eVar1,eVar2";
  s.eVar1 = text;
  s.eVar2 = element;
  s.tl(true, "e", `Mentionlink ${element}: ${text}`);
});

Replace eVar1 and eVar2 with the eVars configured in your report suite.

Segment¶

document.addEventListener("mentionlinkclicked", (event) => {
  analytics.track("Mentionlink Clicked", event.detail);
});

Testing¶

Paste this into the DevTools console on a page with Mentionlink, then click a link, hotspot, or product card:

document.addEventListener("mentionlinkclicked", (event) => console.table(event.detail));

To stay on the page, hold Ctrl (or Cmd on macOS) while clicking to open the link in a new tab.

Limitations¶

• The event fires on mousedown, so it includes right-clicks that open the context menu, and it does not fire when a link is opened with the keyboard.
• Other events the script dispatches on document, such as mentionlinkstarted, mentionlinkfinished, and mentionlinkvisioned, exist for testing and coordination and are not part of this public API. See Tech Spec.
• The event carries no information about the visitor. See Data Collection for what Mentionlink collects.

Get Started

Schedule a free demo or email us at hello@mentionlink.com