export const exampleFile = 'webtracking-examples'


# Bento.js (Web Tracking)

This guide explores Bento's simple yet powerful analytics for web projects. Gain deeper insights into your audience, track user behavior in real-time, and optimize your site's performance with comprehensive data. Utilize the intuitive Bento API to seamlessly integrate analytics, enhancing your site's functionality and user experience. Enhance your marketing decision-making with actionable metrics and real-time insights for strategic growth and to optimize campaign performance. 

## Installation

There are two methods for logging events and web metrics. The most common is by adding the BentoJS Tracking Script to your site. The second method involves logging events directly from your website using the Bento API or a backend SDK library. Both approaches offer significant value in different ways.

When you sign up to [Bento](https://www.bentonow.com), you'll be able to copy and paste `bento.js` on your site. The script loads asynchronously and will not block your page from loading.

### Installation Example


  

    The following loads `bento.js` and fires off an event, `bento:ready`, that you can listen for. In this example it listens for the event and then fires off a `bento.view()` event. This is useful for tracking pageviews reliably.

    
      - **Site Key** (`string`): 
        This key can be found on your api keys page or the team dashboard
      
    
  
> Note: `Site Key` will automatically be replaced on the script page. Do not copy and paste the example verbatim.

  
  
    

  


## Identify
  
    
      In Bento, all new visitors are anonymous. If you'd like to identify a visitor, simply run the following command before you track an event or pageview.

      After you do so, all future events sent from this user's device will be correctly identified as that person. Worth mentioning that all previous events sent from that visitor's device will also be associated to that user. Magic, right?

    
    
      
    
  

## Identify — Chat

  
    In Bento, if you wish to identify a user in chat (not requiring self-identification) then you can use the following method. It requires both an email AND an identifier (like a `user_id` or `account_id` in your database).
  
  
    

  


## Update Fields


If you'd like to update a visitor's custom field (`firstname`, `last_name`, `status`, etc) run the following command _before you track an event or pageview.
This will send their fields inside the event and update the visitor.


  


## Track


The following will build an event with a custom `type`/`name` and a `details` payload that you can filter by in Workflows.


  


## Track Purchase (Create Unique Events)


The following will track a purchase and increase/decrease the LTV of a customer. Note that the key stops duplicate values being tracked, this is important if you're loading this script on a thank you page and it loads multiple times. Cool, huh?


  


  

## Tag


Fires an event with a tag inside.

  
> This can trigger automations.


  


## Chat Visibility Hooks


  


## Get Email


If you have identified the device at least once during the session you can fetch that information for your own use. This will usually be available if someone has logged in, opted in via Bento Capture, or used a form on your site.


  


## Spam Check


Got an important piece of content behind an opt-in and don't want your users putting fake email addresses in to get it? Leverage Bento's Spam API to ensure their email is correct before proceeding.


> This does not check MX records as that can be super slow.


  


## Track Subdomains


If you have traffic going to multiple subdomains and wish to track people throughout that journey simply run the following at least once per pageview. We will attempt to add the visitors identifier to each link. Please test this thoroughly before going live.