Hi everyone, in this video and the preceding videos...

we're going to build some e-commerce...

we're going to build this, it's going to have products...

be able to have different kinds of products...

we have added to the carts, style the carts, style the checkout...

it's very exciting, let's get started...

and before we get started making something...

the purpose of this video, and kind of the series here...

is to give you an overview of e-commerce stores in Webflow.

We're not going to get into lots of the detail...

we'll give you everything you need to make something...

but all the real small details...

it's going to be outside of the scope of this course...

but you'll see, you'll get up and running pretty good.

The other thing I want to mention is that...

how close e-commerce is to what we've already done...

for like our blog CMS, those collections are...

we did them earlier because it's going to help inform...

what we do for e-commerce...

and you'll be able to see the connection between the two...

making this part, pretty easy, relative to...

I guess, starting with e-commerce.

So first up let's make a new site...

so if you're following along make a new site...

do not look at all my ones, there's a lot of drafts and stuff...

I blame it on course making...

end up having to make a lot of stuff, just to kind of...

get it nice and smooth for you guys while you're watching...

don't judge me, I'm going to make something called the "Tea Store"...

do the same thing, and let's make a site.

So the big thing from transforming, from being a regular site...

that we've done previously, either static or dynamic...

is this button, click on this, and it's going to say...

I'm going to make two things for you, two Collections...

we know what a Collection is, so Products and Categories, let's do this.

The one thing is, is when you are creating an e-commerce site...

you've got to change your site plan...

up until now we've been dealing with kind of the startup...

we'll get quite, you'll be able to do pretty much...

this whole video with the starter one...

you just won't be able to actually take payments...

until you've switched to one of these e-commerce plans.

So remember, Starter is static, static...

dynamic, big dynamic site, and then...

e-commerce is where this starts, I'll get you...

like this page will change style, they'll lay it out...

they'll change what the rules are for the different prices...

the prices will change but just know...

that you'll have to switch to an e-commerce one...

work out with the right details.

All right, so let's have a little look at what's happened...

now this big Setup Guide here opens up, that's...

it's actually really handy, I'm going to cover this myself...

me and you together, but definitely go through it...

the big thing is that under E-commerce now...

there's this Products and Categories...

Products are where my products go, let's add some...

I'm just going to add some sample stuff...

we're going to just do a whirlwind one in this video...

because I feel like it's good to see the whole thing...

and then work for it individually...

rather than trying to adjust, you know...

go through every single video, and at the end going...

"Ah, that's all goes together," so this...

so this video is going to be a little bit fast...

it's all right, we'll break it down later on...

so I've got a bunch of products, what else have I got?

Under the Pages tab, look at that, you've got some new stuff...

a Template, you're like, "Hey, didn't we have a template earlier?"...

but it wasn't called e-commerce...

remember, in our blog...

that guy, we had CMS Collection pages...

when we did our CMS, and we had our Blog template...

so it's the same here, but this is email-- E-commerce pages...

there's still a template, and just like before...

if you need to add stuff, this is our Product template...

so we design one for many products...

we've only five at the moment...

but let me just quickly add a 'Container', add a 'Text' block...

that Text block is going to get the name from the name of our product...

there you go, that should probably be Heading...

that's all right.

Let's add an 'Image', and the image, if we connect it to our products...

there's only one image field, here we go...

it's going to bring through a giant image...

bring through the price, the description...

actually just bring through the price...

because that, we'll make it a proper product...

it's at the top there, whoops...

and I'm going to bring through the price.

All right, so we style our templates like before...

and our Collection which is now hidden...

under the e-commerce tab, instead of here...

you can still make Collections, but they've kind of, they're separate...

they function the same way...

but they're under E-commerce, and under here, in our Products...

we can keep adding stuff here...

where our client can, through the Editor...

and we'll keep adding them to the Store...

it's also added some other pages, a Checkout page...

look at that, just done, we can style it, or we could leave it...

but that's ready to go.

There's an Auto Confirmation page, yes, thank you, very much.

Other things that it's added - let's go back to my 'Product' template.

- is new stuff in this Ad panel, under Elements...

so we've seen all these, we're getting quite used to them...

what is this E-commerce, that wasn't there before...

that happens when you kind of like hit that button...

and turn it into an e-commerce store, you get this stuff...

it was hidden before, and we can add...

Add to Cart, I'm going to add this in...

there, somewhere above, below please, giant image...

you can see there, look, it's got the price, I can add it to the carts...

oh, Webflow makes it pretty easy to make an e-commerce store...

but also give you all the control where we can go through...

and add all the classes to these buttons...

style them how we want with our sweet new mad styling skills...

that we've learned through this course...

adding classes, global classes, combo classes.

Before we go there's going to be some things we're not going to cover...

go to the Setup Guide here, you can work through...

some of them on your own, like...

we'll definitely do a business address...

just because we can't-- kind of stops us from getting too far...

like reviewing your currency settings...

and what kind of shipping you're going to do...

and the tax for your country...

is outside of the scope of this course, it's different for everybody.

Webflow do make it easy, things we will cover...

adding a product, we'll design our store and carts...

we'll do all of these, we'll look at the emails...

and we'll go through how to host it, kind of cool stuff.

All right, that is pretty whirlwind kind of overview...

add products, add them to pages, connect them to a cart...

and a payment gateway, make money, how hard could it be?

What I'm going to do is, actually, I'm going to delete these products...

so I'm going to go 'Select All', and I'm going to 'Delete'...

and I'm going to delete my stuff on the page too...

just to get us back to kind of, yeah, home base...

so we can start again...

goodbye container, and we're ready to go...

let's go through now and look at those individual steps individually...

and see where the road blocks might be...

and how Webflow deals with e-commerce.