Jason Andres edited this page Aug 7, 2018 · 17 revisions

Quick Start

Include the Commerce7 Javascript and CSS snippets to every page on your site.


Add the following snippet to the </head> tag.

<link href="https://cdn.commerce7.com/beta/commerce7.css" rel="stylesheet">


Add the following snippets above the closing </body> tag. Replace the data-tenant="tenantId" with your tenantId.

<script type="text/javascript" src="https://cdn.commerce7.com/beta/commerce7.js" id="c7-javascript" data-tenant="tenantId"></script>

You can get the tenantId from the Commerce7 admin panel, it is the first part of the URL.

eg. https://jason-demo-site.admin.platform.commerce7.com/ tenantID = jason-demo-site

Include the Commerce7 <div> tags to you to your page.

Main content (such as the product list, drilldown, checkout, cart)

<div id="c7-content"></div>

Login/Logout at the top of the page. (Will output "Hello Andrew | Logout") for a logged in user.

<div id="c7-login"></div>

Side cart where you want a cart to show on a page.

<div id="c7-cart"></div>

Create the following routes inside your CMS.

Commerce7 places content in the <div id="c7-content"></div> based on the URL of the page.

  • /collection/{slug} - for all product lists
  • /product/* - for all product details
  • /profile/* - for all pages under the user profile
  • /cart - for the cart page
  • /checkout/* - for the checkout area
  • /club/* - for the club signup.

Ensure you have a few basic pages

Our system sometimes links to your CMS pages. Setup the routes below or edit website messages to link an alternate location.

  • /privacy - Our checkout and club signup link to your privacy page.
  • /terms - Our checkout and club signup link to your terms and conditions page.
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.