Set up your Webflow Ecommerce store

Learn how to set up your store to launch your Ecommerce site.

ecommerce
This video features an old UI. Updated version coming soon!
This video features a third-party integration, and the UI may not be up to date. Visit their documentation for up-to-date info!

To enable Ecommerce functionality, you’ll need to set up your store and add your business information, connect a payment gateway, configure shipping and taxes, and enable checkout.

In this lesson
  1. Ecommerce settings
  2. General settings — Business address and information
  3. Payment settings
  4. Checkout
  5. Shipping settings
  6. Tax settings
  7. Integrations

Ecommerce settings

You can access the Ecommerce settings in the Designer or the Editor.

Access the Ecommerce settings in the Designer

Open the Settings panel from the left sidebar, then choose Ecommerce to access the settings.

E-commerce settings
To set up your store, go to the (1) Settings panel then open the (2) Ecommerce settings.

Access the Ecommerce settings in the Editor

Open the Settings panel from the Editor toolbar, then choose Ecommerce to access the settings.

Ecommerce settings in the Editor

General settings — Business address and information

You can add your address in the getting started workflow that you can access from the Ecommerce panel. This allows us to set intelligent defaults for many of the other store settings: currency, unit system (imperial vs metric), initial shipping zone (store's country), and initial tax settings. You can, of course, update these settings at any time from within the Designer or the Editor. Then, you can continue setting up your store under Settings → Ecommerce.

General Ecommerce settings
‍Settings → Ecommerce → General

Here, you can set up the following:

  • Business Info — Store name and customer support email address
  • Business address — Business name, country and full address.
  • Currency — the currency that will be appended to the price field of your products collection and shipping rates. You'll need to set the currency of your store before adding products and creating shipping rules. See the note in this section to learn more.
  • Unit system — the unit system of weights and lengths of products. Choose between the imperial or metric systems.
HIGHLY IMPORTANT 
Changing the currency does not change existing price values of products and existing shipping methods, and all products will be saved as draft. You will need to manually update the price of each product and republish your site. You’ll also need to reconfigure any Shipping Methods that you may have set.

Payment settings

Next, you need to connect to a payment gateway to accept credit card payments, process refunds, and get paid.

Learn more: Connecting to a payment gateway and payment related FAQs

Checkout

Once you’ve set a payment provider, add an Ecommerce site plan to your project. Then enable checkout, save the changes, and publish your now fully functional store.

Resources

Shipping configuration (defining regions, rules)

Once you’ve decided where you’ll ship, you can choose the places you’re fulfilling orders for. These settings can also be customized from the Editor as well, which allows your clients to set their own shipping zones and methods.

Learn more: Creating different shipping methods for different shipping zones

Taxes

Once you’ve specified your shipping zones, you can enable auto tax calculation for supported countries. You can also choose whether to include taxes in the product price or not.

Learn more: Configuring taxes

Integrations

You can integrate your Webflow store with services such as Facebook and Google to sync new and existing products with your stores on these other platforms.

Resources

The box model assessment

Get 100% and receive a badge – Login/sign up here

0%

Take test again

Go to related lessons to learn more:
Intro to HTML/CSS

A box that contains other boxes inside is called __ and the boxes inside another box are called __

The box model assessment

Get 100% and receive a badge – Login/sign up here

The box model assessment

Get 100% and receive a badge – Login/sign up here

0%

Take test again

Go to related lessons to learn more:
Intro to HTML/CSS

If you drag an element onto an empty canvas in Webflow, where will it automatically be placed?

The box model assessment

Get 100% and receive a badge – Login/sign up here

0%

Take test again

Go to related lessons to learn more:
Intro to HTML/CSS

Which CSS property affects the the outside of an element?

The box model assessment

Get 100% and receive a badge – Login/sign up here

The box model assessment

Get 100% and receive a badge – Login/sign up here

HTML/CSS assessment

0%

Take test again

Go to related lessons to learn more:
Intro to HTML/CSS

HTML/CSS assessment

HTML/CSS assessment

0%

Take test again

Go to related lessons to learn more:
Intro to HTML/CSS

HTML/CSS assessment

0%

Take test again

Go to related lessons to learn more:
Intro to HTML/CSS

Which HTML element is used to define a paragraph element?

HTML/CSS assessment

0%

Take test again

Go to related lessons to learn more:
Intro to HTML/CSS

What are the different types of HTML elements called?