How to Build a Custom E-Commerce Site with Blocs 

Blocs is a static website builder that creates fast, beautiful websites. Learn how to add professional e-commerce functionality to your Blocs site using external services.

Why this matters: You get a unique, custom-designed store without sacrificing powerful shopping features.

What You'll Learn

• How to integrate e-commerce into static websites
• Three methods for adding shopping features
• Which solution fits your needs
• Step-by-step setup process
• Important requirements and limitations

Core Concept

Blocs creates fast, static websites without databases or server-side processing. To add e-commerce, you connect external services that handle:

• Product management
• Shopping carts
• Secure checkout
• Order fulfillment

The benefit: Your store looks custom-built while having professional shopping features.

Step 1: Choose Your Blocs Template

Start with a premium template that matches your brand. Find templates at Blocs Templates or Project Elements.

Step 2: Choose Your Integration Method

Method 1: Buy Buttons

Best for: Selling a few products or accepting donations

How it works: Add a button that opens checkout in a popup or new page

Popular services:

• Gumroad (digital products)
• Sellfy (digital and physical products)
• Paddle (software and SaaS products)
• Stripe Payment Links
• PayPal Buttons

Method 2: Embedded Storefronts

Best for: Multiple products with categories and variants

How it works: Embed a complete store into your Blocs page

Popular services:

• Ecwid (most recommended)
• Sellfy (simple embedded store)
• Shopify (via Buy Button)
• Foxy.io
• Snipcart

Method 3: Headless Commerce

Best for: Advanced users needing custom designs with powerful backends

How it works: Use Shopify as backend, Blocs as frontend

Options:

• Simple: Shopify Buy Button
• Advanced: Shopify Storefront API (requires developer)

Step 3: Choose Your E-Commerce Service

Your template handles design. Your e-commerce service handles transactions, payments, and inventory.

Paddle

• Best for: Digital products, software, SaaS
• Why: Handles global taxes, subscriptions, and license keys automatically. Acts as Merchant of Record.
• How: Embed Paddle "Buy Now" button code into your product pages.

Gumroad

• Best for: Creators selling downloads and memberships
• Why: Simple, creator-friendly platform for digital products.
• How: Embed Gumroad product widgets or buttons.

Sellfy

• Best for: Creators and small businesses selling digital or physical products
• Why: All-in-one solution with built-in marketing tools and email campaigns. Great for mixed product types.
• How: Embed Sellfy store widget or individual product buttons.

Shopify

• Best for: Serious online stores with growth plans
• Why: Powerful platform with extensive apps, shipping integrations, and POS systems.
• How: Generate Shopify Buy Button code and embed into your Blocs pages.

Ecwid

• Best for: Full physical product stores
• Why: Complete store with inventory, variants, and shipping management. Seamlessly integrates into existing websites.
• How: Embed the entire Ecwid store widget into your shop page.

Snipcart

• Best for: Developers wanting maximum design control
• Why: Preserves your custom design while adding cart functionality.
• How: Add Snipcart scripts and use HTML data attributes on products.

Stripe

• Best for: Custom checkout flows (advanced)
• Why: Complete control over the purchase experience.
• How: Use Stripe API with custom JavaScript (requires development skills).

Step 4: Build Your Store

Follow this simple workflow:

1. Purchase and customize your Blocs template
2. Sign up for your chosen e-commerce service
3. Add products and configure settings (tax, shipping)
4. Copy the embed code from your service
5. Paste code into a Code Bloc or HTML Embed Bloc in Blocs
6. Publish your site

Requirements

• Your Blocs site must be hosted online
• You'll pay fees to your e-commerce service
• Checkout always happens on the service's secure page
• You cannot build shopping carts purely in Blocs

Quick Service Comparison

• Paddle: Software and SaaS with automatic tax compliance
• Gumroad: Simplest for digital creators
• Sellfy: Easy all-in-one for creators (digital + physical)
• Shopify: Enterprise-level features and scalability
• Ecwid: Best embedded storefront experience
• Snipcart/Stripe: Maximum customization (technical)

Quick Decision Guide

• Single product? → Use Gumroad, Sellfy, or Stripe buttons
• Software/SaaS? → Use Paddle
• Multiple products? → Use Ecwid or Sellfy
• Large store? → Use Shopify Buy Buttons or headless setup

The Result

You get a unique, beautiful website with professional e-commerce functionality. No compromises between design and features.

Your store will:

• Stand out from template-based competitors
• Handle transactions professionally
• Reflect your brand identity
• Convert visitors into customers

Ready to Start?

1. Browse premium Blocs templates
2. Pick your e-commerce partner
3. Launch a store that breaks the mold

Build something that looks custom and works professionally.