Voyado Engage

Traffic lights for status of script calls

The traffic lights feature in the Site Settings allows you to visually track the health and status of script calls. This feature allows you to monitor the performance of individual scripts (e.g., cornerwidget, checkout, custom scripts) directly from the Site List. Each script is associated with a traffic light status (green, yellow, red), providing immediate insight into the health of onsite messages tied to specific scripts. This enhances site monitoring and issue detection at a glance.

What Are Traffic Lights in Site Settings?

Traffic lights are visual indicators that provide a real-time status of each script’s execution on your website. These indicators reflect the current state of the script tag calls used for onsite messages, helping you quickly identify whether the script is functioning correctly or facing issues.

Traffic Light Colours:

  • Green: The script is functioning properly, and associated onsite messages are active.
  • Yellow: The script is experiencing minor issues, which may affect the display or behaviour of associated messages.
  • Red: The script is malfunctioning, which could lead to the failure of message delivery or incorrect display.

Traffic Lights Associated with Scripts:

Traffic lights are set for the following script tags:

  1. cornerwidget
  2. checkout
  3. login
  4. Custom Script Tags (e.g., abc123)

How Traffic Lights Work for Site-Specific Script Tags

Step-by-Step Flow:

  1. Script Execution: When a script (e.g., cornerwidget, checkout, abc123) is called on a page, it executes its logic and attempts to trigger the associated onsite messages.
  2. Traffic Light Evaluation:
    • Green: If the script successfully loads and the associated onsite messages are properly triggered, the status is set to green.
    • Yellow: If the script encounters minor issues (e.g., message delays or minor network errors), it will show a yellow status.
    • Red: If the script fails to load properly or encounters critical errors (e.g., missing assets, network failures), the status will change to red.
  3. Site List Display: Each script call on the Site List page now includes the corresponding traffic light status next to its script tag.
    • This enables you to easily monitor the performance and troubleshooting needs of specific scripts without digging into logs.

Traffic Lights on Site Settings Page:

  • Location: Site Settings > Site List
  • Visible: For each site, you will see traffic light indicators next to each script call (e.g., cornerwidget, checkout, login).
  • Purpose: These visual indicators help you track script performance and quickly address issues based on the traffic light status.

Understanding Traffic Light Triggers for Scripts

Green (Operational)

  • All required script components are loaded successfully.
  • Onsite messages linked to the script tag are successfully displayed.
  • There are no errors reported during execution.

Yellow (Warning)

  • Minor issues are detected, but the script can still function. Some issues may include:
    • Delayed loading of resources.
    • Some on-page elements (e.g., message content, widgets) might not load as expected but are still functional in a limited way.
    • Partial content display for messages, where some users may see messages while others may not.

Red (Critical)

  • The script has encountered a failure that prevents it from loading or displaying messages correctly. Common causes:
    • Missing or corrupt resources (e.g., JS files, CSS).
    • Network failures or timeouts preventing the script from executing.
    • Errors in the script execution (e.g., JavaScript errors) that prevent the associated message from triggering or displaying.

Pro Tip:

For each custom script tag (e.g., abc123), ensure that it is accurately mapped to the onsite message configuration. If there is a mismatch, the script might fail to display its associated message, and the traffic light will turn red.

Example Use Cases

Use Case 1 – Default Script (cornerwidget)

  • Scenario: The cornerwidget script is called, and the corresponding onsite message is correctly triggered.
  • Traffic Light: Green (The script and message are working as expected).

Use Case 2 – Custom Script (abc123)

  • Scenario: A custom script abc123 is deployed for a specific campaign.
  • The campaign’s onsite message is linked to the abc123 script.
  • Traffic Light:
    • Yellow (Minor issues are detected, e.g., slight delay in rendering the message).
    • Red (Critical failure, possibly due to a missing resource or network error).

How to Implement Traffic Lights in Custom Scripts

  1. Script Implementation: Ensure the custom script correctly calls the script tag (e.g., abc123) on the desired page or event.
  2. Message Linking: Link your onsite messages to the custom script tag (e.g., abc123).
  3. Testing & Validation: After implementation, check the Site List for traffic light indicators.
    • Green means the script is functioning properly, while Yellow or Red indicates potential issues requiring investigation.

Best Practices for Traffic Lights Monitoring

  • Regular Monitoring: Use the traffic light indicators to regularly monitor the health of scripts across different pages of your website.
  • Proactive Troubleshooting: Address Yellow and Red statuses promptly to ensure the smooth operation of onsite messaging.
  • Error Logging Integration: Leverage error logs in combination with traffic light status to understand the root cause of any issues.

Conclusion

The introduction of script tag-specific traffic lights in Site Settings enhances visibility into script performance and simplifies the troubleshooting process. By utilizing these visual indicators, you can proactively manage onsite messages, ensuring they are delivered seamlessly to your users.

Article last reviewed

Was this article helpful?

0 out of 0 found this helpful

Have more questions? Submit a request

Comments

0 comments

Please sign in to leave a comment.