Step-by-Step Guide for Configuring Shopify Web3 Login and Token Gating

Login to your Shopify store with a crypto wallet and gate content by NFT: With Web3 Single Sign-On, you get instant access to your account without waiting for the service provider’s server. Allow login only from crypto wallets that hold specific NFTs, or provide gated content to an NFT-specific collection. This guide shows you how to configure the miniOrange Shopify Web3 Login and Token Gating application so you can enable MetaMask login and token-based restrictions on your store.

Pre-requisite: Shopify Web3 Login and Token Gating Application

To configure SSO into Shopify with a Web3 MetaMask wallet and token gating, install the miniOrange Shopify Web3 Login and Token Gating application on your store.

• Log in to your Shopify Admin.
• Go to Apps → Shopify App Store.
• Search for Shopify Web3 Login and Token Gating (by miniOrange) or click here to add the app.
• Click Get this application to install. The app works on both Shopify Plus and non-Plus stores.

Step-by-Step Guide for Configuring Shopify Web3 Login and Token Gating

Locking means restricting users from accessing locked content on the Shopify store. Lock criteria can include: users must be logged in, users must have specific customer tags, users must have a passcode, or users must be from a specific location to access the content.

Step 1: Install the application on your Shopify store

• Click here to add the Shopify Web3 Login and Token Gating application to your Shopify store. After installation, open the app from Apps to access the dashboard.

Step 2: How to log in using a MetaMask wallet

• Once the application has been successfully installed, you will see the application dashboard. Enable the Display Login Widget on Storefront option as shown below.

• Click the Preview theme button and manage the styling of the login widget. Enable the Web3 login widget and click Save in the top-right corner.

• Go to your Shopify store login page. You will see the Login with Crypto Wallet button.

• To log in with MetaMask on your Shopify store, add the MetaMask extension to your browser. If you use Chrome, click here to add the MetaMask extension.
• After clicking Login with MetaMask, a popup appears for the signature request. Enter your credentials and sign in to your MetaMask wallet.

• You will be successfully logged in to your Shopify store.

Step 3: Enable token gating over your store

• In the application dashboard, enable Token Gating over Products as shown below.

• If your store is password protected, add your storefront_digest cookie value as shown below. Refer this guide to get your storefront_digest cookie.

• Go to the Token Gating section in the left navigation bar.
• Click Start Locking. You will be redirected to the New Lock section in the upper navbar.

Step 4: Select the type of content to lock

• Select the template and enable the toggle for the content type you want to lock (e.g. Products). You can select multiple items under Content to be Locked and combine content from multiple templates.

• For example, to create a lock on products: click Enable for Products, select the products to lock, then click Create Lock.

Step 5: Add token for the campaign

• Content will be unlocked only if the user has any of the tokens you add below.
• Click Add new token.

• Enter the token Contract address and choose the condition that matches your requirements. Click Add Token.

Step 6: Allow or restrict

• Choose whether to allow or restrict access to content when a customer satisfies the lock criteria.

Step 7: How to lock?

• Define the behavior for users who fail the lock criteria. You can:
• Redirect to login URL
• Redirect to store page
• Show custom HTML
• Redirect to another URL
• Click Save. You can view, enable, disable, edit, or delete locks from the dashboard.

Step 8: Enable the token gating theme extension

• Click Enable and Preview in Theme and enable the Theme app extension.

• Enable the Token Gating block in the theme editor and click Save in the top-right corner.

You have successfully configured Shopify Web3 Login and Token Gating application in your Shopify store.