---
description: Walkthrough for tracking token views
---

# Token View (Optional)

**Token View Tracking with w3aSDK**

Enhance your understanding of user preferences by tracking cryptocurrency token views. This feature is especially beneficial for exchanges, enabling you to identify trending tokens and optimize the user experience.

#### **Setting Up Token View Tracking**

To initiate token view tracking, employ the `w3aSDK.tokenView` API:

```javascript
// example of w3aSDK.tokenView
w3aSDK.tokenView({
  label: "The Graph ($GRT)", // Optional: label for the token
  chainId: "0x1", // Chain ID of the token
  contractAddress: "0xc944e90c64b2c07662a292be6244bdf05cda44a7", // contract address of the token
});
```

#### **Practical Implementation**

Assuming you have a dynamic route structured as: `/token/:chain/:contractAddress`

Here's an example of how to integrate `w3aSDK.tokenView`:

```javascript
// w3aSDK.tokenView working example
import { useParams } from 'react-router-dom';
import { w3aSDK } from '@web3acquire/w3a';

const MAINNET_CHAIN_ID = "0x1";
const CHAIN_TO_CHAIN_ID = {
  "ethereum": MAINNET_CHAIN_ID /* Mainnet chainId */
}

export const TokenViewPage = () => {

  const { chain, contractAddress } = useParams();

  React.useEffect(() => {
    w3aSDK.tokenView({
      chainId: CHAIN_TO_CHAIN_ID[chain],
      contractAddress: contractAddress,
    });
  }, [chain, contractAddress]);
  
  // ... rest of the component
}
```

With this integration, you're all set! We'll begin capturing your custom analytics and KPIs, providing you with valuable insights. Happy tracking!
