Labels Widget

Setup

Add the script

Import the script to your website entry HTML file as follows:

<head>
  ...
  <script src="https://widget.trustblock.run/project-widget.min.js" defer />
</head>

Add the div

If you already know the project you want to display the label for and are not in a dynamic context, then you should use data-tb-project-slug.

Head to app.trustblock.run, find the project you want to get the label for, and copy the slug in the URL.

Then add the div to your website:

  <div
    data-tb-project-widget
    data-tb-project-slug="project-slug"
    data-tb-color="light"
    data-tb-mode="fit"
  />

Parameters

data-tb-project-widget is a required parameter that allows the widget to be initialized.
data-tb-project-slug is a required parameter that specifies the slug of the project you want to display the label for.
data-tb-color is an optional parameter that specifies the color of the widget, can be light or dark.
data-tb-mode is an optional parameter that specifies the sizing behavior of the widget, can be fit or fill.

If you already know the project you want to display the label for and are not in a dynamic context, then you should use data-tb-project-slug.

Head to app.trustblock.run, find the project you want to get the label for, and copy the slug in the URL.

Then add the div to your website:

  <div
    data-tb-project-widget
    data-tb-project-slug="project-slug"
    data-tb-color="light"
    data-tb-mode="fit"
  />

Parameters

data-tb-project-widget is a required parameter that allows the widget to be initialized.
data-tb-project-slug is a required parameter that specifies the slug of the project you want to display the label for.
data-tb-color is an optional parameter that specifies the color of the widget, can be light or dark.
data-tb-mode is an optional parameter that specifies the sizing behavior of the widget, can be fit or fill.

If you are in a dynamic context, then you can either use:

Then add the div to your website:

  <div
    data-tb-project-widget
    data-tb-contract-evm-address="0x123"
    data-tb-contract-chain="ethereum"
  />

Parameters

data-tb-contract-evm-address is a required parameter (if not using data-tb-project-domain) that specifies the EVM address of the contract you want to display the label for.
data-tb-contract-chain is a required parameter (if not using data-tb-project-domain) that specifies the chain of the contract you want to display the label for. Check the list of supported chains here.
data-tb-project-domain is a required parameter (if not using data-tb-contract-evm-address and data-tb-contract-chain) that specifies the domain of the project you want to display the label for.
data-tb-color is an optional parameter that specifies the color of the widget, can be light or dark.
data-tb-mode is an optional parameter that specifies the sizing behavior of the widget, can be fit or fill.