HomeEA · Use Case: Site Search › Implementation

Implementation

Purpose: Code to track site search.

Who this page is for

AudienceWhy it matters to you
DevelopersCopy and adapt

Implementation: Site Search

// In data layer when search form loads
window.adobeDataLayer = [{
  search: {
    enabled: true,
    term: "", // will be filled when user types
    resultCount: 0
  }
}];

// When user submits search
document.getElementById("searchForm").addEventListener("submit", (e) => {
  e.preventDefault();
  const term = document.getElementById("searchInput").value;
  
  // Update data layer
  window.adobeDataLayer.push({
    search: {
      term: term,
      resultCount: getResultCount() // your function
    },
    event: "search_performed"
  });
  
  // Web SDK reads and sends
  // prop1 = term
  // prop2 = resultCount
  // event1 fires
});

// When user clicks result
document.addEventListener("click", (e) => {
  if (e.target.classList.contains("search-result")) {
    window.adobeDataLayer.push({
      event: "search_result_clicked"
    });
    // event2 fires
  }
});

---

Next: QA and validation

Quick navigation