Skip to content
VivrealDocs

Set Up Stripe Payments

Connect Stripe, sync products, and enable payments on your Vivreal-powered site

intermediate20 min read

Set Up Stripe Payments

This tutorial walks you through connecting your Stripe account to Vivreal, syncing your product catalog, and deploying an ecommerce site that accepts real payments.

Prerequisites

  • A Vivreal account with an active group on a paid tier (Basic or above)
  • A Stripe account with at least one product created
  • Familiarity with the Vivreal portal (see Build a Product Catalog first)

Navigate to Integrations

Tap Channels in the bottom navigation bar. You will see a grid of available integrations. Find the Stripe card and click Connect.

Enter your Stripe API key

In the configuration dialog, paste your Stripe Secret Key from the Stripe Dashboard (Developers → API Keys). Vivreal encrypts this key with AES-256-GCM before storing it.

Click Save to activate the integration.

Use your test mode key while setting things up. Switch to the live key only when you are ready to accept real payments.

Create products in Stripe

If you have not already, go to Products in your Stripe Dashboard and create a few products with prices. Each product should have a name, description, and at least one price.

Sync products to Vivreal

Back in the Vivreal portal, open the Stripe integration page and go to the Settings tab. Click Sync from Stripe. Vivreal will pull all your products and create corresponding integration objects.

After the sync completes, switch to the Products tab to see your imported items.

Create a Products collection

Navigate to Collections and create a new collection called "Products" if you do not already have one. Use the schema from Build a Product Catalog — the key fields are name, price, description, and images.

Deploy with the Ecommerce template

Go to Sites → + New Site. Choose the Ecommerce template. This template includes product listing pages, detail pages with an "Add to Cart" button, and a Stripe Checkout flow.

Once deployed, visit your site and try purchasing a test product using Stripe test cards.

You can re-sync products at any time. New products in Stripe will be added, and existing ones will be updated. Deleted products in Stripe are not automatically removed from Vivreal — delete them manually if needed.

How It Works

The ecommerce template resolves the Stripe key server-side from your group's integration settings. Your secret key is never exposed to the browser. The checkout flow uses Stripe Checkout Sessions to handle payment securely.

Next Steps

  • Set up webhook notifications for order events — see Automate with Webhooks
  • Customize the ecommerce template by editing your site branch
  • Enable overage billing in Group settings if you expect high traffic