Enable checkout and launch your store

Learn how to enable checkout to launch your Webflow Ecommerce store.

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!

Once you’ve built, designed, and set up your store — it's time to launch.

In this lesson:

  1. Add an Ecommerce site plan
  2. Enable checkout
  3. Publish your site

Add an Ecommerce site plan

  1. Open Project settings > Hosting
  2. Find Site plans and open the Ecommerce sites tab
  3. Add the plan you want

If you already have a site plan on your site, the plan will be upgraded to the Ecommerce plan you chose. You can downgrade the plan at any time, however, note that you'll only be able to enable checkout with one of the three Ecommerce site plans.

SSL, which is required for Ecommerce functionality, will be automatically enabled on your site. Make sure SSL is on under Project settings > Hosting > Advanced publishing options.

The advanced publishing options section includes switch buttons for the following options, enable SSL (highlighted), minify HTML, minify CSS, minify JS, use secure frame headers and a blue save changes button.

Enable checkout

Once Hosting and SSL are set, and a payment gateway is connected

  1. Open the Designer > Settings >  Ecommerce > Checkout
  2. Choose Enable checkout
  3. Save
Step one click on the settings icon, step two click on the Ecommerce button, step three click on the checkout button, step four turn on the enable checkout switch button and step five click the blue save button.

Publish your site

When you’re ready, publish your site to your default domain. Visit the domain you published to and test that everything is working as expected. You should be able to:

  • Add products to the cart
  • Continue to checkout from within the cart
  • Place an order
  • Receive a notification that you have an order
  • Process orders from the Designer or the Editor

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?