Webflow Online Store Overview

Discover Webflow Ecommerce! This guide provides an overview of all the fundamental pieces that allow you to build, design, and launch your store.

While utilizing Webflow Ecommerce, you have the ability to construct and craft digital shops, personalize every aspect of your shopping cart and checkout experiences, oversee products and orders, establish and initiate a fully operational, entirely personalized online store without the need to code.

Within this guide
  1. ‍Establishing your shop
  2. ‍Customizing your shop
  3. Unveiling your shop
  4. ‍Promoting your products and online shop
  5. Handling orders

Setting up your shop

Commence with Webflow Ecommerce by opting for a template or commencing from scratch. Ecommerce will be automatically activated if you choose an Ecommerce template. If you opt for a different template, start from scratch, or modify an existing site, you can enable Ecommerce by selecting the Ecommerce icon in the left-hand sidebar.

After enabling Ecommerce, numerous Ecommerce features (elements, pages, collections, settings) will be accessible for you to commence in the Designer and Editor.

You can follow the Configuration guide in the Ecommerce panel to configure your shop and launch it or refer to this guide, which is also connected to a wealth of educational materials related to Webflow Ecommerce.
References

Ecommerce compilations

Two Ecommerce compilations, Products and Categories, are automatically set up for you to initiate your Webflow shop: Products and Categories. These are dynamic compilations, akin to CMS compilations. Nevertheless, unlike CMS compilations, Ecommerce compilations have some distinctions. Explore the resources below to delve deeper into dynamic compilations in general and Ecommerce compilations in particular.

Products and groupings

After enhancing your compilation structure, you can initiate adding products to your shop and categorize them. This can be done manually or automatically by integrating with other services like Zapier.

Discover more
  • Ecommerce compilations and default product fields
  • Incorporating and managing products and categories
  • Formulating product options and variations
  • Integrating products
  • Monitoring stock levels

Customizing your shop

When it pertains to customizing your shop, you possess the equivalent design liberty and adaptability as with the CMS — thereby, the shopping experience can seamlessly blend with the rest of your site. You can create filtered, restricted, and paginated lists of products and highlight them on your homepage.

Ecommerce components and pages

You can also establish compilation template pages for your products and categories, and even tailor the checkout experience by designing two Ecommerce utility pages: the checkout page and the order confirmation page.

Learn more
  • Designing with Ecommerce compilations: Creating pages and lists
  • Constructing an add-to-cart button
  • Incorporating a shopping cart on every page of your Ecommerce site
  • Personalizing the view cart button
  • Adjusting the shopping cart
  • Tailoring the checkout experience

Debuting your shop

Once you’ve constructed and designed your shop, you’re set to launch it. However, unlike the CMS, you can’t immediately publish a functioning Ecommerce site with just a click —  you first need to configure your shop.

Ecommerce configurations

Start with entering your business address and details. This facilitates the activation of intelligent defaults for many other shop configurations such as currency, unit system (imperial vs metric), initial shipping zone (store’s country), and initial tax settings. These settings can be updated at any time from within the Designer or the Editor.

Discover more
  • Ecommerce setup overview
  • Linking to a payment portal
  • Setting up shipping methods for diverse shipping zones
  • Configuring taxes
  • Inventory synchronization integrations
  • Enabling checkout and launching your shop

Promoting your products and online shop

You can merge Ecommerce compilations with CMS compilations and showcase products in blog posts, or relate products or product categories to a brand compilation. Additionally, you can display filtered product lists on your homepage to create seasonal promotions, advertising campaigns, and coming soon landing pages.

Tailor emails

Customize and design automated transaction and receipt emails to align with your brand.

Discover more: Customizing Ecommerce emails

Manage life cycle marketing with flexible forms

Incorporate a Webflow form to collect emails for a waiting list. Connect your form to MailChimp or other platforms for running email marketing campaigns.

Discover more
  • Introduction to Webflow forms
  • Transferring signup form entries to MailChimp

Formulate dynamic ads

You can also send events to Facebook, Instagram, and Google to run more intelligent marketing endeavors.

Discover more
  • Syncing products to Facebook Catalog Manager
  • Initiating Instagram Shopping
  • Syncing products to Google Merchant Center

Initiate Ecommerce tracking with Google Analytics

Integrate your site with Google Analytics to configure ecommerce tracking and monitor ecommerce data within your analytics reports.

Discover more
  • Setting up Google Analytics
  • Tracking Google Analytics events for Ecommerce

Order Management

Now that your shop is live, you can start receiving orders. Orders will be accessed in the Webflow Designer and Editor, where you can delve into the specifics regarding the purchasers, their addresses, and importantly, update the order status for your internal tracking. You’ll also be notified of new orders via email and within the Designer.

You can efficiently manage your orders with the Webflow API or through Zapier integrations to streamline fulfillment and shop management.

References
Ewan Mak
Latest posts by Ewan Mak (see all)