🔬
Product Docs
  • 👋Welcome to Web3 Analytics
  • Overview
    • ✨Features
    • 💡How does it work?
  • Fundamentals
    • 🛠️Getting set up
      • 📝Register an app
      • 🔧Install via NPM
      • 🔨Install via CDN
      • ⚙️Instrumenting your app
  • Product Guides
    • ❓Creating queries
    • 📊Making a dashboard
    • ✔️Sample apps
  • Technology
    • Why Web3 Analytics?
    • Front end instrumentation
    • Decentralized data network
    • Smart contract registry
    • Indexer
    • Dashboard builder
    • Source code
Powered by GitBook
On this page
  1. Fundamentals
  2. Getting set up

Install via CDN

PreviousInstall via NPMNextInstrumenting your app

Last updated 2 years ago

Personalized instructions for installing your app can be found in the 'How to install' tab of your App dashboard.

How to install via CDN

Web3 Analytics can also be used in plain HTML using a CDN. This allows you to easily instrument any blog or web site.

First, you must include the libraries from the CDN in HTML script tags:

<script defer src="https://unpkg.com/analytics/dist/analytics.min.js"></script>
<script defer src="https://unpkg.com/analytics-plugin-web3analytics/dist/web3analytics.min.js"></script>

Then, you must initialize and configure the Web3 Analytics tracker:

<script type="text/javascript">
window.addEventListener('load', function() {
    /* Initialize analytics */
    var Analytics = _analytics.init({
        app: 'web3analytics-html-demo',
        plugins: [
            // attach web3analytics plugin
            web3analytics.default({
                appId: 'YOUR_APP_ID',
                jsonRpcUrl: 'https://eth-goerli.g.alchemy.com/v2/your_api_key'
            })
        ]
    })
    /* Fire page view */
    Analytics.page()            
});
</script>

You can use any app name you like. For appId, input your appId (it will be displayed in the instructions and is also visible on the details tab of the app dashboard. You will also need to use your own jsonRpcUrl for Goerli.

Note, in the example above, a page event is fired on every page load since this is normally what you would want if you're instrumenting this way.

    Analytics.page()            

Here is an for reference.

🛠️
🔨
example app