🚨 Tokengates can only work with Shopify Online Shop 2.0 themes
Please note, if you are using a legacy theme it will not be possible to use this feature.
⚠️ Tokengates can't be used with "Buy now" buttons on the product page
For tokengating to work, your customers will need to follow the Add to cart and checkout journey
What are tokengates?
Tokengating is a way of adding more value to an NFT by allowing the holder exclusive access to additional physical or digital products, community, content and more. With tokengating you add rewards, build loyalty and grow engagement. Tokengates provide restricted access to your store that can be marked as free or given a price.
Video tutorial
Create tokengate
Go to the 'Tokengates' tab, hit the 'Create' button to set up a new tokengate
Set up your tokengate
Give your tokengate a name
Add a contract address
This determines which NFTs your customers need to hold to access your gated products
Choose your blockchain
The blockchain must match the chain the smart contract was created on
Check which blockchain your contract was created on by searching for it on Etherscan or Polygonscan
Configure access
Leaving this box unticked means the NFT can only be used to access the gated product once
If you tick "Allow future owners" any wallet address that owns the NFT in the future will be able to access the product. This means the gate will work for ERC-1155 NFTs. The limitation here is that customers can exploit the gate to claim the product more than once by transferring the NFT to other wallets.
Set timing
With scheduled tokengates you can set a start and end time.
By default the start date is immediate but you can update it if you wish
If you select an end date, the tokengate will be replaced with the "Add to Cart" button at the desired time/date
Filter by trait
You can choose to tokengate based on specific traits included in the NFTs
Select product
Add the product you want to tokengate
Hit save!
Configure theme
Configuring your Shopify theme is a necessary step - if it is not configured, the "Connect wallet" button will not display on the product page and your product will not be gated.
After setting up your tokengate, you must update the product template theme to add the connect wallet button.
Go to the Shopify Theme Editor
In the Admin panel on the left, click "Online Store" > "Theme". Under the Current theme, click “Customize”.
Product tokengates
In the theme editor search function, select "Products" and choose "Create Template".
You can also choose to modify the existing product template. This is more convenient if all products in your store are tokengated.
Create template
We recommend choosing the Default Product template but if you are using a custom product template just choose that.
Add the tokengating button
In the "Product information" section choose “Add block” and add the Verisart Tokengate button (you can find it under apps).
Re-order the tokengate button in the section as you require.
Just drag the component to place it in the desired position.
Customize "Connect Wallet" button
You can edit the color of the button and tokengate pop up. Click on the panel and choose your desired colors.
Hit save!
Set the correct theme template on the tokengated product
After choosing from product from the product list. Scroll down until you see the "Online store" panel on the right and select the template for tokengated products.
Hit save! - your tokengate is now ready!
Featured product tokengates
Add the tokengating button
From the menu on the left, click “Add block” and choose the Tokengate button (you can find it under apps).
Hit save - your tokengate is ready!
Verifying tokengated orders
A limitation of Shopify’s checkout that impacts all tokengating apps, including Verisart competitors, is that it’s impossible to create a 100% secure tokengate. Bad actors can exploit this by turning off Javascript in their browser or hacking the style sheet to get around the frontend check that verifies NFT ownership. Once they have a product in their basket, it cannot be removed, even if the gating app detects that they do not have permission to purchase it.
There are different approaches to solving this problem:
One approach is to use Shopify's discount mechanism. The merchant sets a ridiculously high price for the item which discourages bad actors from purchasing it. The tokengate app then applies a discount to the product for those who meet the gating criteria. This is effective, but fiddly.
A simpler approach - and the one taken by Verisart - is to pass information through to the merchant about the gate. We add notes to each tokengated order indicating whether the purchase succeeded or failed. The merchant can then decide how to proceed: They can decide not to fulfill any failed gates.
Shopify acknowledged that neither of these approaches is ideal. On June 2, 2023 Shopify released a new version of their Cart Validation API that addresses this limitation. For the first time, fully secure gates are possible. If a bad actor bypasses the frontend check to put a product in their cart that they don't qualify for, the product can be removed from their cart. Verisart will support this new approach by end of June 2023.
Until June 30, 2023
In the meantime, here's how to verify orders using the current mechanism that Verisart provides:
As mentioned above, the Verisart app adds notes to every tokengated order
View "Additional details" on any tokengated order to view these notes
If the buyer correctly met the tokengate criteria, it shows "Success"
If the buyer has attempted to bypass the tokengate, it shows "Tokengated failed"
If a tokengate fails, it means that the buyer did pass the frontend check and we have no proof that they own the qualifying tokens. You should not fulfill the order. Instead, cancel the order, and reach out to the customer to determine what went wrong. In some cases, the customer may still qualify, but an ad blocker or other browser plug-in may have prevented the gate from operating as expected.
Refunding failed orders
Merchants may choose to refund failed tokengated orders. If so, they may incur costs for issuing refunds depending on which payment provider the buyer used. If the buyer paid with Shopify Payments (or Shop Pay), there should be no cost to refund. Other payment provides may charge. We recommend checking this before you launch your tokengates so you can be aware of the potential costs.
Automatically cancel orders
Shopify Plus merchants can use the Script Editor provided by Shopify to automate the process of canceling failed tokengate orders. This removes the need for the merchant or store admin to review orders and manually cancel them. The Script Editor is useful, but once the Verisart App fully supports the Cart Validation API on June 30, the "review, then cancel" workflow will no longer be needed.
Reporting
You can track how many items have been redeemed from a tokengate in the Verisart App.
Go to the "Tokengates" tab in the Verisart App. A CSV file with the redemptions can be downloaded by clicking on the link in the expanded panel.
