# Event visualizer

# Overview

The Event Visualizer is Intempt’s simple point-and-click interface for defining events. Instead of manually logging events within code, you can define events by simply clicking around your website or app. No coding knowledge is required, though it is useful for refining your event definitions further.

# Select Webpage & Launch Visualizer

To use the Event Visualizer, navigate to the Event Visualizer page in Intempt. Click on the text box and enter a URL.

img

Click Launch to launch the Event Visualizer overlay on the selected page.

img

If the Event Visualizer toolbar is blocking an element you want to define an event on, simply click the arrow at the bottom to minimize it.

img

# Using the Event Visualizer to Capture & Define Web Events

To define new events, simply hover over and click on the element you’d like to define an event for. Once clicked, a pop-up will appear where you can review and update the definition of the event as needed before saving it.

img

In the screenshot below, we’ve clicked on the banner image on our homepage. To the right, some detailed CSS information is provided which you can review to confirm that you are defining the right event.

The information listed on this screen includes:

Number of matching elements on this page: If you intended to select an element that appears more than once, such as a list with multiple elements, you can check this number to confirm your selection is correct.

img

Name: add a descriptive name to the defined event.

img

Definition: You can review the event definition contextually within the CSS of the page to ensure the scope of the event definition is correct.

img

Within the Edit Definition section, you can hover over each individual CSS element to see what it selects on the page. Clicking on an element adds it to your event definition, enabling you to further define your new event from this page based on what you want to capture.

img

Doing this won’t break your event definition – try clicking on different CSS elements and checking what gets captured to further optimize your new event.

Limit to URL: This allows you to narrow the event definition to only instances where the event occurs on this page.

img

Save: Once you’ve adjusted your event definition to your needs, click Define Event. On the next page, you’ll see options to name and categorize your new event. You can define an event in your personal or shared space.

img

**See the event:**To see your brand-new event definition, click Back to Intempt at the top to navigate back to your Intempt organization.

img

Define pageview events: You’ll also see the option to Define pageviews in this top navigation bar. This enables you to define page view events without specifying any interaction event (like click).

img

Accessing events: The “Events” section allows you to see all the events created within this session with the event visualizer. If you click on the event, you are redirected to its dedicated page on the Intempt console.

img