LogoLogo
Manifold for Developers
Manifold for Developers
  • Introduction
  • Shopify Merch Bridge
    • Overview
    • Tutorial
      • Step 1: Product Gate Setup
        • 1.1: Configure the Product
        • 1.2: Install Manifold Merch Bridge
        • 1.2: Create a New Product Gate
        • 1.3: Link a Product to the Gate
        • 1.4: Add Rules
      • Step 2: Store Theme Setup
        • 2.1 The Theme Editor
        • 2.2 Product Page Setup
        • 2.3 Cart Page Setup
    • Advanced Configuration
    • FAQ / Error Help
    • Reference
      • Product and Gate Configuration
        • Shopify Products
        • Product Gates
          • Gate Products
          • Rules
      • Custom Themes
      • Updating to the Latest Version
      • UI Configuration Options
      • Advanced Usage
      • Common Issues
  • Guides
    • Getting Started
    • HTML
    • React
    • NextJS
    • Vue
    • Wix
    • Squarespace
      • Simple Squarespace Site
      • Customised Squarespace Template
  • Resources
    • Apps
      • Grant Types
    • Widgets
      • Directory
      • Manifold CSS Variables
        • Scheme Utility Classes
        • List of Manifold CSS Variables
      • Connect Widget
        • Blockchain Interaction
        • Wallet Authentication
        • Data Client
          • NFT Information Retrieval
            • getNFT
            • getNFTsOfOwner
            • ownerHasNFT
            • getCollectors
          • Data Storage and Retrieval
        • Advanced Configuration
        • Customization & Styling
        • Automatic Error Handling
      • Campaign Widget
        • Campaign Creation
          • Questionnaire
        • Campaign Progress
        • Customization & Styling
      • Curation Widget
      • Marketplace Widgets
        • Widgets
          • Data Attributes
          • Layout Widgets
          • Card Widgets
          • Listing Widgets
        • Window Events
        • Troubleshooting
        • Customization & Styling
        • Version Change Notes
          • 3.2.1 - CSS Selector Changes
          • 3.1.1 - CSS Selector Changes
      • Claim Widgets
        • Widgets
          • Data Attributes
          • Complete Claim Widget
          • Buy Button Only Widget
          • Mint Count Widget
        • Troubleshooting
        • Customization & Styling
        • Version Change Notes
          • 1.7.0, 1.7.1 - CSS Selector Changes
      • Restricted Token Widget
        • Customization & Styling
      • Wallet Identity Widget
        • Customization & Styling
      • Subscription Widget
      • 6551 Display Widget
    • Manifold Ethereum Provider
  • Tools and APIs
    • Merkle Tree Tool
    • Snapshot Tool
    • Discord Tools
    • Server-Side Session Authentication
      • Signature Grant
      • Authorization Code Grant
  • Smart Contracts
    • Manifold Creator
      • Contracts
        • Creator Core
          • Common Functions
          • ERC721 Functions
          • ERC1155 Functions
        • Extensions
          • Extensions Functions
          • Extensions Examples
          • Extensions Deployment Guide
            • Dynamic NFT Extension
            • Lazy Mint Extension ERC1155
            • Lazy Mint Extension ERC721
        • Mint Permissions
          • Mint Permissions Functions
      • Prior Versions
        • 1.0.x
          • Creator Core
            • Common Functions
            • ERC721 Functions
            • ERC1155 Functions
          • Extensions
            • Extensions Functions
            • Extensions Examples
            • Extensions Deployment Guide
              • Dynamic NFT Extension
              • Lazy Mint Extension ERC1155
              • Lazy Mint Extension ERC721
          • Mint Permissions
            • Mint Permissions Functions
        • 2.0.x
          • Creator Core
            • Common Functions
            • ERC721 Functions
            • ERC1155 Functions
          • Extensions
            • Extensions Functions
            • Extensions Examples
            • Extensions Deployment Guide
              • Dynamic NFT Extension
              • Lazy Mint Extension ERC1155
              • Lazy Mint Extension ERC721
          • Mint Permissions
            • Mint Permissions Functions
    • Marketplace
      • Identity Verifier
    • Royalty Registry
  • Contact Us
Powered by GitBook
On this page
  • Peer Dependencies
  • Overview
  • Adding the Campaign Widget

Was this helpful?

  1. Resources
  2. Widgets

Campaign Widget

Add token gated experiences to your website.

Last updated 1 year ago

Was this helpful?

Campaign Widget requires a Manifold Developers account and API credentials. For more information follow our guide.

Current Version

0.2.1

Javascript Library

https://campaign.manifoldxyz.dev/0.2.0/campaign.umd.min.js

Base CSS

https://campaign.manifoldxyz.dev/0.2.0/campaign.css

Required Properties

  • data-widget: "m-campaign"

  • data-campaign-id: The id of the you've created

  • data-app-name: Your 's Name

  • data-client-id: Your 's Client ID

  • data-network: The network chain id you wish to use (e.g. Ethereum Mainnet is 1).

  • data-grant-type: "signature"

The data-app-name, data-client-id and data-network props MUST match the values used for the or your instantiated instance of the , otherwise the widget will not work.

Peer Dependencies

Overview

Once a campaign is set, the Connect Wallet and Campaign widgets will need to be embedded within your site, referencing your Client and Campaign IDs from Manifold Developer Portal. From here you’re good to go. Upon campaign start collectors can connect their wallets, navigate through the redemption widget to prove NFT ownership, and finalize their secure checkout or data entry.

Check out a brief demo of the customer experience below and read on for full documentation and instructions for configuring and executing token gated experiences!

Adding the Campaign Widget

Version 0.2.0 and above requires (>= 3.0.0).

Using the Campaign Widget is the easiest way to integrate token gated experiences within your app or site. Campaign Widget builds upon our Connect Wallet widget, using an OAuth connection to query NFT data of your connected users via Manifold APIs. Campaign Widget uses this information in conjunction with configurable token gated “campaigns” managed in the .

Within each campaign things like start and end date, the tokens required for claim, and the experiences you want to make available can be configured. We've launched token gating in conjunction with , our official Shopify App to make token gating products from your Shopify store simple and easy. We've also created an option to run your own token-gated data collection via custom forms so you can gather collector data to use however you please. We'll be adding a number of other cool token gated features down the line as well.

You can find detailed instructions on how to install and use widgets for your specific website stack by visiting the .

Getting Started
Campaign
App
App
Connect Widget
Manifold Ethereum Provider
Connect Widget
Manifold Developer Portal
Manifold Merch Bridge
Getting Started Guide