Build a professionnal ecommerce website [make a brand in blogger]
we are going to see everything about About this template and how to build this kind of website But allowing us to sell our product faster and to convince our customer to buy from us our product also this kind of website doesn't require any knowledge about web development like, uh, Having a knowledge about html, css3 or php language So I don't need anything of that language all what you need here is an account in gmail to open your Your blogger and to download this template then to follow this video to build this so just take an example For example, if one customer for example choose this product here So It He gets that information the title for the product the price he can add this product to This item to to the card or to the wish list so for example, if he like this product he can add it directly and then He can't make a check out We have here agreed galleries And descriptions feature list And also we have similar product and your user or your customer can add a reviewer can lead to a Comment to know how he thinks about your product. Also you can Disallow him to lead you on a comment. So let us know for example if you want to buy this product You can click on check out here and to fill this form suppose for example,
this is from Morocco, I am from. Morocco First name for example Address Email so I will put For example phone Everything you want in uh, he can choose between uh for payment method Direct bank transfer and here i'm going to show you how to put your information here check The payment or cash on delivery or people so I will choose this one just to to show you So then now I get I will get this This request in my gmail. I will check my gmail here So as you see this is this request the request I get See on the link of the product, so if I want to check the product I just click on this So I will see that he wants that product so I can contact him I have all informations about him. So information is about the product And information about him. This is his email his name and all informations that I need to contact him So now this is the example that we are going to make so please open Uh your blogger here by gmail And click on create blog Give it a title. So for me, for example, I will make the veneer profi channel That's mean english being professional or how to be a professional next now choose a name So your web address It entered otherwise by blogspot.com so try to choose a grid and a good name with keywords that reflect Your products or your job? So for me, for example,
I will put only my first store It's not available Commerce So I clicked in on save So now I have to I created my blog click on view blog to see So here we have anything So, please go now under the video here you're watching you will find a link to downland the template. So after you're Downloading the template You will get this Folder please click right click on That folder and then click on extract extract files to get this Then click on spot commerce And then click on spot commerce template for developer So here you can open it with notepad plus plus it's a free software or You can only open it with black knot like this Select all and copy Then close go now again to your blogger Go to the theme Click on my term edit html Select everything I'm, sorry, my windows is by french language Delete this and pass the code that you have coupled Then click on save So now check your blog So now I have installed my template so let us now starting by the logo main menu slider section and then We build step by step our website so We will start by We will start by logo and menu so to make the job easy for you, I will put this folder here I will put this folder here for you you can download it from the video to follow and to build the same example with me because if you Will the same example you can then make everything you want you can delete that blog and to create another one so just to avoid to get any problem try to To follow me by downloading this file and to do the same as me so First of all what you have to know? So the logo here this is the size of the logo 8746 So for me I have already created this logo here it's a png format So go to your blogger dashboard click on layout Header section here click on edit Then upload Choose the logo then click on
ok and wait a little bit Then click on save So I will check The front office of the blogger to see so we have installed here Our blog so as you see the the link of our website is my first store this one Since this is our logo here Our link my first store ecommerce blogspot So I will copy this but before Go to your dashboard sitting Then click on ctrl and select https So http is redirect you have to Activate it or to enable this so click on this It should become green Now when I click I get always https So this is my blog Now I will create my first menu Go again to layout Go to the link list gadget main menu, the first menu is home Home and add the link Then click add so the the second the second menu that I should create is for example for smartphones smart phones So again edit So smart Phones So for the link now you have uh to be careful and to To think before you do anything. So this is your blog It started by https double slash your name dot blogspot and that comes so if I want To tick the customer directly to one category.
I should write always search slash label slash The name of the category or category names? So you have to write this copy your blog slash write search slash label slash Smart phones without space And then click on add click on this to change the Position we have smartphones we have again laptops lap tops Same job pass the link Just to see https your blog at the end add slash Search slash bubble slash wrap tops So do the same for all things so if you want for example uh to add the Uh a submenu for example for smartphones here. I will create for example, ui, Slash search slash label slash Ui Then you have to add an underscore here click Should go under So that's mean this category belongs to the smartphones category So this is the main category and here the subcategory for the smartphones So click on save and let us to check what we have created Refresh the page So you see this is the home It take me to the same page when I click on smartphones So it's free, it's empty there is no product here So now let us create in this uh section so Slider section we have to add the background and then I will show you how to add Products so for I will not create other categories because you have to follow the same example to do everything you want So go to the header image background here The image so for the image this is the size that you have to do Click on save check your job So now we have added our background to this section so we should now to To wield the product. But before we do this,
you have to know something you have to understand the structure the structure of the slider sections, so We have this the picture Sub here the pre-title the main title caption undo button here so to do this Go to displays slider Slider level here we have You can't notice that here we have placed, uh, two five images So you can for example if you want only to put three You can just click on edit and delete Or remove them click on okay So now we have only four if I want for example to add more than five or more then seven or other The number as I wish just click on add gadget And look for image And click on This plus to add it so here For the title click right title your title. So I The title of the product for example if you buy a pro 40 or no or everything you want between brackets You add the pre title? the pre title the same Caption between brackets All right the button value Value for example Value of the button So let us now check this So for the link now Because we don't have still create any product So here I really displace empty,
but we can come back when we create our product You can come back to edit this. So click on upload and choose the product you want. So for me, for example, I will choose I will choose this Click on save check your job So you see here See title between brackets we get the pro title caption and between brackets we get this so here you can write what you want but between brackets This is the example. For example, I have created here see For each button. I put a different value Because what I want I want to for example to convince the customer to buy And to see or to click on this link to see the product So do the same job do the same work So I will delete everything so the Title to for example Pre-title, so right here between it write what you want caption between brackets write the value for example This add the product So as you see it's very easy to build a professional store So we don't have any It doesn't require any knowledge in development So here as you say you can edit everything you can put the text you want like I did here See This is the place of the caption The title for the title and this is the value of the button here just for me. I just make this example to see it So now what we have to do is to go go again to your dashboard Go again to your blogger click on sitting And then click off click click ctrl f And click meta meta attacks, so it's very important to enable this place Then try to To create a small description about your website because it's very important that This description is used by google. I will give you an example When we go to google here So, for example, I look for phones So this is description this description here you are watching So you have to write this is the snipped code That you have to custom for each product that's why enable displays and give Write a grid description with keywords that allowing you Allowing our customers to find you faster on google Okay.
Also this please it's very important because the customer they always read displays before they click on the link So to motivate them and to push him to click and to visit your website You must to be careful about the text that you will right here Don't let google to choose anything from your page and put it here. Okay? So for me I will not put anything orange I can just put for example blah blah blah Just for me it's a false website just want to show you so go again to leo out So we have created slider now go to the origin section this is this place I will add the background. So for us for example, we don't have any background here So go here Horizon image background Click on edit add the background So this is the size of the background Click on save So now I will add a grease I will add another text here For example my address phone facebook or anything that can Allow our customers to contact us directly by using social media or email or by phone So to add this text here Back again to your dashboard Or is instruction Click on directly text gadget edit So it's very easy to add this. So just write double. Yes home Double ds.
Again, that's mean and that's allowing us to add icons. So here you have a lot of icons here Just right in google disk Font awesome 4.1.0 icon and you will get this There's a lot of icons here for example contour if home file File like for I look for home just right home Now I need phone Phone here, for example You have mobile as you see mobile mobile phone so It will add it So my home for example here try to add your address your address Double this again Phone Please and you write your number Again wgs mobile And you write it Again you can write your email your everything you need For example this paper plane or paper plane o I will take this I'm sorry between w's So to avoid any problem people die So write your email So all this is just example you can also add facebook Twitter Or anything you want and you write your text So save So for you you're free to choose the icon you need Just you have just to write them between wds so on google Look for this font awesome For that pawn.zero icon and you will get this here.
You have a lot of icons You're free to choose 11 page so there is a lot of awesome icons that you can use for your Website so now this piece you can also here at your text or something to encourage or to motivate the customer to contact you because as much as you get More feedback from your contact as much as you can sell and as much as you can present correctly the product you need So now let us add in the page some pages here like this For example about us turns or anything Contact us or anything So I will copy this text just So go back to your dashboard and click on page New page For example about us I will add the text here. So you're free to add picture or to add anything So we'll choose file here So for me we make we'll create only one page So for you you're free to add as much as you want of pages, but what you have To do is don't forget this place. So this is Search description You must always to give for each page or for For each product you have to give it a good Description because this is used by google as I show you last time Phones So you have to custom this description don't let google to choose anything because google by default what He will do he will just uh cut some 150 here correct here and put it in that place.
So don't let you to google or any boat to to do what he wants, but you should to Edit your description Because this allowing you to convince master your customer Here are the option For comments allow don't allow show existing don't allow and hide existing. You have three options here. So click on publish and confirm So go again to lie out So go to the footer number two footer two sections click on edit So now add this We have home now add this about us and click on save Check your job. So here it will be added here About us So this is Your page so you can Create as much as you want of Of pages here so as much so for example, for example, i'm sorry for example about us terms previously terms and etcetera so you can put the all informations that That can be used by your customer Because they must trust you as a you can should earn his trust as much as you can So now we have our slideshow Contact form is created our pages.
So now let us Create in the first product. So here as you see we have two three sections smartphone Laptops but for huawei, I will not add anything for this category I just want to show you how to create menu and submenu so the same way we work Because one example is enough to do and you can follow the same example to do the job. So Go to the post We'll copy this text So after you click in on the post click on new post Your first product For example I Pro for example p 30 add your text I don't need to add description. Just right But you can add you can write a feature list because this by default it added descriptions So At the end now we will add the gallery of the product choose file We choose this one to picture Section Select so here now Just we I will bring you again to this example because I want to show you So here you have three options You can Show to the customer that this product is out of stock You can show him the last price and this is the new just to show him that To encourage him and to motivate him and you have again to put only the products so you have three options So for the first one this one is normal Underscore And write the price for example I put everything 60 comma Now I will put this product it belongs to smartphones Please look to this place So when I put the mouse on the smartphones you can write you can read my first e-commerce dot blogspot.com Smartphones you see that please it calls the name of the category as I show you last time. So this place is very important So I will write this here Smart Phones. So now on the check display.
So now I this product it belongs to the smartphones publish Let us check So, this is our first product So here you have the price you have a fitted feature list some description and the gallery So what we forget as I told you last time Click on it again Don't forget this place search Search description You have always tried to for example, uh pro Patron great good or good price or anything? That can allowing your customer to buy Here the options if you want to allow the comments and don't forget this permalink. I will copy this I will show you why So go again to your dashboard Click on layout After I copy that german link I go to the slider so here The second product is I think is the phone is so here I put that link You click on save Now I go to the home So when I click on this place it will tick me
directly to the page So http my first blog, I don't know why okay, I will show see why Http so copy this and we'll copy the link To compare it with that In the post Permalink so http Http So I want to compare that link with this to see what is the problem here http my first e-commerce blog 80 Ui pro, so it's the same I will say again go back again to your Layout Go to the title So html http is okay I save So it take me directly now to the product So I will do the same thing to for this product The same go again to the post I will create another product click on post new post For example watch Pro The text I need a text I will copy some text here it's a false text, but for me I won't just We'll add some picture to the product So for the label here suppose, for example that the price was 70 and they want to buy it with 60 under score comma 70 that's mean that the new price is 60, but the last price is 70 and this product Is belong to this much? It belongs to not smartphones, but where items Variables Confirm same thing We must otherwise Write a good text for a good description for the product and the option if you want otherwise to allow Your customer to add their comments So I will tick this because I needed Layout Go to the your first slide, this is the one I will add the link Check the job So you see if I go to the home When I click here it will take me directly to the product So if you want for example you see here if you want so we will add on the last example to show you how to build how to add the this Out of stock This
example, so we have done this one the second example, so now this is the last example so you if you follow this Uh, that's true example you can Do the same job? So we have here I will add another for example laptops New post Knob Add your text another text again But some picture of some image for the product So if the product is out of stock an exclamative pound and right zero comma This product is belong to the lap tops and check this The same I will I don't need this now So location, you can add the location of the product Search option and all those information. So please don't forget this place. It's very important Click on publish confirm So now I have three product So the user cannot add this to his card So now we are going to add Some other features to our To our uh website and we are going to add some social media And how to custom this place And how to choose the number as you want, for example here you see eight product but in this website I have more than eight thin products so I can it's 12 normally should be 12 because
I have only created 10 products So now we are going to create this place This social media section So go back to your dashboard and click on layout In this place we are going to add some links to our social media like youtube channel twitter facebook or google Please also We will add this form here to allow to subscribe to add their email Then we will Deliver them the content directly via email So to do this go back to your dashboard Blogger click on layout Go to the photo one section here and click on git update followed by email gadget. So click edit So to know more about faith banners here go just to google here and you can uh get all informations that you need fit burner email overview and Fog so you can find all informations that you need, but it's very important to do this Because this will allow us to deliver the content to our subscribe So click on edit You will get this pop-up image so you can change this Git update or write what you want then change the email Click on save Go again to edit for social media so here Write google Plus and then add your email your address Domain.com, so for me, I will not write anything but for you at your page and link same at your face Facebook page As I told you last time this is just for the website so but you you have to add a correct link youtube Twitter So you can change the position of that icon here For example,
I will start with google then twitter And then click on save check your page So as you see now We add this form and here the user or the customer can add his email and then he will be notified Via email by all our latest product So it's a good and important Step that you have to do for your website because this allows us to sell more and to have more subscribe on our blogger also this place, it's very important to make more interaction with your customer To bring them to the face page to reface twitter youtube and all that social media links If I click for example here, it will tick me directly to domain name. It doesn't work because for me I put a false link so now what you have to what we will do is I will show you how To change some variable here. For example when the customer choose one product And try to finish the process to To buy from you So here as you see there is many fields There is many fields here so I will show you how to Hide some of them also how to add some informations in this place Indirect bank so about our store streets check payment How Some other informations and for our people, too so To do this go back again to your dashboard
Click on layout And then go directly to here you have We have two section this section here is Allow us to translate the website for any language that we want for example french arabic or any other language german or others Four variables here this place allow us to change some variable here That we can add directly So click on edit So this, please allow us to change and to configure many variables for our website like currency code some informations about direct bank transfer check payment cash on delivery and every Everything here as you see for the currency code is by dollar, so I can't change it Click Variable undid it then you will get this pop-up image Page sorry, so here In documentation, you will find a lot of variables that you can use for example for the code currency you just look for your code currency and if you don't find it So you can use this variable This one Write it so for me my code. My currency secret is is mad not smart Save then
I will check So you see i'm at this so I can change the position to be before or after to do this So here are other variables So you can change everything you need Currency position as you see korean c position copy this And then right at this After You see now I change the position of the currency code so now tick Go to the home in your website Try to buy something from your From you it's just an example Add This item to your card And click on checkout. I want just to show you how to custom the form for example here We can find the mini fields. So for example if you want to hide some of them Like for example company name it's very easy Here you will enable field first name country company name and everything So just copy this Go again to dash your dashboard edit variables And then click write false So this will hide directly this company name Now Now I will add an email for my people So look for your people email this one Copy this go to Same place variables Write this variable and add your email. So for me it just write false email Click on add So do the same for all variables that you want to change for example here The name Store name your store name that will be that will show in check out In check checkout method the same for the straight down country and follow the same example to change all variables For your website, you can also custom the way that works your slider show. You say slider animation spade You can custom this number pause time control and everything you need So it's very easy to customize you don't need any
developer web to help you only you can the Custom and charge everything you need. You don't need to have any knowledge on Web development. So now i'm going to show you how to translate how to translate your website So it's very easy again click on transla translator and then click on edit So by default this website is built by english language, but you know you can Use this template for other languages french english german or any language you want So just go to your dashboard layout and then go to blog setting translators and click on edit So it's very easy so for example I want to to change this For example add to cart so write it like right like this add to cart So in french language is agit And write the word that you have on the website add to cart click add link click save refresh the page You'll see azure, it's very easy so I will add this to the cart And I will click on checkout Just I want to show you another case not check out please come here Now check out because here there is one problem that you have to be careful when you're translating This place here when you find the number That's mean this is the one the first string And this is the second string so you can do add one Items to card. No you can you translate add Only and then translate items to card. I will give you an example Add in french is ashuty Add Then I will add this link I have Items to cart Items Items without a so Link save I will now see the example here So you see azure, uh, um,
We don't have to add this s because this means plural items You do the same add to the wishlist add a review same example as you can comment here So it's very easy to translate anything you want Measure commenter And click on save refresh the page to see As you can comment here so all variables here all words you can translate them only with this In this in that place here layout and translator and change your website so by using this template as you know blogger allow you to create mini blog with one account so you can Create different pages a different blog And To sell your product with different language. So it's very easy to do this and that's mean that allow you uh to sell more and you also you don't have To hire someone for example a developer web to help you so you can do this. Uh You can do this job only You you don't need anyone. So, uh, if you like this video, please don't Forget to share it with others. And if you have any question, you can let me one comment your comments Under this video then I will answer you. So thank you for following this video See you on the next video in the very professional. This is our site Being professional. So, thank you so much and goodbye
Related Posts
Subscribe Our Newsletter
0 Comments to "Build a professionnal ecommerce website [make a brand in blogger] "
Post a Comment
please do not enter any spam link in the comment box thanks.