I am currently working in part on an NFT project, and I am the web designer for it. Most things are coming together nicely, yet I am now experiencing issues with MetaMask integration. I'm not a seasoned coder, and if at all possible, would rather not learn at the moment, but I can't at all figure out how to integrate MetaMask into Wix. I haven't tried much, nor do I really know what I've tried, but I know Wix uses JS in their Velo and Editor X softwares, both of which I am capable of using. If anyone has experience, or knows how to do this, please let me know and I would be more than happy of trying whatever y'all think works! Thanks, Allen
-
> There is a way to do it..... In this site (www.happylittleHairdos.com) on mobile opens new page, and made not with using wix and without iframe (as I understand), ok with iframe in wix for Desktop, but how work with MetaMask in iframe on mobile?– Evgeniya ZaikinaCommented Jan 20, 2022 at 14:37
2 Answers
There is a way to do it. You will have to create a domain that will allow HTTPS (Vercel is an example) host your MM code on the HTTPS site. On wix create a HTTPS iframe, and embed the site that host your MM code. I did it for a project that was on a Wix site. In this instance, I used Bubble's Web3/MM functionality and embedded it to this site: www.happylittleHairdos.com
Use https://metamask.github.io/metamask-deeplinks/ to deep link your site to auto open the MM app
I am not familiar with Wix but this is a great place to start regarding JS documentation: https://docs.metamask.io/guide/ethereum-provider.html#table-of-contents
Metamask is used to block-chain enable the browser by acting as a provider for the web3 library. It basically injects a provider at window.ethereum
. If your use case is as simple as getting account information (e.g., getting the balance of the accounts or requesting a signature from the user) then the Metamask API will suffice, but if you would like something a bit more involved, like making transactions with the accounts provided, you should use the web3 library in conjunction with the Metamask API.
A good starting place for web3 can be found: https://web3js.readthedocs.io/en/v1.5.2/getting-started.html
Ideally you want to try and place the Metamask integration somewhere in the beginning of the app flow. For example during registration. That way the app will be block-chain enabled for the rest of the flows.