1. Collections Component Guide
  2. Topic list
  3. With data attributes
Topic list example

With data attributes

Arbitrary data attributes can be included with each link, usually for analytics tracking.

How it looks (preview)

How to call this example

<%= render "components/topic-list", {
  items: [
    {
      text: "Environmental taxes, reliefs and schemes for businesses",
      path: "/green-taxes-and-reliefs",
      data_attributes: {
        track_category: "navSubtopicContentItemLinkClicked",
        track_action: 1.1,
        track_label: "/green-taxes-and-reliefs",
        track_options: {
          dimension28: 2,
          dimension29: "Environmental taxes, reliefs and schemes for businesses"
        }
      }
    },
    {
      text: "Aggregates Levy: register or change your details",
      path: "/guidance/aggregates-levy-register-or-change-your-details",
      data_attributes: {
        track_category: "navSubtopicContentItemLinkClicked",
        track_action: 1.2,
        track_label: "/guidance/aggregates-levy-register-or-change-your-details",
        track_options: {
          dimension28: 2,
          dimension29: "Aggregates Levy: register or change your details"
        }
      }
    }
  ]
} %>