Embeddable Storefront
Storefront Features

Storefront Features

Your TimberCloud storefront is where customers browse your catalog, configure products, and place orders or request quotes. Whether shoppers reach it through the embeddable storefront widget on your existing site or through your hosted Website, they get the same modern, mobile-friendly shopping experience powered by your real catalog.

This page covers the customer-facing features built into the storefront: catalog browsing and pagination, live carrier shipping rates at checkout, real-time order tracking, the order add-ons step, the customer-profile requirement, mobile responsiveness, and how all of it behaves in both selling modes.

Note: The storefront's look (light/dark chrome and brand colors) comes from your TimberCloud settings — not from embed code. See Customization and Setup for details. To configure how the storefront sells (Direct Order vs. Quote-Based, price visibility), go to Settings → Orders → Storefront (Storefront settings).

Catalog browsing & pagination

The product catalog lets customers scroll through everything you publish, with filtering and pagination so even large catalogs stay fast and easy to navigate.

Page-size selector. Customers choose how many products appear per page:

OptionBest for
12Detailed browsing
24Default — balanced view
48Seeing more at once
96Maximum per page
AllShow every product (no pagination)

Smart pagination controls. Previous/Next buttons, numbered pages, and a smart ellipsis (…) that always keeps the first and last page visible while condensing the middle. A product counter shows the current range — for example, "Showing 1 to 24 of 156 products."

Changing a filter or the page size automatically returns to page 1 and scrolls back to the top, so customers never lose their place.

Carrier Services at checkout

During checkout, customers can shop live shipping rates from multiple carriers — both small-parcel and LTL freight — and pick the option that works best for them.

How it works for the shopper:

  1. At checkout, they select Carrier Services from the shipping-method dropdown.
  2. A Look up carriers button appears — clicking it opens the carrier modal, which automatically loads available carriers for the shipping address and package details.
  3. They multi-select the carriers they want to compare and click Get Rates.
  4. Live rates appear with the carrier name, service level, estimated delivery time, and price.
  5. They click a rate to select it; the modal closes and the chosen rate is applied to the order total, with a confirmation showing the selected service.

The rate the customer picks is saved with the order and feeds into your in-app shipping workflow. Learn more about how rates, booking, and tracking work on the shop side in Shipping.

Important — plan requirement: Live carrier rate lookup at checkout depends on Carrier Services, which is included on the Build, Production, and Enterprise plans. On Commerce, it requires the Carrier & Freight Services add-on ($99/mo). If Carrier Services isn't enabled for your plan, customers won't see the live-rate option; you can still offer your own configured flat-rate or pickup delivery methods. See Subscriptions & Plans.

Real-time order tracking

Once a shipment is booked, your customers can follow it themselves from their order page — no "where is my order?" email required.

Each order's detail page shows a Tracking Numbers section with:

  • A color-coded status badge for each tracking number (Pending, Info Received, In Transit, Out for Delivery, Delivered, Exception, Delivery Failed, and more).
  • The carrier name and a Track on Carrier Site link.
  • Shipped, estimated-delivery, and actual-delivery dates.
  • A collapsible tracking history timeline of carrier events (location and timestamp for each scan).
  • A Refresh Status button to pull the latest update on demand.

Tracking refreshes automatically about every 60 seconds while the order page is open, and on the back end TimberCloud syncs each active shipment with the carrier network roughly every 15 minutes. When every tracking number on an order shows delivered, the order moves to Delivered automatically. The tracking view is read-only for customers — only your team adds or edits tracking numbers. For the full tracking model, see Tracking.

If an order hasn't shipped yet, customers see a friendly empty state explaining that tracking will appear once the order ships.

The order add-ons step

After configuring their products, customers reach a dedicated order add-ons step where they can attach optional extras to the whole order — things like a delivery surcharge, crating, rush handling, or other one-off charges you offer.

  • Add-ons shown here respect your selling mode and price-visibility settings (prices appear in Direct Order mode and in Quote mode when prices are enabled).
  • The add-ons a customer sees are the order-wide add-ons you've made available, filtered to match the products and categories in their order.
  • Selected add-ons flow straight into the order and appear on the resulting cut sheets, invoices, and packing slips.

You control which add-ons exist, their default scope (per-product vs. order-wide), and how they behave from the admin side. See Order Add-ons to set them up.

Customer-profile onboarding

Logged-in shoppers must complete a customer profile before they can place an order. This keeps your customer records complete and prevents errors at checkout.

What this looks like for the shopper:

  • When a customer registers or signs in without a completed profile, the storefront automatically sends them to an onboarding page and shows a short message: "Please complete your customer profile to continue."
  • They can't browse products or place orders until the profile is finished — only the onboarding and authentication pages stay accessible.
  • After completing the profile, they're returned to their account and can shop freely from then on.

Guest checkout (where enabled) doesn't require a saved profile, but any authenticated account does. The profile a customer fills out here corresponds to their record in your CRM and the storefront customer portal.

Mobile responsiveness & dark mode

The entire storefront is built mobile-first. Product attributes, line items, and the add-ons step were reworked for phones and tablets with large touch targets and properly sized inputs (so iOS doesn't zoom in on form fields). Pagination controls stack vertically on small screens, and the carrier-rate and tracking views adapt to narrow viewports.

The storefront chrome also supports light and dark mode, controlled by your site_theme_mode setting (not by embed code). See Customization for how to set the theme and brand colors.

Works in both selling modes

Every feature above works whether your storefront is set to Direct Order or Quote-Based mode (set under Settings → Orders → Storefront — see Storefront settings):

  • Direct Order — customers configure products, choose shipping (including live carrier rates where available), complete the add-ons step, and pay at checkout. Requires a connected Stripe account on a paid plan.
  • Quote-Based — customers configure products and submit a request you review and price. Prices are shown only when you enable price visibility ("Show prices for quote-based products"); otherwise shoppers see Request Quote buttons.

Important — Free plan: On the Free plan, payments are off and pricing is hidden, so the storefront is inquiry/quote-only — customers submit inquiries rather than paying at checkout. Direct Order, live carrier rates at checkout, and paid checkout require Commerce or higher. Direct Order also automatically falls back to Quote mode whenever Stripe isn't connected.

Related pages

CustomizationAPI Reference