# Overview

**FYI We are still working on completing this documentation.**

This is a plugin for bubble.io platform made by [NovaBloq](https://novabloq.com/)\
It allows to use web3.js and MetaMask SDK without code to build a modern web3 app.\
Despite the name, it also can connect to other Web3 wallets besides the MetaMask.\
See details about it [here](https://docs.novabloq.com/web3-metamask/use-with-other-wallets-and-plugins)

{% hint style="success" %}
In case you are new to Bubble, see the video tutorial below before continuing.
{% endhint %}

{% embed url="<https://youtu.be/E2kpCecHmK8>" %}

{% embed url="<https://discord.gg/HWfg853N6d>" %}
Our team is active on Discord. Join for discussions and support
{% endembed %}

## Here you will find all demo pages for this plugin:

<https://web3-demo.bubbleapps.io/version-test/>

This page contains a list of all available demo pages for this plugin. We did a separate page for each mostly requested feature. Take a look on how it works, also open it in the app editor to see the workflow.

## Plugin Features

The plugin has 2 elements to separate the main features from the optional additional features.

<details>

<summary>Web3 &#x26; MetaMask - main element</summary>

All Features in this element:

* [Connect to MetaMask wallet](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/connect-to-metamask)
* [Disconnect MetaMask](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/disconnect-metamask)
* [Send any token to an address](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/send-token-with-metamask)
* [Get Balance of any token](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/get-balance-of-a-token)
* [Get Balance of a list of tokens](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/get-balance-of-multiple-tokens)
* [Check NFT Balance](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/check-nft-balance)
* Check multiple NFTs Balance at once
* [Get Token Symbol](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/get-token-symbol)
* Check Allowance
* Approve (Set Allowance)
* [Revoke Allowance](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/revoke-allowance)
* Transfer From
* [Smart Contract Interaction - Read](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/smart-contract-read)
* [Smart Contract Interaction - Write](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/smart-contract-write)
* Deploy a Smart Contract
* Detect connected chain and on chain changed
* [Sign](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/sign)
* [Sign Typed Data (EIP-712) (v.4)](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/sign-typed-data)
* [Check signature](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/check-signature)
* Send Transaction
* [Get NFT Metadata](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/get-nft-metadata)
* Transfer NFT to another wallet
* [Trigger change network popup in MetaMask](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/trigger-switch-chain)
* Import a custom token
* Wrap/Unwrap ETH to WETH
* [Trigger Switch Chain](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/trigger-switch-chain)
* [Request to add a Chain to MetaMask](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask/add-chain-to-metamask)

See details for each feature in the [Elements section](https://docs.novabloq.com/web3-metamask/elements-details/web3-and-metamask)

</details>

<details>

<summary>Web3 Utils - optional element</summary>

Optional element, it will add additional useful features to your app\
\
All Features in this element:

* [Convert To Wei](https://docs.novabloq.com/web3-metamask/elements-details/web3-utils/to-wei)
* [Convert From Wei](https://docs.novabloq.com/web3-metamask/elements-details/web3-utils/from-wei)
* Check Is Address
* Get Gas Price
* Get Latest Block Number
* Extract contract ABI
* [Get Transaction confirmations](https://docs.novabloq.com/web3-metamask/elements-details/web3-utils/get-transaction-confirmations)
* [Get Transaction Details](https://docs.novabloq.com/web3-metamask/elements-details/web3-utils/get-transaction-details)
* Get Unix Timestamp
* Open MetaMask App (Deep link for mobile)
* Convert Hex to Number and vice versa.
* Convert List of Numbers to Hex
* Convert Ascii to Hex
* Subscribe to Smart Contract Events
* Subscribe to New Block mined event (Can be used as a timer to check for changes on the blockchain)
* [Request to add custom token to MetaMask](https://docs.novabloq.com/web3-metamask/elements-details/web3-utils/add-token-to-metamask)
* [Get Transaction Details](https://docs.novabloq.com/web3-metamask/elements-details/web3-utils/get-transaction-details) (Amount sent, Receiver, Contract used, Timestamp, Full JSON data)
* Get Avatar from MetaMask Wallet
* [Get ENS Domain from Address](https://docs.novabloq.com/web3-metamask/elements-details/web3-utils/get-ens-domain-from-address)
* [Get All text records from an ENS name (Email, Avatar, Url, Twitter, etc.)](https://docs.novabloq.com/web3-metamask/elements-details/web3-utils/get-ens-data)

See details for each feature in the [Elements section](https://docs.novabloq.com/web3-metamask/elements-details/web3-utils)

</details>

{% hint style="info" %}
Make sure to **add the element on the page** **not inside a group** or popup!
{% endhint %}

{% hint style="info" %}
Adding more than 1 of each element on the page may result in errors.
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.novabloq.com/web3-metamask/overview.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
