Cover photo

ERC721 Mint by Crossmint

  • React Component

import { CrossmintPayButton } from "@crossmint/client-sdk-react-ui"
import { FC } from "react"

export const ERC6551_REGISTRY_ADDRESS = "0x02101dfB77FDE026414827Fdc604ddAF224F0921"
export const ERC6551_IMPLEMENTATION_ADDRESS = "0x2d25602551487c3f3354dd80d76d54383a243358"
export const ERC6551_INIT_DATA = "0x8129fc1c"

interface CrossmintButtonProps {
  wallet: string
  quantity: number
}

const CrossmintButton: FC<CrossmintButtonProps> = ({ wallet, quantity }) => {
  const { referral } = useInvest()
  const referralProjectId = "425871f8........125f28bcd"
  const referralCollectionId = "6a032ac..........cc260"
  const mintConfig = {
    type: "erc-721",
    totalPrice: "0.000001", // 0.000001 eth
    quantity,
    _target: process.env.NEXT_PUBLIC_DROP_CONTRACT,
    _quantity: quantity,
    _to: wallet,
    to: wallet,
    _registry: ERC6551_REGISTRY_ADDRESS,
    _implementation: ERC6551_IMPLEMENTATION_ADDRESS,
    _initData: ERC6551_INIT_DATA,
    referralId: referral,
  }

  return (
    <CrossmintPayButton
      projectId={referral ? referralProjectId : process.env.NEXT_PUBLIC_CROSSMINT_PROJECT_ID}
      collectionId={
        referral ? referralCollectionId : process.env.NEXT_PUBLIC_CROSSMINT_COLLECTION_ID
      }
      environment="staging"
      mintConfig={mintConfig}
      mintTo={wallet}
    />
  )
}

export default CrossmintButton

If we use crossmint, we can create, sell and store NFTs in minutes with APIs, fiat on-ramp & user-friendly wallets - no cryptocurrency required.

Payments

NFT checkout

Accept any payment method for your NFT sales: Debit & credit cards, Apple Pay, cross-chain payments, and more.

https://www.crossmint.com/products/payments

Minting APIs

Create and distribute NFTs

Mint, edit, and burn NFTs. Airdrop them into emails or wallets with a single API call. No crypto required.

https://www.crossmint.com/products/minting-api