Skip to main content

Shopify Integration

Accept crypto payments on your Shopify store with Pelago.

Installation​

From Shopify App Store​

  1. Visit the Pelago Shopify App
  2. Click Install App
  3. Authorize the app
  4. Enter your Pelago API credentials
  5. Configure your settings

Manual Installation​

For custom Shopify themes:

<!-- In checkout.liquid or cart.liquid -->
<script src="https://js.pelago.tech/shopify.js"></script>
<script>
  Pelago.init({
    publicKey: '{{ shop.metafields.pelago.public_key }}',
    buttonSelector: '#pelago-checkout-button'
  });
</script>

<button id="pelago-checkout-button">
  Pay with Crypto
</button>

Configuration​

Dashboard Settings​

In the Pelago Shopify app settings:

SettingDescription
API KeyYour Pelago public key
Merchant WalletCrypto wallet for payments
NetworksEnabled blockchain networks
CurrenciesAccepted cryptocurrencies
Checkout ModeRedirect or embedded

Theme Customization​

/* Customize the Pelago button */
#pelago-checkout-button {
  background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
  color: white;
  padding: 12px 24px;
  border-radius: 8px;
  font-weight: 600;
}

Payment Flow​

Order Fulfillment​

Orders paid via Pelago are automatically:

  • Marked as Paid in Shopify
  • Tagged with pelago-payment
  • Updated with transaction hash in notes

Webhooks​

The Shopify app automatically handles:

  • payment.completed → Mark order paid
  • payment.failed → Notify customer
  • payment.refunded → Process Shopify refund

Customization​

Custom Checkout Button​

{% if settings.pelago_enabled %}
  <div class="pelago-payment-option">
    <h4>Pay with Crypto</h4>
    <p>Fast, secure crypto payments via Pelago</p>
    <button 
      id="pelago-pay" 
      data-amount="{{ cart.total_price | money_without_currency }}"
      data-currency="{{ cart.currency.iso_code }}"
    >
      <img src="https://assets.pelago.tech/icons/crypto.svg" alt="Crypto" />
      Pay {{ cart.total_price | money }}
    </button>
  </div>
{% endif %}

Multi-Currency Support​

// Auto-detect customer currency
Pelago.init({
  publicKey: PELAGO_PUBLIC_KEY,
  currency: Shopify.currency.active,
  cryptocurrency: 'USDC',
  network: 'stellar'
});

Testing​

Sandbox Mode​

Enable sandbox in app settings:

  1. Go to Settings → Development
  2. Toggle Sandbox Mode
  3. Use test API keys

Test Orders​

Create test orders using Shopify's test payment gateway, then select Pelago at checkout.

Troubleshooting​

Button Not Appearing​

  1. Check theme compatibility
  2. Verify API key is correct
  3. Check browser console for errors

Orders Not Updating​

  1. Verify webhook URL in app settings
  2. Check Shopify permissions
  3. Review webhook logs in Pelago dashboard

Next Steps​