Quick Links

Cryptocurrency is becoming more well-known every day, and more online storefronts are choosing to offer it as an alternate method of payment alongside credit cards and other digital wallets. How do you integrate it on your e-commerce site?

How Does This Work?

Technically, you don't need any sort of integration on your website. Cryptocurrencies aren't like credit cards. They're actually more like digital cash and have built-in payment and wallet systems. So, you could just have people send payments directly to your wallet, similar to paying in cash at a brick-and-mortar store.

However, that's messy, and it would be nicer to have a complete checkout system easily integrated on your site so that users can check out quickly and receive their products immediately. There are a couple of cryptocurrency payment processors that you can integrate on your site. Coinbase is the most popular, although there are others, like CoinPayments and BitPay.

Using these payment processors, you can create checkout pages that integrate with your existing systems. If you're using a platform that supports these directly, like Shopify and WooCommerce, you'll simply need to link them. Otherwise, you'll need to use a processor's API directly.

Using Shopify

If you're using Shopify, one of the biggest platforms for e-commerce, you're in luck, because cryptocurrency has first-class support on the platform. Shopify supports many alternative payment methods, including Coinbase and a few other crypto processors.

If you're not using Shopify but are looking to build an e-commerce website, we recommend it anyway for its ease of use.

Head over to the Settings at the bottom left of your store dashboard and click "Payments."

Head over to the Settings at the bottom left of your store dashboard and click "Payments." 

Then, select "Alternate Payment Providers" and search for Coinbase.

Select "Alternate Payment Providers" and search for Coinbase.

You'll then need to enter your Coinbase email and API key, which you can find at Settings > API. After that, users will be able to use Coinbase in addition to other payment providers that you support.

Shopify doesn't just support cryptocurrency payments, of course---you can use them to accept credit card payments on your website.

Using WooCommerce for WordPress

WooCommerce is a popular plugin for selling products from WordPress sites and has integrations with Coinbase. You'll need to install the Coinbase Commerce Payment Gateway plugin from the WordPress marketplace.

Install the Coinbase Commerce Payment Gateway plugin from the WordPress marketplace. 

Then, under WooCommerce > Settings > Payments, you'll need to enable it. And next, under Manage, you'll need to configure the plugin.

under WooCommerce > Settings > Payments, you'll need to enable the plugin and configure it under "Manage."

This panel needs two things from you---your Coinbase API key and the "Webhook Shared Secret," which Coinbase uses to message WordPress. You'll need to add an endpoint from the Coinbase webhook subscriptions page and copy the shared secret into the box.

Using Coinbase Payments

Coinbase, much like PayPal, supports embeddable buttons that you can add on your website. If you're looking for a more advanced integration, though, you'll need to use their API directly.

Head over to the Coinbase Commerce Dashboard and select "create a checkout." Enter your product information, description, and price, and then upload an image.

In Coinbase Commerce Dashboard, select

Then, you'll get an embeddable checkout button or a link to a checkout page.

You'll get an embeddable checkout button or a link to a checkout page.

By itself, this is just a button through which to send cash. If you want to automatically do something after the payment is complete, you'll need to register a callback function.

BuyWithCrypto.registerCallback('onSuccess', function(e){
    

// Charge was successfully completed

});

BuyWithCrypto.registerCallback('onFailure', function(e){

// Charge failed

});

BuyWithCrypto.registerCallback('onPaymentDetected', function(e){

// Payment has been detected but not yet confirmed

});

Which will be called with the following event object:

{ buttonId: "unique id for this embeddable button", code: CHARGE_CODE, event: "charge_failed" OR "charge_confirmed" OR "payment_detected" }