< Back to blog

No-code commerce with Commerce Rays

Today we launch a new, first of its kind product for commerce, Commerce Rays.

Commerce Rays is a no-code, visual page builder for creating customizable product and checkout experiences. We’ve paired our deep knowledge of API-first commerce with modern, frontend page rendering technologies, to bring you a no-code landing page builder for commerce.

Commerce Rays is built on top of our commerce infrastructure and dashboard, but can also be used alongside your existing eCommerce platform.

We have Shopify integrations available for paid plans.

Want to create a Ray now? Every account on the Standard (free) plan can create 1 Ray! Free sign up here.

Creating a commerce Ray

What are Commerce Rays for?

From product experimentation, to affiliate campaigns, Commerce Rays was built to support a wide range of commerce initiatives and experiences.

Campaigns

Create campaign microsites and content that immediately convert customers. Design and publish highly personalized campaign landing pages for specific products, regions, and events.

Product drops

Generate a bit of hype and drop a new product for your audience. Create urgency and scarcity by showing the live stock limits. Unpublish the site when the drop is over.

Influencers

Tribe based purchasing behaviour thrives on community and authenticity. Let influencers create content and purchasing experiences that resonate specifically with their audiences. With Commerce Rays, influencers can create experiences for your products that generate and convert customers without making changes to your main website.

Running ads for your products? Commerce Rays lets you optimize the story you tell to customers who have just heard of you, without changing your primary product display page. Create longer form landing pages that tell more of a story, leave customers fewer places to click, and drive them towards checking out. Experiment with what converts best by setting up A/B testing. Rinse and repeat.

Blogs, Newsletters

A compelling piece of content can be enough to turn anyone into a customer, so why send them somewhere else to convert? Instead, embed or iframe a pre-loaded checkout into your blog, existing marketing page, or newsletter.

The Beam checkout below and example of dropping a very personalized, customisable checkout, right where the customer is 👇.

Microsites

Maybe you don’t need a full website and web presence to sell your products. Commerce Rays are lightweight enough that you can create and publish a page in ~15 mins. Perfect for those with Instagram, Twitter, YouTube audiences.

Why did we build Commerce Rays?

If we look at where Headless Commerce is today, it’s primarily geared towards experienced developers and enterprise businesses. However, with the growth of eCommerce in 2020, and the high expectations that consumers now have, there’s a growing demand for headless commerce from the whole market.

We spent 2020 helping developers of any experience, and business of any size to create API-driven commerce, but it’s not enough. The non-developers, marketers, sales, and solo entrepreneurs also need to participate in this new wave of commerce.

Frankly, it saddens us to hear of situations like these 👇 Screen Shot 2021-01-21 at 2.55.43 PM

There’s a lot to unpack in that tweet, but at its core, Mark hits the current state of headless commerce pretty well on the head. It’s the non-developers that desperately need tooling to be able to experiment, expand, generate hype, and generate sales.

Commerce Rays is a way for marketers, content teams, solopreneurs, influencers, and educators (who are currently being left behind in the headless movement) to now participate in the API-first commerce economy.

A closer look

Let’s dig a little deeper into how Commerce Rays works, and what’s possible right now.

Templates

We have 4 no-code templates you can pick from and customize. Templates are written in the React framework Next.js, and are hosted by Vercel. Rays are powered by Commerce.js and the Chec API.

All templates support physical and digital products and their variants;

  • Gleam — for single products and long form product content
  • Beacon — for multiple products with cart
  • Glint — for gift cards and digital products
  • Beam — a 100% customizable checkout that can be embedded anywhere

Creating a Ray

Let me show you how easy to use. I’m going to pretend to be an influencer selling 2 products on behalf of a brand. See the live demo here.

You can watch a video tutorial on creating a Ray here.

Setup

Create and setup your account, configure information like your seller / business name, shipping zones, payment gateway (Stripe only), and tax. You can use the test gateway initially. Getting started

Add products

Add the products in the dashboard that you want to sell. I’m going to sell a pink hoodie, and a recipe (digital recipe product). Add product into the dashboard

Pick a template

We currently have 3 template to choose from and customize. Because I have multiple products to sell, I’m going to use the Beacon template. Templates-view

Customize the experience

This is where the fun really starts! In real time, edit your assets, copy, color palette, and even the checkout. Tab between mobile and desktop views while you edit to make sure the experience fits the device customers are most likely to purchase on.

Creating a commerce Ray

Save and publish

When you’re happy with your page, save and publish your Ray to the web! You’ll be given a randomly generated URL to sell with, that can also be masked to your own custom domain. Screen Shot 2021-01-21 at 3.04.33 PM

Your Ray can be edited and updated at any point, just make edits and then save and publish.

See the live demo here.

Shopify integration

We offer a Shopify integrations for Rise and Growth plans. This integration syncs orders made on a Ray back into your Shopify store. This is a great integration for those businesses who are on Shopify and want to safely experiment with headless, without changing their whole site and impacting their post purchase fulfilment pipeline.

What’s next

So much! We're working hard to bring you more templates that support even more ways to sell, including;

  • Multipage templates
  • Custom templates
  • More payment gateway support
  • Making templaces open source
  • Allowing developers and agencies to create templates for clients

If you are interested in creating custom themes for hyour clients, we'd love to hear from you.

Now anyone can go headless

This is an exciting product release for us as we continue to push for a new standard in commerce. With Commerce Rays, we're showing the power of backend commerce APIs and how they can be leveraged bring value to non-developers.

We hope you have fun creating your first Commerce Rays!