search

BnbAds Dev Docs

As a developer you can use our npm package to display ad on your website and generate revenue.

hashtag
Installation

npm install adbase-package@latest

hashtag
BnbAds Provider Setup

Wrap AdProvider around your application.

hashtag
Props:

`region`: the region prop is not yet useful but will be implemented in the next iteration

`dev_wallet_address`: This address claims all the ad clicks under the respective provider

import { AdProvider } from "adbase-package";

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body className={inter.className}>
        <AdProvider
          region={"<REGION>"}
          dev_wallet_address={"<WALLET_ADDRESS>"}
        >
          {children}
        </AdProvider>
      </body>
    </html>
  );
}

hashtag
Display the Ad in your component

Now all. you need to do is use <DisplayAd /> in your component wherever you'd like to display the ad. Thats it! You just monetized your website

hashtag
Claim the revenue generated 🥳

  1. Visit https://bnb-ads.vercel.app/dashboardarrow-up-right, log in using the address you provided in the prop of AdProvider.

  2. Here you can view your claimable balance, click on claim now

  3. Generate a zk-proof that you are indeed owed the amount displayed.

  4. The sponsored transaction is sent to the chain along with proof, once it's verified you'll get your revenue straight in your wallet.

Last updated