About this Template
Link to the template page: https://zeroqode.com/template/cryptance-template-1659702492426x667572741690714500
Introduction
Crypto is going mainstream with an explosion of financial services providers, and other institutions getting on board with cryptocurrency and blockchain.
A crypto wallet is a place where you can securely keep your cryptocurrency. It lets you buy, sell or transfer assets on the blockchain. A majority of crypto users use Metamask as their go-to exchange wallet for transacting cryptocurrency across the globe.
All wallet transactions and activity is public and transparent on the blockchain. Our Cryptance template allows one to connect one’s Metamask wallet and displays these records, making it easy to keep track of everything. It shows the user’s Metamask wallet total assets, as well as the balance of all the chains that Metamask supports. The users will also see all up-to-date transactions that happened to their wallets and a history of transactions.
Users can as well add chains and tokens right from the template to their Metamask wallet.
This block can be used as part of any no-code crypto platform, dashboard, etc.
Metamask is a chrome-based cryptocurrency wallet used to interact with the Ethereum and ERC-20 compatible blockchains. This plugin allows users to access their Ethereum wallet through a browser extension or mobile app, which can then be used to interact with decentralized applications. It's like a bridge that allows you to interact with blockchain-based applications
Note: Please first install the Metamask extension for your browser to start working with the Cryptance Template.
Features
- Gets one’s Metamask wallet total assets
- Shows the user’s balance of all the chains that Metamask supports
- Displays detailed transactions history (transaction type & amount, date, sender, receiver, tx hash)
- Possibility to add/choose a chain or token.
- The template is made using the new Bubble responsive engine
Note: This template is using Login with Metamask and Metamask Advanced plugins by Zeroqode.
Video Overview
Demo
Give it a try here: https://zqcrypto1.bubbleapps.io/🤩
Setup Guide
Once you have bought or added a block to your account, you will see a dropdown in the New Application popup that lets you pick a template as the basis for the new application.
Note: This can only be done when you create a new app.
After you’ve selected a block you bought, complete the other fields with necessary data (i.e: Name of the new app, What kind of application you are building, etc) and press Create a new app.
Tip: A template isn’t a theme for your app, but a pre-built set of elements and workflows. You can modify the template as you would modify another app.
Wait for Bubble to load the application with all the data.
After the application has loaded, you’ll see the Bubble assistant on the left side for New Application. You can close it or follow the assistant steps to adjust different settings.
Now you’re ready to go and dive into Bubble no-code development toolset.
Congrats! You have successfully created a Bubble app based on your block. Now, you can proceed with the setups.
API Connector setup
For set up, go to Plugins -> API Connector and hit to expand it, here:
The API will expand, where you will be able to configure it with your own API 🔑 keys, namely:
- DeBank - We use Debank API in the template to display the user's balance. After purchasing the template, please:
- register an account on Debank: https://open.debank.com/ ,
- get your personal access key,
- and insert it into
AccessKey
field.
The access key can be found on the admin tab of the open.debank.com profile.
Note: In case you would like to add additional API calls, please find supporting documentation here: https://docs.open.debank.com/en/reference/api-pro-reference/user
- CoinGeko - We use Coingeko API in the template to display chains and coins. Their free API is freely accessible. No API call adjustment is required, all calls have been set up in accordance with the platform supporting documentation: https://www.coingecko.com/api/documentations/v3
- Zapper - We use Zapper API in the template to display the history of transactions. After purchasing the template, please register an account on Zapper, get your own access key, and use it in the template.
General note: In the template, we have added 50 tokens only (due to the number of things limits for the templates), but we’ve prepared a .csv file with all the chains you can download and use to add them to the template.
Algolia Search V2.0
The searching feature within this block is powered by the Algolia Search V2.0 plugin by Zeroqode.
Prerequisites
For using the plugin you’ll need to get the API credentials from Algolia. Create your development account at: https://www.algolia.com/developers/
Note: For plugin setup, check out the plugin video Tutorial
Note: For more related information and API keys setup, please follow the plugin supporting documentation: https://docs.zeroqode.com/plugins/algolia-search-plugin/algolia-20-simple-search
Remove Banner
This template comes with a promotional banner above the Header element. Feel free to remove it from your app.
Things to Note
Note: If you would like to use this block within another app, please note that for proper functioning, it is required to create all relevant data types within your application database, and add required plugins. For reference, use the purchased block’s default template editor (Data -> Data Types) and Plugins tab.
MetaMask plugins
Metamask is a chrome-based cryptocurrency wallet used to interact with the Ethereum and ERC-20 compatible blockchains.
Note: For proper use, please be sure to have Metamask Extension installed on your browser and Metamask registered account.
A warning pop-up in this regard has been added to the
index
page, shown on page load. To remove it, edit/delete the popup element and related workflows:
Login with Metamask plugin
We use the “Login with MetaMask” plugin to enable users to connect the user’s Metamask wallet to the template (using Metamask browser extension).
Note: find more information about the plugin on Zeroqode: https://zeroqode.com/plugin/login-with-metamask-1640735573319x248395696048814270
Advanced MetaMask Plugin
We use the MetaMask Advanced plugin to interact with the user’s Metamask wallet and add coins and chains to the wallet directly from the Cryptance Template interface.
This plugin made by Zeroqode allows users to access their Ethereum wallet through a browser extension or mobile app, which can then be used to interact with decentralised applications. It’s like a bridge that allows you to interact with blockchain-based applications.
Note: find more information about the plugin on Zeroqode: https://zeroqode.com/plugin/metamask-advanced-1646308227725x374792546591918200
Note: It is a paid plugin. To be able to use it, the plugin needs to be purchased (one-time payment or a monthly subscription) via Bubble’s marketplace.
If you do not want to use it, simply remove the plugin from the template.
Pages Overview
index
This is the main page of the template. Here, users can view the balance of their Metamask wallet as well as the list of all their recent transactions and Metamask actions tab (it enables to add network and add custom coins from the template right to the Metamask wallet).
Data Types
Blockchain
This data type is used to add new chains.
Field Name | Type | Notes |
algoliaChainID | text | This field is used to display the name of chain in Algolia search. |
blockExplorerURL | text | This field is used to redirect user to a site with details of transactions. |
chainID | text | This field stores chain ID. |
currencySymbol | text | This field is used to display currency symbols. |
logo | image | This field contains the currency’s logo. |
name | text | This field stores the blockchain’s name. |
newRPCurl | text | This field contains the chain’s RPC url. |
Note: The data type has a privacy rule applied. See the 💬 in the database under the privacy section for details.
Coinslist
This data type stores a list of coins.
Field Name | Type | Notes |
chain | List of Blockchains | This field is used to display list of Blockchains |
coinBlockchain | List of Token Smart Contractses | This field contains List of Token Smart Contracts |
name | text | This field is used to display coin’s name |
symbol | text | This field is used to display coin’s symbol. |
Note: The data type has a privacy rule applied. See the 💬 in the database under the privacy section for details.
Contact
This data type is used to display the user’s name and wallet ID for transaction details.
Field Name | Type | Notes |
name | text | This field displays the user’s name. |
walletsId | List of texts | This field contains the list of user’s wallet IDs. |
Token Start Contracts
This data type contains token smart contracts.
Field Name | Type | Notes |
address | text | This field is used to display contract’s address |
blockchain | text | This field is used to display blockchain. |
Note: The data type has a privacy rule applied. See the 💬 in the database under the privacy section for details.
User
This data type contains information about the user.
Field Name | Type | Notes |
contact | List of Contacts | This field contains the list of user’s contacts. |
metamaskID | text | This field contains the user’s Metamask ID. |
wallets | List of User’s Wallets | This field contains the list of users’ wallets. |
Note: The data type has a privacy rule applied. See the 💬 in the database under the privacy section for details.
User’s Wallet
This data type stores information about the user’s wallet.
Field Name | Type | Notes |
walletID | text | This field stores user’s wallet ID. |
Release Notes
Update: 10 August 2022
LOTS OF GOOD STUFF🎉
- 🎉 New block documentation
- 🔌 Added instructions for all plugins
- 💳 Added payment setup guidance
Note: Block updates don’t apply to the apps which were built on the template prior to updates becoming available.
Tip: To check changes in workflows and design, you can create a new block copy and compare the settings (design/workflow) of the new copy and the app you have. So you don’t have to “move” your customizations from your already edited template to the new block copy.
Ready to move further?
Enhance your app with powerful plugins
🔌 Zeroqode Plugins: add Superpowers to your App
Zeroqode Air Native plugin
Note: This template has Zeroqode Air Native plugin installed. With the plugin you will be able to integrate all the native features into your Bubble app: Touch ID & Face ID, Push Notifications, Camera & Gallery Access, and many others. To be able to use all the native features, the plugin needs to be purchased (one-time payment or a monthly subscription) via Bubble’s marketplace.
The Air Native plugin allows you to implement the native features within your Bubble editor, but in order to convert the Bubble app into native Android and iOS, it is required to use the Air Native service.
If you do not want to use it, simply remove the plugin from the template.
Zeroqode Air Bundle plugin
Note: This template has Zeroqode Air Bundle plugin installed. It contains six most commonly used and complex plugins that will easily extend your application. To be able to use it, the plugin needs to be purchased (one-time payment or a monthly subscription) via Bubble’s marketplace.
If you do not want to use it, simply remove the plugin from the template.
Boost your Bubble skills within our Lab
🎓 Zeroqode Lab: no-code Courses and Tutorials