Create a fully customized embedded memecoin checkout experience that accepts credit cards
Solana Wallet
Get API Keys
http://localhost:3000
and click "Add origin".Next, check the scopes labeled orders.create
, orders.read
, orders.update
.Finally, create your key and save it for subsequent steps.solana:${tokenMintHash}
solana:6p6xgHyF7AeE6TZkSmFsko444wqoP15icUSqi2jfGiPN
tokenMintHash
: The token mint hash (commonly known as contract address, CA, or mint hash)<blockchain>:<contractAddress>:<tokenId>
ethereum:0x1234567890123456789012345678901234567890:1
blockchain
: The chain name (ethereum, polygon, arbitrum, base, etc.)contractAddress
: The token contract address (40 hexadecimal characters)tokenId
: For fungible tokens, use "1" as a placeholder value (required by validation schema)<blockchain>:<contractAddress>:<tokenId>
for all EVM tokens. For fungible tokens (memecoins), use "1" as the tokenId value.receiptEmail
: Required for delivering payment receiptsexecutionParameters.mode
: Set to “exact-in” for memecoin purchases (specifies exact USD amount to spend). “exact-out” is for NFTs, while “exact-in” is for fungible tokens.maxSlippageBps
: Optional slippage tolerance (default is typically 500 BPS or 5% if not specified)7EivYFyNfgGj8xbUymR7J4LuxUHLKRzpLaERHLvi7Dgu
). For production launch with live memecoin tokens, contact our
sales team.@crossmint/client-sdk-react-ui
dependency and add the embedded checkout component. To get started:
Create a new Next.js application
y
and press Enter
to proceed:Name your app `crossmint-embedded-checkout-demo` and accept the default options
Change into the directory created in previous steps
Install @crossmint/client-sdk-react-ui
Open the project in your preferred code editor
Add environment variables
.env.local
in your project root:Create the checkout page
/src/app/page.tsx
with:Run your app
http://localhost:3000
to see your checkout!Test your app
4242424242424242
(Visa). More information on testing can be found here.For production launch with live memecoin tokens, contact our sales team.executionParameters.maxSlippageBps
. If not provided,
Crossmint will use the default slippage configuration (typically 500 BPS or 5%) from Crossmint's providerIs there a UI Crossmint provides?
Do I need to complete KYC to purchase memecoins?
What happens if my transaction fails?
What are the transaction limits?
Is there a limit on how much of a single token I can sell in a day?
What do the order creation parameters mean?
method
: Set to checkoutcom-flow
for Checkout.com credit card paymentscurrency
: Set to usd
for US Dollar paymentsreceiptEmail
: Required for credit card payments to deliver receipttokenLocator
: Specifies the memecoin token address in the format solana:tokenAddress
executionParameters
:
mode
: Set to "exact-in" for memecoin purchases (specifies exact USD amount to spend)amount
: Amount to purchase in USDmaxSlippageBps
: Set to "500" for 5% slippage tolerance. If not provided, the default slippage will be applied from the available liquidity provider.checkoutcomPaymentSession
: Contains the payment session information from Checkout.com
id
: The payment session IDpayment_session_secret
: The secret used to authenticate with Checkout.compayment_session_token
: The token used to initialize the Checkout.com Flow componentcheckoutcomPublicKey
: The public key used to initialize the Checkout.com Flow component