Today I am going to show you, how you can create anEcommerce website from start to finish. Okay! So first, let's see the websitewe're going to build. So here it is. After watching this video, you will be able to makea website, which has products like these and then we're going tocreate pages like these. And people will be able to addyour products to their carts. and they will be able to payyou, through your website and buy products from your site. So let's get started. its going to be very simple. We're going to make ourecommerce site in 4 parts. The 1st Part is toLaunching Your Website Now this is where you get a newwebsite, Live - on the internet. So to launch your website,we're going to do 3 steps. The 1st step, is tochoose your website name. Now to choose the name, justclick the link below this video. So i'm going to click this link and it will takeyou to this page.
Now enter the nameyou want in this box. So i'm going toenter tryshirts.com and click 'check availability' So now you can see thatthis name is available. So once you get your name, youcan go to the next step, which is to get yourhosting & domain. So hosting is the place, whereyour website's files are stored and domain is yourwebsite's name. So to get your hostingand this domain name, just scroll down this page and click 'get hosting'.
Now it will take you to thispage where we're going to get our hosting & domain. So to get it, just click get started. Now enter the same namewhich you selected before and click 'search'. Then click 'select & continue' Now to get this domain and hosting, we need to create a new account. So let's click here and then fill up these details and click create account.
Now, here you can see that we'regetting our domain, which is tryshirts.com, and our hosting. Now both of these are goingto be valid for 1 year, which means once we place thisorder, your website will be live on the internet forthe next 1 year. So, now let's go ahead& make the payment. Just choose your payment method, enter your details and then make the payment. So, now we've successfully madethe payment, and we've got our domain and hosting. So once you've gotyour domain and hosting, you can now go to final step oflaunching your website, which is to install Wordpress. Now, Wordpress is the tool,we're going to use, to build our ecommerce website. Wordpress lets you build websites easily without any coding or programming. So, let's see how to install Wordpress. To install wordpress, all youhave to do is click 'Add site'.
Then enter a username andpassword for Wordpress and click 'add'. And now wordpress will beinstalled on your new domain, which is trishirts.com. Okay! So Wordpress is now installed and this means, your websitewill Now be LIVE on the internet. So to check it, let'sgo to our website. We'll open a new tab. Now if we type tryshirts.com, and press enter, you can see that, we have a brand new website, on the name which we selected. So, this is how you can launch,your website on the internet. So once you havelaunched your website, you can now go to part 2 ofthis tutorial, which is to Start Building YourEcommerce site Now, instead of Building yourecommerce site from scratch, we're going to first import asample ecommerce site. And then we're going to edit it, to make our own site. So, this is going to really speed-upthe process and will let you build your site ina much faster way. So, to import the sample site, we're going to do 2 steps.
First we're going tologin to our website. So to login to your website, all you have to do is, type /login after your site's address. Now press enter and it will take you to thelogin page of your website. Now enter the login details,which you selected for wordpress and then click login. So, now we've successfully logged in to our wordpress site. So this is the place, whereyou can control your website. So once you've logged in, we cannow go to step 2 of importing the sample site, which is toinstall a theme in wordpress. So we're going to installa theme called 'astra', which is going to let usimport the sample site. So to install the theme, just go to 'appearance' and click 'themes'. Now click 'add new theme' and then search for a themecalled 'astra' Now this is the theme which isgoing to let us import the sample site. So to install the theme,just click 'install'. And then 'activate' the theme. So, now we've installedthe astra theme. Next, to import the sample site, just click 'astra' options and here you can see that we have an option called "import starter site". So to import a site, firstclick 'install importer' and then click 'see library'. Now once you're on this page,just select 'Elementor', which will make iteasier for you to edit your site in future. So, we'll select that. And now as we're going to buildan ecommerce site, just click 'ecommerce' and then choose this site,called the 'brand store'. So, let's click here. And here you can see a preview of how your site is going to look, once you import this sample site. So to import this site intoyour site, just click 'install plugins' and click 'import this site'.
So now the sample sitehas been imported. So let's see how our site looks. Now if we go to this tab, you can see that, this ishow our site was before. It was completely empty. Now if we click 'refresh', you can see that we have got theentire ecommerce site, into our site. Now this is the fully workingecommerce site, which means if we click on a product here, you can see the detailsabout the product and you can add it to cart. And then, we can view the cart, and then we can alsoproceed to checkout. So we get all of theseoptions right after we import the sample site. So now we havesuccessfully imported our sample ecommerce site. Okay! So once you have imported thesample site, we can now go to Part 3, where we see how you can startusing this e-commerce site. So to start using ourecommerce site, we're going to first set upour store. Our store is the place, whereyour customers can see your products and then purchase them. So once you set up your store, your site will have your own products. and your visitors will beable to buy those products. So let's go to our store and you can see that wehave these sample products. Now to set up our store,we're going to do 4 steps. The 1st step is to deleteall of these sample products. So to delete them, let'sgo to our dashboard and then click 'Products'. And here you can seeall the sample products, which we have here. Now to delete the sampleproducts, just click here, to select all the products and then click here, select 'Move to trash' and click apply. So now we've deletedall the sample products. So now if we go to ourstore and click refresh, you can see that all theproducts have been removed. Once you've removed all the sampleproducts, next let's see how you can add your own product. Now to add your own product, just go back to yourproducts page. and click 'add new'. Now to add a new product, all you have to do is, Enter the product name it's price and some detailsabout the product. So first, let's enter the product name. I want to sell a tshirt,so I'm going to enter that. And here, I'm goingto enter the price. and then some detailsabout the product. Okay, so once, you've addedthese details, you can now, add yourproduct image. So to add the image, justclick 'set product image' and then drag & drop yourimage from your computer. And as you can see, Yourimage has been added So now we have added all thedetails about the product. So let's click publish and now if we clickour store page, you can see that wehave our product. Now if we click on this product, You can see that, we can now add thisproduct to our cart. So now we have successfullyadded our product. So you can add any number ofproducts you want in the same way. So to add a productall you have to do is just go to products and click 'add new'. Okay! So, next let's go to the 3rd stepof setting up our store, which is to change ourcurrency. Now here you can see that,we have a different currency. Now to change thiscurrency to rupee just go to your dashboard and then, go to woocommerce and click 'settings' now this is where you can changeall the settings, related to your store. Now to change your currency, just scroll down this page and here you'll findthe currency option. now to change this to rupee just click here and then type India and select this option. Now click save changes. and now if we goto our product page and click refresh you can see that our productprice is now shown in 'Rupees'. So now we have successfullychanged our currency. And we have completed the third step of setting up our store. So next let's go to the 4th step, which is to setup ourpayment method. Now if we try to buy thisproduct by clicking 'Add to cart' and then clickproceed to checkout you can see that it says "nopayment methods are available". So in order to allow yourcustomers to pay for your products you need to setupyour "payment method". So, to set up, we are goingto create a free account on a website called 'instamojo'. So once you create this account,you'll be able to receive payments directly to your bankaccount, when someone purchases, your product. So to create your account, just go back to website learners and then scroll down to step 4. And click 'Create Free Account'. And it will take you to this page Now just click 'sign up' And then enter youremail and password. And click ' sign up'. Now choose the typeof business you have And select 'No' here and click next. Now, once you reach here, you need to enter your bank details, where you want to receive your payments. So you need to enter yourbank's account number, and then click 'Find IFSC' Now select your bank details. And click 'use' So now when someone buys aproduct from your site, that money will be sent tothis account. So once you've enteredthese details, just click 'create account'. And now we have successfully created our Instamojo Account. And now your customers can useany of these payment methods to pay for your products. So, let's click'go to dashboard'.
Now how do we connect thisaccount with our website Now to let customers makepayments on your site, you need to connect this account with your website. So to connect it let's go to ourwordpress dashboard. and then go to plugins and click 'add new' and now we need to install theinstamojo plugin on our website. So just search for 'instamojo' and you'll get this plugin. now to install it,just click install. and click 'activate' So now we have installedthe instamojo plug-in on our website. Now to connect thisaccount with your site, just click settings and now, you need to getthese details from instamojo, So to get thesedetails, just go here and click API & plugins. and click 'createnew credentials' Now Click here and selectwordpress from this list. Then click 'generatecredentials' and instamojo willgive you these details. Now, all you have to do, is tocopy these details, and then paste it here. So let's copy and then paste it. and click save changes. Now as soon as youclick "save changes" your instamojo account, willbe connected with your website. So this means our paymentsetup is now complete. So we've successfully setupour payment method and now your customers can not only view your products, they can now buy them. So next let's try buyinga product from our site So just like acustomer would do, we will go to our store and then add theproduct to our cart. Now let's click view cart and click "proceed to checkout" you can see that instead of the errormessage, we can now pay online So just like acustomer would do, If we enter our details.
And click place order You can see that we havedifferent options, to make payments. So let's say the customer wantsto pay with their Debit Card, they can click here and then enter thedetails and click pay. now if we enter the OTP and click 'submit', you can see that the paymenthas been made and we have ordered the product. Okay! So this is how a customer canbuy a product from your site So now you know how yourcustomers can buy products from your site. Now, what happens whensomeone orders your product? How do you know, thatyou've got an order? Now as soon as someone buys aproduct from your site, if you go to your inbox, now this is inbox of the email you entered while creatingyour site Once you go to your inbox.
You can see that, wehave received 2 emails. the 1st email is fromour 'wordpress website', and the 2nd oneis from instamojo So if we open the 1stemail from wordpress, You can see that we have allthe details about the order So we have the name of theproduct, which the customer has ordered and, their address. Now if we go back and open the 2nd mail, you can see thatinstamojo confirms, that we've received the payment. So this is how you can know, when someone orders your product. And once you get this email, youcan go ahead and deliver the product to your customer. So now you know how you can track, new orders placed on your site. But what about your customer? How can they view andtrack their order? So next, let's see how yourcustomer can view their order after making a purchase. So let's go to thecustomer's inbox, So this is thecustomer's inbox. Now, once a customer hasordered a product from your site, their account will beautomatically created. And now If the customergoes to their inbox, they'll get one email,with their order details and another email, withthe details of their account. So if we open this email, here, you can see that thecustomer has got the password, Which they can useto login to your site.
So after placing an order if thecustomer wishes to login back to your site, all they have to do is go to your site and click 'account'. And now they'll be able to loginback to your site. So they need to justenter their email and the password, which theyreceived in their email. So let's go back to the inbox and then copy this password and paste it here. And now if they click login, you can see that the customercan view all of their orders, they've placed on your site. And now if we go to "Addresses", they can even updatetheir address. So this is how your customers, can view their orders onyour site. Now let's go back to our store Okay! So now we've successfullycompleted setting up our store. And this means anyone who isvisiting your site will now able to buy your products So Next let's go to the FinalPART of building our ecommerce site, where we see how you can changethe look of your website. So next we're going to see how you can change 4different places of your site. Let's go to our homepage. First, let's see, how you can'Edit, the contents' of your pages. Now let's say you wantto change this text. How do we do that? Now to edit anypage of your site, just make sure you're on that page and click 'edit with elementor'. and now it will take youto this 'editing section'.
Now let's say you wantto change this text. All you have to do is, just select that text and then start typinganything you want. So I'm going to type "***get the best products***" ***From our store*** NEXT if you want to changethe text on this button, you just select that text and then enter your own text. So the same way, you can editany text you want on this page. Just Select the text and then start typing. Next! let's say you want to change this image. To change the image, all you have to do is, just click here, then make sureyou're on the 'style' tab. Now, select the image you wantto change and then drag & drop your image. And as you can see, theimage has been changed Now Once you're done with allthe changes, just click update and now if we go to our site and click refresh, you can see that allthe changes are here. So this is how you can editany page of your website. So next, what if you want toshow your products on your home page. Now if we scroll downto this products area, you can see that wehave no products here So next let's see how you can addproducts like this to your home page. Now to add productsto your homepage, all you have to do isjust go to your dashboard then go to products. And here you can see allthe products, you have added to your site. now to display any of theseproducts on your homepage, all you have to do isclick the 'star' button, next to your product. So I'm going toselect these products and now if you go to your site and click refresh, you can see that the productswe selected, now appears on our homepage! So this is how, you can addyour products, to your homepage. Next, let's see how youcan change your logo. Now to change this logo, just click 'customize' and you'll find theseblue icon next to the items you can change. Now to change this logo all you have to do, is clickthis blue icon next to it and you can change yourlogo here. Now if you want to have yourlogo in text, you can remove this image, by clicking here and then show your Site Name by selecting this option.
And now you can see that we've got our sitename, instead of the default logo, which was there before. So this is how youcan change your logo. So next let's see how you can change your menu. Now to change your menu all you have to do is just click here and then click 'edit menu'. Now once you're here, if you want to remove any page from your menu, just click here. and click 'remove'. and the page will beremoved from your menu. Now you can also rearrange thismenu as you want, and it will be changed here. So this how you can change,the menu, on your website. So once you're done, just click'publish' And then click here, to seeyour site. So you can see that all thechanges we made, now appears on our site.
So this is how you can changethe look of your website. So now you have completeecommerce site, which we made in justa few minutes. So to make your ecommercesite, all you have to do is first, launch your site bygetting your domain and hosting. And then import thesample ecommerce site. Then setup your store and then finally changethe look of your website. So that's it guys, this is howyou can build your ecommerce site, in just a few minutes. Now if you're ready to startmaking your own website, just click here. And it will take youto the page, which we saw in the first step, which is choosingyour website name. So just choose your website name and then build your website. After you havebuilt your website, make sure you share thatlink in the comments section. And we'll pick our favouritewebsites and will highlight it at the top of the comments. So thanks for watching, I'llsee you in the next video. Bye Bye.
Comments
Post a Comment