Track JavaScript Events Emitted from RoofQuote PRO

Overview

RoofQuote PRO's <iframe> is configured to emit events for analytics purposes. These events can be captured with Javascript in the parent window and utilized for the analytics solution of your choice (e.g. Google Analytics).

Event Names

The following is a list of event names that the <iframe> may emit. These names will not change, but more events may be added in the future.

• roofquotepro_address_loaded
• roofquotepro_slope_changed
• roofquotepro_roof_renamed
• roofquotepro_roof_inclusion_toggled
• roofquotepro_edit_roofs
• roofquotepro_lead_form_displayed
• roofquotepro_lead_submitted
• roofquotepro_other_contact_form_displayed
• roofquotepro_other_contact_submitted
• roofquotepro_product_requested

Event Example Data

The following is an example JSON emitted by a single event. All events contain the data property which holds the event information.

data: {

    "event": "Contact-form-submitted",

    "sessionId": "EvQPb3PWVlUWuJaXSNBc6",

    "marketSlug": "minneapolis-st-paul_mn"

}

Event Listener Example

The following code is a recommended configuration and an example of sending the analytics events directly to Google Analytics. This code can be implemented directly on pages which have the Roof Quote PRO widget installed, or it can be added to Google Tag Manager as a Custom HTML Tag with the DOM-ready trigger.

To learn more about optimizing the widget for Google Ads campaigns, read How to set up Google Tag Manager to record RQP events in our Knowledge Base.

<script>

  window.addEventListener("message", function (event) {

    if (event.origin.includes("app.roofle.com")) {

      if (!dataLayer) {

        console.warn("Google Analytics is not installed.");

        return;

      }


      // Track the widget was loaded

      if (event.data.event === "Roof-quote-pro-viewed") {

        send("roofquotepro_viewed");

      }


      // Track the address entered event

      if (event.data.event === "Address-loaded") {

        send("roofquotepro_address_loaded");

      }


      // Track the contact form submitted event

      if (event.data.event === "Contact-form-submitted") {

        send("roofquotepro_lead_submitted");

      }


      // Track the help/other contact form submitted event

      if (event.data.event === "Get-help-form-submitted") {

        send("roofquotepro_other_contact_submitted");

      }


      // Track the product detail requested event

      if (event.data.event === "Product-requested-cta") {

        send("roofquotepro_product_requested");

      }

    }


    function send(event) {

      console.log("Roof Quote PRO™ sent the " + event + " event to Google Analytics");

      dataLayer.push({

        event: event,

      });

    }

  });

</script>