➡️Install

Installation via NPM/Yarn

The Spindl SDK is a lightweight npm package. You can install it here: 

npm install @spindl-xyz/attribution
yarn add @spindl-xyz/attribution

Unsure of whether to use attribution or attribution-lite? Reach out and we can help you choose the right option for you and your customers.

Initialization via library

The Spindl SDK only needs to be configured once in a browser or Node session.

  • If you're using Next.js, in page router, you can do this in pages/_app.tsx

    • If using app router, you need to implement it in a client side component

    • For example on how to implement in either one, checkout our examples repo.

import spindl from "@spindl-xyz/attribution";

spindl.configure({
  sdkKey: "<your SDK API key here>",
  debugMode: true/false, // we recommend only to have debugMode=true when testing.
  // you will see console.logs of emitted events in browser
});

Installation via Script/CDN

Add async script tag at the top of html file within head tag. Please make sure you to use your sdk key.

<head>
  ...
    <script
      async
      data-key="ADD_sdkKey_HERE"
      data-name="spindl-sdk"
      integrity="sha512-yYHHvptmhj2hLZVyas9NdYbNxJ4/JKDl3kXEB2eKS61VBLuhTXX4d+ztTbSFwxccxOgx7kFtQk0lBftaJxJ3Bw=="
      src="https://cdn.spindl.xyz/attribution-1-6-1.js"
      crossorigin="anonymous"
    ></script>
</head>

Initialization via Script

Script automatically is instantiated and will track page view events & wallet connect events so you don't need to do anything

You will still be able to fire custom "Wallet Connects" & "Page Views" if you want by accessing spindl via window object. Example:

  <script>
    (async () => {
     async function manualPageView() {
      await window.spindl.pageView();
     }
     async function manualWalletConnect(address) {
      await window.spindl.attribute(address);
     }
    })();
  </script>
PreviousReact, Next.js & Html ExamplesNextWallet Connects

Last updated