Starting an online store can be a daunting task, especially if you’re not tech-savvy. But don’t worry – we can help you out!

This video will show you in step-by-step detail how to start an online store in 2023. We’ll cover everything from choosing the right hosting to installing WordPress and WooCommerce. We will also add products and set up payment processing too.

Our goal is to make the process as easy and painless as possible, so you can get your store up and running quickly. So if you’re ready to start your own online store, this video is for you!

Prefer to read the article? 👉 https://www.wpbeginner.com/wp-tutorials/how-to-start-an-online-store/

Related Links ⚡️

WPBeginner Bluehost offer https://www.wpbeginner.com/refer/bluehost
Astra theme https://wpastra.com/
Unsplash images https://unsplash.com/
TinyPNG image optimization https://tinypng.com/
Image optimization resource https://www.wpbeginner.com/beginners-guide/speed-wordpress-save-images-optimized-web/
Website breadcrumbs resource https://www.wpbeginner.com/wp-tutorials/how-to-display-breadcrumb-navigation-links-in-wordpress/

Chapters ▶️

00:00:00 Introduction
00:01:35 Great WordPress Hosting
00:04:37 Setting up WordPress
00:09:34 Installing a WordPress Theme
00:11:53 Installing WooCommerce
00:15:53 Adding Pages and a Menu in WordPress
00:21:08 Setting up The WooCommerce Store
00:25:22 Add Products to Your Store
00:38:05 Customizing The WordPress Theme
00:53:43 Adding WooCommerce Store Pages
00:56:05 Building the Homepage
01:09:45 Adding a Contact Form

Top Resources

⚡Use Promo Code WPBVIP⚡

►Best WordPress Contact Form Plugin https://wpforms.com/wpbeginner
►Best WordPress Analytics Plugin https://www.monsterinsights.com/
►Best Lead Generation Plugin https://optinmonster.com/
►Best WordPress SEO Plugin
https://aioseo.com/
►Best Theme Builder for WordPress https://www.seedprod.com/

Related Videos
►WordPress Tutorial – How to Make a WordPress Website for Beginners https://www.youtube.com/watch?v=DvbFBxKcORA
►WordPress Gutenberg Tutorial: How to Easily Work With the Block Editor https://www.youtube.com/watch?v=JjfrzGeB5_g
►What is SEO and How Does it Work? https://www.youtube.com/watch?v=JjfrzGeB5_g
►How to Install a WordPress Theme https://www.youtube.com/watch?v=ZIPQRQLAz90

If you liked this video, then please Like and consider subscribing to our channel for more WordPress videos.
https://www.youtube.com/subscription_center?add_user=wpbeginner

Check out our website for more WordPress Tutorials
https://www.wpbeginner.com/

#WPBeginner #WordPress #WordPressTutorial

Hey what's up everyone in this video We're going to create an online store Also known as an e-commerce website Completely from scratch using WordPress So maybe you've got an existing business And you want to create an online store To reach more customers or you've got That business idea that you want to try Out and grow online well I recommend Watching this video because it's going To massively help you out the great Thing about this video is it's broken up Into clear sections with each section Representing a step in the building an Online store with WordPress and don't Worry we go step by step through each Section to make it nice and easy to Follow and you'll want to watch this Video to the very end because there's Tips and tricks throughout to help you Build successful online store to help You get your website set up as quickly As possible there's a few things I Suggest you gather together first before You get started First one is the business name and That's going to help you decide on which Domain name you want to choose when Purchasing your hosting the second one Is a logo so something that represents Your business because we'll be adding That to our website the third one is a Really important one and you're going to Need a list of the products that you

Want to sell on the website you also Need the product names the description Of each of the products how much you Want to sell the products for and then We also need product images so that we Can add all that content to the website As well and finally the last one in the List is a dedicated email address so Whether you choose a free service and Create an email address specifically for This website or this business I really Recommend you do that so that you keep Everything away from your personal email Address and you'll use this email Address to set up your hosting and your WordPress site Now that's all covered let's get to it So the first thing we need to do in this Video is get some WordPress hosting and With wpbeginner you get a fantastic Special offer with Bluehost if you use Our affiliate link and all you need to Do to use our affiliate link is Type in Wpbeginner.com forward slash refer Forward slash Bluehost and click enter As this is an affiliate link we do get a Small commission if you use that link And that link will bring you to this Page right here and as you can see you Get a special offer for WordPress users And with this offer you get a free Domain a free SSL certificate Bluehost Will install WordPress for you and You'll get other options as well all we

Need to do is click the green get Started button right here and that then Brings you to the sign up page so you Can select the plan that's going to suit You now what I would recommend is Looking at different options that you Get with each of these plans and see Which one is going to fit your budget But also give you an option to grow as Well and the one that we recommend Because it's a really really good deal Is the choice plus or option right here Because you can add unlimited websites To this plan you get a huge amount of Website space you get the free SSL Certificate you get the free domain name And then you get all these other options As well So once you've made a choice just click The green select button right here to Choose the plan that you want so next You'll see this page and this page is Where we'll set up your domain so if You've bought a domain previously you Can use that and you can add that right Here or you can use the free domain name That you get when signing up for Bluehost and you can choose that right Here so I'm going to add in a domain That I want for my business And I'm just going to click the blue Next button to see if that's available As you can see that domain is available So I can use that for my website

All you need to do is fill in your Account information right there Take a look at your package information And make sure that's correct you can use The drop down right here to choose Either 12 or 36 months and if we scroll Down a little bit more You can also see under package extras There are things that you get with the Package and also those add-ons that you Can add to this package as well I don't Currently want this add-on so I am going To uncheck that so once you've added Your package extras then you can add Your payment information and create your Account once your account's created then You can sign into your account and I Will meet you in the Bluehost hosting Dashboard so now that we've logged into Our Bluehost hosting dashboard we can Check a couple of things out on our Website so I'm going to head over to my Sites over here and click on that just Going down the tabs here you've got Users backups performance security Plugins and settings so you've got Access to control certain things on your WordPress site I'm just going to head to The security tab right here because I Just want to check that the SSL Certificate has been installed and Enabled on the site as you can see right Here we can see SSL certificate is Enabled on the site which is fantastic

So now what we need to do is log into Our WordPress site and there are a Couple of ways you can do that but with Bluehost the easiest way to log into Your WordPress site and one way you Don't have to enter a password at all is By clicking this login to WordPress Button here I'm just going to click on That So the first time you visit your WordPress dashboard it looks a little Bit like this so if we take a look on The left hand side over here we have our WordPress dashboard menu and this takes Us to lots of different parts of the Site where we can make changes there are Also a few things in here that link to Plugins and we'll get into that a little Bit later in the video if we look at the Very very top bar this is called the WordPress admin bar right up here and if We go from left to right we'll just go Quickly go through the items that you See right here so you've got a bit of an Understanding of what it is if you click On the little WordPress logo right here It's going to bring you back to this Dashboard every single time if you click On the little home icon and also it has Your website name as well next to it That will take you to visit your site so You can take a look at the site anytime Next to that is a little comment section So you can reply to comments so if you

Click on this you can reply to comments Quickly next to that is a plus button With new next to it and that allows you To add post page media Etc from the Admin bar so if you're in another part Of the site and you want to add a post At some point or you're looking at the Web website you can then add a post and Page from there and that makes it nice And quick then there's some other Shortcuts up here to other things and These are linked to plugins that we Currently have on the site if we head Right over here to the right hand side We can see that we've got a part that Says site status coming soon so what Bluehost do is they make sure your Site's protected straight away by Putting up a coming soon page so if Anyone visits your domain name that's Not logged into your site they'll just See a coming soon page on the website That protects all the information and Also stops people viewing the page Whilst you're currently building the Site next to that you can see that You'll be able to see your username if You hover over that and click on edit Profile that'll take you to your user Profile and you'll be able to edit Things like your name address and also Change your password as well I always Think this dashboard looks a little bit Cluttered and we're also going to see it

A lot when we're working on our website But I'm just going to dismiss this Notification right here and I'm going to Dismiss this notification right here as Well I'm going to click on the screen Options drop down right here And I'm just going to get rid of all of These for now And tidy that up So already it's looking a little bit Better you can close any notifications That you can see So I'm also going to do a little bit More tidying up on the site at the Moment we've got some plugins on the Site that we don't really need to be Activated so I'm just going to head to Plugins over here and click on that and I'm not necessarily going to delete Plugins I'm just going to deactivate the Plugins we don't currently need whilst We're building the store we're going to Click the little checkbox by the plugins That I don't currently need We deactivate all those plugins at the Moment I'll leave the Bluehost plugin as It is as well and just click on bulk Actions right here drop down Then deactivate and then click apply so If we head over to our dashboard we can Now see that it's pretty much cleaned That up and on the menu on the left Right here we can see it's tidied that Up a lot as well so it's a lot easier to

Look at for us as someone building the Site and on the admin bar as well it's Cleared all that up as well so we will Reactivate a couple of those plugins but But now we'll just leave it like this Because it's a nice clean way to start With the site so the next step for us is To just check the settings on our site And just make sure everything is how it Should be so to do that we're going to Head over to settings here on the left Hand side hover over that and then click On General now under the general Settings because there's a few things That we can change or add to our website That we can check the site title and so We can change this to our business name If we want to we can add a tagline as Well to explain what a business does Underneath that we can check the URL so We can check that we have the right the Name name and also we can see here it Says https so if it wasn't running an SSL certificate or an FSL certificate Wasn't installed on the site it would Say http but as we can see we're running The https which means the SSL Certificate is working you can also Change the admin email address as well That we set up with the site and if we Scroll down a little bit we can also Choose the date and time format for our Site as well and then all you have to do Is click save changes to save all those

The next thing you want to look at is The permalinks for our site that we're Going to head over to permalinks here Underneath the settings option on the Menu click on that so underneath the Power link settings here you've got a Few options that you can choose for your Permalink structure so the structure That we actually recommend is the post Name structure right here that's going To make it really easy to read for the User of your site and also for search Engines as well and what this is doing Is it's giving you the URL of your site And then it's adding in the title of the Postal page at the end of that URL which Makes it much more easier for you to Control than having something like Forward slash P equals one two three That doesn't really tell us anything About the page and the content on it now Once you've chosen and post name just Head down here and click save changes And that will save those changes for you So our next step from here is to install A theme on our site and if we head to Our site and just take a quick look at What it looks like right now so head up Here at the top left and click on the Little home icon there That'll take us to the site and what you See right here the design that you see Is basically the website fee so at the Moment we've got a very simple website

Thing the default WordPress theme we're Going to change that into a theme that Is easier to control and gives us a lot More options in the way that we style And lay out our site so I'm going to Head back over to our dashboard by Clicking on this dashboard icon right There and then all we're going to do is Come down to appearance here on the left Hand side hover over that and then click On themes so this is the theme screen Right here and we can see that we've got The 2023 active WordPress theme right Now we also have the 2021 and 2022 beams Installed on the site as well well we Don't currently need these themes so What I'm going to do to make sure Everything's nice and clean is just Click on this and then click delete Right here and remove that from the site It's the same with the 2022 theme And I'm just going to leave this theme Right here and I always recommend when Installing a new theme on your WordPress Site that you leave one of the default WordPress themes because if there Happens to be any issues with your Current theme you can always have a WordPress theme before back on so how do We install a WordPress theme on our site So to do that we're going to head up to WordPress.org themes button right here And click on that so what you see on This page right here is the

WordPress.org directory of themes that Are available to install on your site And these are themes that are past WordPress checks and will work really Well on your website the one that I'm Going to look for is the Astra theme Which is a very popular theme so all we Need to do is head over to the search Bar right here and type in Astro Click enter this is the Astra theme Right here though you can look at the Details by clicking this button right Here and it will tell you a little bit Of information about the theme itself And give you a little bit of a preview What I'm going to do is I'm going to Click the install button and that's Going to install the theme to our site Then once it's installed you want to Just click the activate Button as well Make sure that's the active theme on the Site as well so as you can see we now Have Astra installed on our website and It's our active theme so the next thing To do is to add a couple of plugins to The website and to install plugins all You need to do is head over to plugins Here on the left hand side hover over That and click on add new now this is Going to bring us to the ad plugins page And this is a page that shows you all The plugins that are available from the WordPress repository so you've got tabs For Featured popular recommended

Favorites and premium plugins but what I'm going to do is I'm just going to use The search bar right over here and just Type in woocommerce and this is the Plugin we want right here woocommerce by Automatic just going to click the Install Now button to install it and Once that's installed we're just going To click the blue activate Button as Well so now we can see woocommerce is Active on the website we can see it Right here on the left hand side in the Sidebar so now we're going to add Another plugin so we're just going to Click on add new up here and in the Search bar right here we're just going To type in starter templates so this is The plugin right here it's the starter Templates by brainstorm Force just going To click install now that's going to Install and then once that's installed We can clip the blue activate button to Activate it on the site So now we can see starter templates is Installed and activated on the site We're just going to scroll down a little Bit So the next thing we're going to do is We're going to use starter templates to Install a template for our theme so that It gives us a good starting point for Building the site up so to do that all We need to do is click on C library Right here once the starter templates

That plugin is active all you want to do Is click on the build your website now Button right here And we're going to choose the block Editor for our page builder there are Other page Builders available but for This video we're going to use the WordPress block editor as it comes with The site and it's built by WordPress as Well and that brings you to the starter Templates page and this is the template You're going to be using to help build The website so what these templates do They give you a great base to go from And you can either import template Itself with how the customizer setup or You can import the whole site with the Content and everything and then you can Swap out the content or your own content And that will give you a good kickstart In getting your site built what I'm Going to do is just import the starter Template to give us a base and not the Content so the first thing I'm going to Do is come over to the e-commerce tab Here because I know I want to install an Online shop so I'm just going to click On that as you can see you get all these Starter templates that you can use as The base as your shop and if you click On one of the templates it will show you A demo of that template and this is a Bicycle shop template you can see it's Got products

Some information And also shows other sections of Accessories and things like that as well The template I want to use for the Website we're creating in this video is This template right here Don't worry if you don't like the colors Or the fonts or anything like what I'm Looking at for this template is Basically how the header is positioned Right here so that's the navigation menu The basket and things like that and then Also how the butter is laid out as well I quite like that so I'm going to use That as the basis for the website and we Can change all the colors and we'll do That a bit further in the video when we Do customizing the site itself so from Here you can drop in your logo if you Want to but we're going to do that at a Different stage so we're going to leave That as it is we're just going to click Skip and to continue it's going to leave It as the default colors because we are Going to change the colors and the fonts As well I'm just going to change the Fonts with the customizer as well in WordPress so I'll just click continue You can put your information in here if You want to you don't have to and then To keep the boxes checked that you want Checked so I'm going to import the Customizer settings import the widget And then I'm just unchecking import

Content because I don't want any of that Content and we're going to add our own Content to the website and I'm just Going to click submit and build my Website and then once you see this page Just going to click view your website Let's open the website up enough as you Can see you can't see anything at the Moment it's not very good but we're Going to tackle that now so what we're Going to do is head back to dashboard by Clicking on this The first thing we're going to do is We're going to add some pages to our Website and then create a navigation Menu so we can see what that looks like On the site because if we go back to the Site here we can see at the moment we've Just got a sample page set up we've got No other pages and we want to change That and make this look a little bit Better so head back to dashboard and Then what we're going to do is we're Going to come down to Pages here on the Left hand side and click on that we'll See what pages we currently have so we Currently have a sample page and a Privacy policy page which is in the Draft form but we're going to trash this Sample page get rid of that then we're Going to click add new so this now is The block editor for the page that we're About to create so it does give you a Little bit of a walkthrough if you want

To go through that I'm not going to do That I'm going to click off and I'm just Going to give you an overview of what This is exactly so up here as it says You can add the title for your page so I Know we're going to need a home page so I'm just going to type in home there and Then with this block editor the reason It's called a block editor is because The page itself can be broken up into Blocks so as you can see here it says Type to choose a block or you can click On the little plus icon here to add a Block and what you can do then is you Can search for different things so you Can add an image heading paragraph Etc There's lots and lots of locks we can Add to this page and we're going to get Into that when we start building these Pages out but for now what we're going To do is we're just going to have the Home page and I have to say at this Point I have written down some pages That I want from my site so it might be A good idea for you to do some research And look at the kind of pages you want To add to your site but for me my top Level pages that are going to go on my Navigation menu I'm going to create a Home page store Page a Blog Page an About page and a contact page so I'm Just going to go ahead and create them Now so we've got the home page we're not Going to do anything to it but we're

Just going to click publish and then Publish again and now that's created the Home page and we're just going to click Add new and we will create another page Let's go call this store I'm going to click publish publish again And I'm going to add another page For this blog Click publish publish again And we're going to add another page as Well just got two more to do About page we can add some information About the company to the site And then finally add another page And this is going to be our contact page We're just going to click publish and Publish again So we've added those pages to the site We haven't added any content to those Pages just yet what we're going to do is We're going to create the navigation Menu so that everything's all set up to See these Pages all we need to do is go To this WordPress icon in the top left And just click on it and this is the Pages section of the WordPress dashboard And we can see we now have all the pages Set up here in this list so like I said Now we're going to add these pages to The navigation menu and the way that we Do that is we head over to appearance Here on the left hand side and as you Can see there's lots of things that come Up here but you can see there's an item

For menus just click on that and this is The menu section and we do not have a Menu currently at the moment so it's Telling us to create our first menu so If you come over to menu structure here And you give the menu a name so I'm just Going to call it primary Okay and then under the menu settings You can choose to add all top level Pages to the menu or you can not check That box if you don't want to display Location is a primary menu I'm just Going to check that then click create Menu down here in the bottom right Now that we have our primary menu what We need to do is we need to add items to This menu and as you can see right here Next to the menu structure is the add Menu items So what we have here if we close this Down we've got pages that we can add to The menu we've got post we can add to The menu we can add custom links per Menu categories for posts or products And woocommerce endpoints as well so we Can add these to the menu as well so What we're going to do is we're going to Click on pages to drop down and open That up you can click on view all to see All the pages you currently have created So I've got home page we're going to Check that the about page Blog Page Contact page and the store I'm going to click that add to menu now

You can see we've got all these Pages Here added to the primary menu if you Click the little drop down by each of The pages you'll be able to see that you Can change the label to whatever you Want so if you're not if you're not Quite keen on just it being called Contacts you can add contact us And that will change the label of the Item on the navigation menu you can also Rearrange these as well so I I'd want These in a different order so I want the Store right next to the home page so you Just drag and drop that into place then I'm going to have the blog next to the Store And the about section and contact us Once you're happy with how they're all Laid out and you've got the pages that You want on the menu just click the save Menu button down in the bottom here and That will save the menu for you And now we've done that we can head back To our website and have a look at that Menu as you can see there's the menu in The order that we've selected So now we've done that and we've set up Navigation menu we've got the pages Added to our website next thing we want To do really quickly is just make sure That our home page displays as our front Page and to do that we're going to come Up to customize here just click on that And if you come down to home page

Settings right here Your home page can display your latest Posts or a static page it's currently Switched onto the Statics page which is What we need And then we can choose the page that we Want to be the home page we're going to Select our home page right there click On that so once you've done that you can Click publish and that'll save those Settings and if you click the little Cross in the corner right here that's Going to close customize it down and the Next thing for us to do is to head back To the dashboard and from here the next Step is to set up woocommerce and what Woocommerce is is a plugin to turn your WordPress site into an online store so It adds all the functions and features You'll need for your store and you'll See this as we go through the setup Process so what we're going to do is Just click on woocommerce right here and Once we click on that we'll now be taken Through the woocommerce setup wizard so It's going to ask you a few different Questions and use all the answers to set You up as best as possible so what you Want to do is enter in your store Address postcode and your email address Right here Once you've added in all your details Then click continue then it's going to Ask you which industry does your Store

Operate in we're building a tech online Store so electronics and computer sounds Good to me so I'm just going to click Continue on that it's going to ask me What kind of products will be listed We're currently going to list physical Products as you can see you can add Downloads to that as well subscriptions As well and then there's also add-ons For memberships bookings bundles and Customizable products as well so choose The products that you'll list on your Website and then just click continue Then they want to know a little bit more About the business so you can click how Many products you want to add I think 11 To 100 is about right for what I want to Do and are we currently selling anywhere Else I'm just gonna put no under the Free features right here I'm just going To uncheck add recommended business Features to my site because I don't want Those added so then it's asking me to Choose a theme I currently have Astra Anyway so I'm just going to click with My continue with my active theme so this Is the main woocommerce dashboard and as You can see there's a process of steps Here woocommerce wants us to take so That our store is fully set up and ready To go in this video I'm just going to Miss out projects for the moment and I'm Just gonna head over to setup payments I'm going to click on that so

Woocommerce does have its own payment Platform that you can add to woocommerce What we actually recommend doing is Clicking on other payment providers down Here scrolling down we actually Recommend either setting up stripe or PayPal payments as a way of taking Payments through your site it's a little Bit easier and user friendly so we just Going to click the get started button Right here by PayPal payments as you can See it's installed PayPal payments and Now it's telling us to configure our PayPal account so I'm just going to Click the blue get started button right There there's another notification here Just let us know that Paypal payment is Almost ready we just need to connect our Account so obviously you will need a PayPal account to add PayPal to your Website and if that's the same with Stripe as well I'm just going to click The activate paper button down here So here you have the option to add an Existing PayPal account or create a new PayPal account for your store so you can Go ahead and do that so once you've Signed in and verified your account you Can now go back to WordPress So now we've consumed we've successfully Connected PayPal to woocommerce there's One other thing that I'd suggest you do Is if you head up to payments here and Click on there and then you'll be able

To see all the payment gateways that you Can add to your site if you scroll down And just turn on the cash on delivery Method And then click on Save changes you'll Then be able to test out your checkout Without having to put any details into PayPal once you've done that head back To the woocommerce dashboard So now we've got our woocommerce store Set up and we've added our store details And we've set up our payment methods the Next thing we can do is start adding Products to our website but before we Get started on adding products there's One thing that we need to look at first And that's adding categories for the Products to our site so what we're going To do is going to head to products over Here on the left hand side hover over That and then click on categories Now why I think it's a good idea to add Categories to your site when you're Adding lots of products to your website As well is because it's going to be Easier for users to navigate around your Site and also you can link to these Categories in the navigation bar and Also on the main product or store Page You'll be able to use a sort and filter So people can filter the products they See by the categories so if they're Looking for smart watches they can find Smart watches if they're looking for

Smartphones they can find all the Smartphones on your site without having To go through all the different products So with that being said just to give you An overview of the product category page You can see that in the category list Right here we have a uncategorized item And that's the default item that you get When you start your store then you've Got all the information here to add your New category in so I've got some Categories that I need to add to my site So I'm just going to add a couple of Those in so the name for my category I'm Going to go smart watches and then the Slug which is at the end of the URL so That people can instantly go to that Category page and parent category so if This was part of a larger group of Categories so if this was a site where There was home electronics and then There was personal accessories you could Put your headphone category and your Smartwatch category and maybe even your Smartphone category into the accessory Parent category so at the moment I've Not got any parent categories that I Want this to be part of so I'm just keep That as none then you can add a Description if you want to this category So the display type right there I'm just Going to leave as default and then you Can also add a thumbnail to the category If you want I'm just going to click add

New category now we can see that in the List right there I'm just going to add Another one So there we have we've got two different Categories now added to the category Section so now once we've added all our Categories in we're happy with them we Can now add a product so how do we add a Product Or if you head over here to products on The left hand side you'll be able to see And add new right there just click on That So this is the add new product page I'm Just going to give you a quick overview Of what's on this page and what we're Going to be filling out so up here at The top is the product name and then Below that is a description and we're Going to add information here about the Product to the description then below That if we just scroll down we've got The information for the store and Woocommerce so we've got all our product Data then we've got tabs that we can Fill out information on as well we've Got a short description to add to the Product and then we can also add product Images and also select our categories as Well so starting with the product name And with the product name you want to Make it interesting and something your Customers want to click on so whether You add the product brand the product

Name and also maybe a couple of things That differentiate the products from Other products on your site then you Could add that in here so I'm just going To copy and paste some information that I've got saved on a document elsewhere Into this so once you've added in the Product name then you're gonna head down Here into the product description and This is where you can really add lot More detail to this product and give as Much information as possible they're Really going to sell this product to the Customers coming to your site so whether That's a brief overview of the product And its main selling features and then You break it down into all of its Features and then specific information About the different parts of the product So for me I'm going to add a description About the smart watch and I'm going to Add the features and then I'm going to Give an information about the battery Life and the material of the watch as Well in this section so think about how You can add to this section and give as Much information as possible because This is going to be the information that Your customers are going to look at and Also the search engines are going to Look at and try to understand what Product it is you are selling so once You've added your information in there I'm just going to scroll down a little

Bit Then we come to our woocommerce section So this is setting up some details about The product itself so underneath the Product data here we've got drop down And we're currently on simple product Which is what this is but just to show You there are also options for group Products external affiliate products and Variable products and clicking on either Of these will change some of these tabs Right here and you have to input Different information so I'm going to Select simple product because that's What this is then right next to this you Can see there's a virtual and Downloadable checkboxes right there so This product is a physical product so It's not virtual or downloadable product But if you have those kind of products You'd check one of those boxes there Then heading down to the first tab here It's the general Tab and this is where You're going to put your price in for Your product you add your regular price In here and you can also add a sales Price in here and what's pretty cool is If you click on the schedule link right Here you can also schedule the sale Dates right there which is pretty cool Heading to the inventory tab right here Clicking on that so the first item here Is SKU and that's give this product in Internal name or code so it's easy for

You to understand which products been Ordered and also it's good for managing Stock as well so you can do that right There underneath there you can see There's a little check box to manage Stock and if you click on that check box You're going to see that opens up a Couple more options and we've got Options here to add in the stock Quantity that we currently hold whether We allow back orders and what the low Stock threshold is for the site or for The item itself I'm not going to manage The stock so I'm just going to click off That then you can also add in the stock Status so you can either choose in stock Out of stock or on back order so we're Currently in stock of these products and Then finally the last option right here Is whether we want to limit this Purchase to one item per order and that Will do that shipping right here you can Add in all the shipping information for This product and then you can sort out Shipping elsewhere in woocommerce as Well underneath that is linked products We have two options here we've got Upsells and we've got cross sales Upsells are products that you want to Display on this product page might be Similar to this product but maybe more Expensive or have a better profit margin So you want to put those products on This page and maybe persuade people that

Are looking at this product And craft sales are products that are Linked to this product and these are Products that are going to be displayed In the cart when someone goes to the Checkout so these things are maybe Accessories for the product or linked Products that the customer might be Interested in and you can just add these By typing in three or more characters And finding the products that you've Added to the site already below that is Attribute so you can add custom Attributes as well to the product so Whether it's colors or sizes and things Like that you could add those custom Attributes in here below that is the Advanced tab so you can add a purchase Note so when someone purchases this Product you can add a custom note to the Order as well you can give it a menu Order and below that is a really Important option I think is to enable Reviews I think this is a really good Option because having people review Products on your site is a really really Good way of getting other customers to Buy and in the bottom right here we've Got get more options and as we're using The base version of woocommerce there Are options here to expand the Functionality of woocommerce so if you Need to grow the store over time or you Have a specific Beach that you need

There are options to upgrade and add These extensions on as well below this Product data box right there is a Product short description and if you Just click on that you can open it up This is the description that's going to Be displayed on the category or store Page so it's just going to be a small Bit of text that might persuade someone To click on that product I'm going to Add a little bit of text right now now I've added that in there I'm just going To scroll up And we're now going to focus on this Area on the right hand side of the Screen right now and this top box right Here is something that you'll see across The site it is the way that we publish And save our pages and posts throughout The site so this is not something that's Just attached to a product a new product Page it's something you'll see in posts And Pages as well first thing I'm going To do is disable this information I'm Just going to save the draft and that's Something to get into the habit of doing Because that's quite easy to lose Information if you don't save it and Then below that I'm just going to scroll Down and we can see there's a product Image box there so this option right Here is so we can add the main image to This product and this image will be the One that displays in the store or on the

Category page or in a featured area or Something like that and we're just going To cover my recommendation for images as A whole across the site as well if we Click on set product image that will Take us to the media library right here And as we can see we've not got any Images that we've added to our media Library so we're going to need to upload Files we can do that by clicking the Upload files tab right there And then what we're going to do is Select files from our computer but the First thing I would recommend you do When you've got your images of your Products is then use a tool called Tinypng and that's going to help you Optimize your images for your website so We're just going to head to the tiny PNG Website so this is the tiny PNG website And you can do this with photo editing Software if you want and there are other Options for optimizing compressing Images but I use tiny PNG quite a lot But I'm going to use that one so all you Need to do is drag and drop your image Files right there so I'm going to do That So as you can see I've added those Images to Tiny PNG and it's compressed These images and saved us around about 67 of the total size of those images Which is fantastic so all you need to do Then is Click download all and that's

Going to download it in the zip file and Then once you've downloaded those images Then head back to your WordPress site And then under the upload file section Right here I'm just going to drag and Drop my images in And once you've dragged and dropped your Images in you'll see that they're Starting to upload to the site so now You can see all these product images Have been uploaded to the media library And if you click on them you'll be able To see here on the right hand side you See some information about these Products and just to let you know these Images were downloaded from unsplash and I'll put a link in the description to Them Splash where you can get some Really great images for your demo sites And stuff like that but underneath there You can see the file size of the images And the actual size of the images as Well you've got the option to edit an Image and delete the image as well Something I'm not going to do for this Demo site but I do recommend you do for Your stores is add some alt text and Also change the title to be an SEO Friendly title and you can find out About how to optimize images or SEO There is a link in the description below For that so I'm going to just select the Image I want for my featured image which Is this one right here and then I'm

Going to come down here to the bottom Right and click on set product image so As you can see that's set the product Image right there and then I'm going to Add the other product images to the Gallery so I'm just click on this button Right here and then select those by Selecting the first one holding down Shift and then selecting the other If you want to remove one you can click The top right corner and then add them To gallery and now we've got one main Image and three product images for our Gallery we scroll down a little bit more We can see we can select our product Category so the ones we set up a bit Earlier in the video so I'm just going To uncheck uncategorized and check the Smart watches category but you can Select more than one category for an Item as well if you want to You can add product tags to your item as Well if you want to give more Descriptive tags to an item and then People can search for them quite quickly Through the site as well we've got Astra Settings at the bottom here which I'm Going to leave because we're going to be Taking a look at that in a little bit so I'm going to scroll to the top of the Page and then once you're happy with Your product and you're happy with Everything that you've added to it you Can click publish right here and that

Will publish the page and once that page Has been published we can click this View product link right here to go and View the product on the site So there we have our main product image And then we also have the other product Images that we set up under that as well So as you can see there's a category There's our title our price is set in There and also a short description as Well and then underneath this is a Larger description and a space for People to add reviews So now we've added a product to our site We can now add as many of those products As we want and we can also add variable Products and things like that to really Build up our product catalog and our Store on our website the next thing for Us to tackle is the actual look of the Website and customizing the theme at the Moment we're currently using the starter Template theme as it was in its default State and we want to change that a Little bit and make it look more like The kind of site that we want so to do That I'm going to do it from this Product page right here just head up Here to customize in the admin bar at The top and just click on that and what That's going to do is it's going to open The customizer so this column right here Is the theme customizer and if you head Back because we're currently on the the

Single product setting right now if you Head back you can see that this right Here is the customizer for the Astra Theme that's the one we've got installed At the moment and we're going to go Through this step by step and customize The website to make it look a little bit More like the website that we want so The first option right here is the Global settings so these are settings That can be applied throughout the site And if we click on this tab here we'll Be able to see the type of things that We can customize throughout the site so They're more uniform typography so the Fonts colors the container styles on the Websites the buttons and then also some Options for the block editor as well When we're editing the pages so our First option right here is typography as You can see we've got a few different Presets right here that we can choose From but underneath these presets you Can see that the base fonts right here And then there's heading fonts as well So there's the body font and if you Click on the little edit button right Here that'll then open up this pop-up And we can choose whatever font we want From this list so I quite like pop-ins So I'm going to use pop-ins on both my Header and my body and then I'm just Going to leave all the other settings as They are

Then for the headings font I'm just Going to use the same font but you're More than welcome to use whatever font Combination that you feel fits with your Brand So just to explain the heading fonts Right here the H1 font is usually the Biggest heading on the screen and this Is used most of the time for page titles Blog post titles titles or products and Things like that and you can change each Of the settings for each one of these so If you click on the edit button here It'll let you know what kind of size Weight and line height stuff like that That's the same option for all the Different font sizes Have a couple of other options down here But I've set mine up how I want so you Can click publish up here just to save Those changes and I recommend clicking Publish throughout the process of Setting up the customizer just so that You save the changes that you're making To your site just in case anything was To happen so we're just going to go back And choose the colors on our site so as We can see we've got Global palette Right here and throughout the site you Can see that it's pulling colors from The global palette so if I change this Color here it's going to change the Colors throughout here So I want a bit more of a darker color

And that's going to change all the color Ones to Black on the site We can see right here that the links Color this is what the link looks like Normally and then when you hover over it It's going to turn to Green so if I do That on the side you can see it turns to Green there so what I do is change color To here to I might have a brand which is More blue so I'll change that and then That'll change the color of that on the Links on the site and you can do that For all these colors here and also you Can individually change settings as well So you can change the site background Color as well you can always reset the Colors by pressing this little button Right here and then once you're happy With the colors that you currently have You can click on publish and that will Save those settings The container settings I'm going to Leave them as they are I think it looks Fine as it is So for buttons we have button presets Right here so we're on a bit more of a Square or button preset at the moment I Quite like a round button preset There's options down here for the text Color background color border color the Font type on the button as well so if You want to change the font type on the Button to something else so I just want To keep it uniform

And then you can choose the type of Padding so the area that is around the Button and the Border width I'm going to Leave that as it is I think it looks Quite good so I'm just going to click Publish And then block entity don't really need To change any of those settings so we'll Just leave it as it is then head back And now we're under the header Builder So now we're moving on to and changing The options for this up here which is Called the header So you can click on the link right here To edit this row if you want to and you Can edit individual items or you can Click on header Builder right here so Underneath the header Builder you've got It divided into elements and the design Section so the elements are the items That you can see currently in this Header so you've got the logo you've got The site navigation and the account and Cart and we can see underneath these Elements we've got all those right here So if you click on the site title and Logo we can edit those settings so the Moment we've got the default logo that Came with the starter template we can Change that logo and if we've already Uploaded a logo we would find it in the Media library we haven't uploaded our Logo at the moment so I'm going to drag That logo into place

So once that's loaded up I'm just going To click select to select that logo Crop the image to select all of the Image as you can see that's just placed It in the design right there and you can Choose a different logo for retina Devices so you can choose a logo that is A smaller file size for normal screens And then you need a larger file size Logo for retina devices because they've Seen a much higher resolution logo width We can just change that here so we can Change it to fit how we want so if we Want it a little bit smaller So I might want it 250 and then display Site title you can choose to whether you Want to display the site title or not And you can display the site tag as well Site icon so you can change the site Icon to something from your logo as well So that's the icon that appears on the Tabs in your browser I'm just going to leave as it is for now And then on the design side for the logo As well we can add in some spacing Around our logo if it doesn't quite fit Into place Then I'm going to head back And look at our primary menu right here Which is the menu right there One thing we can do is if we go to the Design right here Choose a hover style for the menu if we When we hover over it it changes

We can also scroll down And we can choose the menu color so text Links color and then the menu font and I'm just going to change that And I'm just going to make it a little Bit smaller and then you can choose the Different spacing and margin options if You want to as well And for the cart we can select the cart Icon on this one so we can have a bag a Shopping trolley or a basket I quite Like the bag option Over there you could use a label for the Cart as well if you want and then the Cart click so this is what happens when You click on the cart button so right Now we've got a drop down that would Come out here But we can have a slide in But if we click on that it slides in From the side Or it goes to the cart page So I quite like the sliding option I'm Gonna go with that And you can also change the width of That as well And you can choose a few different Design options as well with that so you Can just customize it however you see Fit And then just do the same for the Account page as well So just below this there's also the Header type so there's a transparent

Header so if you're using images at the Top of your page you can enable that and That'll move All the items so that it sit so this Header sits over the top of that image Currently doesn't work the the site that We've got so I'm just gonna disable that And then under the design for the header Builder as well we've got options to be Full width or content width so full Width is all the way to the edges of the Page or content width is in line with That content I'm just going to go full Width Then just click publish and if you want To move these around there is option Down here so you can see you've got the Layout right here and you can add other Options as well above and below this so We can swap the account and cart around There so you can have your account and Then your cart to the side Your primary navigation menu so you Could move your primary navigation right Here so if you wanted your private Navigation right next to your account And your cart you can do that And obviously your site and Logo can Move and if you click the plus button You can add other items to this as well That you might have set up so HTML items Secondary menu and widget items as well As adding a search if you want a search Bar up there you can have that as well

So I think that's quite handy to have so We can just leave that up there Okay publish And now we've customized that to how we Like it so you can choose to have Breadcrumbs switched on as well And if you want to find out more about That then there is a link in the Description below There is an option for customizing the Blog post and Pages as well and the Sidebar but one thing we want to look at Right now is the footer Builder so we're Going to head to that as you can see It's brought up the footer at the bottom Of the page right here And it's very similar to customizing the Header so you just change these items to How you want them underneath the Elements right here the first thing is To copyright Can leave the copyright current year and We'll just put our site title Alignment's completely fine and click on Publish And then we can see under html1 this is The little payment signs there And then widget one would be the Image right here So we can change that so if we click on This but this right here click replace Choose Media Library We can upload an image and I've got a White version of my logo which I'm going

To add in there Once that's uploaded I'll click select And then I've added that in there and Then you can also change all these links And options right here so if you've got More links that you want to add to your Website you can build that up as well or You can add different types of widgets To these sections so underneath this Widget right here we've got This but if you click on the plus button Right there you can add images headings Other things in here as well and you Click this button right down here you Can browse all of these So this is what you can add in terms of Blocks to that section so there's lots And lots and lots of options right there And also you can search for them as well If you click in the little search bar And you know what you're looking for you Can do that I'm just going to leave it As it is and we can update this as and When the site is built up just going to Click publish so now we're taking a Quick look at header and footer Builders And obviously you can customize them as Much as you want as well there are Plenty of options and we have plenty of Resources to do with this at Wpbeginner.com the links for those Resources are in the description below I'm gonna head back to our main Customizer settings here and we're just

Gonna go to woocommerce right here click On that We scroll up on our page And then underneath the general settings For woocommerce we can see that we've Got a container and layout options I'm Going to leave them as they are we've Got product catalog options as well but We'll cover that in a minute and then We've got our single product options Which we're on a single product right Now so we're going to click on that We've got our layout options and then a Sidebar option as well so if we want to Add a sidebar in here we can So we can have widgets and navigation Items right there I'm just going to Leave it as it is And then we've got our product structure As well so that we can change all these Around so we can have our title above Our category So I quite like that and then we've got The option to have our ratings when People review the product they give it Ratings we can display them any of these You can also click on the little I and Turn them off as well if you don't want To show the title we don't have to show The title and you can remove things from There Underneath the product options we've got Enabled breadcrumbs so this is really Handy if we want people to know where

Exactly they are in terms of the store So we're currently under the smart watch Product that we've added to the site and That's under smart watches as well and If they click on that they'll head back To the Smartwatch category and they can View from there so I think this is quite A useful tool as well for users and also If you've got a large page you can add a Sticky add to cart Button as well so if You scroll down That's a really neat option to have so If people want to add that to the cut I Didn't have to scroll up to the top I'm Going to leave that as it is but you can Also have that at the bottom of the page As well so I'm going to click on publish Now that we've set that up we can click On design and we can change the design As well or some of the elements on the Page But I'm quite happy with the single Product as it is So there are options here to customize The car check out also some other things As well for the woocommerce but we're Quite happy with how we've set up this Product page at the moment so that's Fine we'll just head back and now Underneath that we can see we've got our Site identity settings as well so we can Change our site title logo from here and Our site icon from here as well if we Didn't do it before we've got options to

Change the menu items widgets on the Site and then our home page settings so Where we set as a home what we set as a Home page and what we set as a blog post Page as well And then we've got some options to add Additional custom CSS as well Just quickly on these settings right Here so currently we can see what it Looks like on our desktop but we can see What it looks like on a tablet as well So you can see how responsive this theme Is and how what the layout looks like on A tablet and very similar let's see what That looks like on mobile as well So that's all the customizing we're Going to do with this theme right now so It's going to make sure it's published And then just click the little X up here To exit the customizer So now we've done quite a bit of Customizing to the site we can move on And start adding more things to the Website itself so just to let you know I've gone ahead and added more products To this site so I'll just show you the Products I've added we have A few more products added there and I've Also added some some blog posts to this Site as well and the reason that I've Gone ahead and added these is because We're now going to look at setting up The rest of the pages for the site and One of those that we'll be working on is

The home page but before we do that There's a couple of things we need to Set up in woocommerce to make sure that It's a fully functioning store so what We're going to do is going to head to Woocommerce hover over that and then Click on settings and the first thing We're going to do is we're going to Assign the page for our store so to do That all we need to do is head to Products up here click on that and then You'll see under shop pages right here We're just going to click the drop down And then choose your store page that you Created earlier then scroll down And click save changes now to make sure Customers can create their own accounts And things like that on the site just Need to switch that on so all we need to Do is come up to accounts and privacy up Here and click on that and then under Guest checkout right here we're just Going to click allow customers to log Into existing accounts during checkout Then under account creation we're just Going to check these two right here Then scroll down And click on Save changes now as I said To full woocommerce to be a fully Functioning store there are a few other Pages that need to be created which we Didn't create at the start of the video Now don't worry woocommerce has an Amazing tool that helps you create every

Single page that you need with one click Of a button so all we need to do is come Up to status right here click on that And then once you're on the status page Just click on the tools tab up here and There's lots of great tools right here But if you scroll down just a bit You'll see right here create default Woocommerce pages so what this is going To do is going to create the checkout Page the cart page the my account page We don't need to do anything else other Than click this create Pages button Right here notification to ask if we Want to run this tool we're just going To click ok so now all the missing Woocommerce pages are successfully Installed and if we head to Pages we can See that so we now have a cart page a Checkout page we've also got a my Account page and also a draft refund and Returns policy page as well and we can See that the store page that we created Is our shop page as well Let's just take a look at what the Website looks like at the moment So this is currently our home page for Our site and it's not exactly what we Want we're going to do a little bit of Work and quickly build this out with a Few things that you'd see on a online Store home page start editing this page All we need to do is come up here to the Admin bar and just click on edit page

And that's then going to open the block Editor for that page and the first thing That we're going to add to this page is What's called a hero section which is Usually a large image or Banner at the Top of the page with some text on it so To add that to this page I'm just going To click on the little add block button Right here and then all we need to do is Put in a container so we're just going To type that in and you don't even have To type the whole thing in this is the Container right here we're just going to Add that and then you can choose the Layout that you want for your container I'm just going to use this one then if You select this container you'll then See on the right hand side over here you Get some options so I'm just going to Use this drop down right here I'm going To make sure my container width is full Width the contact width is boxed You can choose your box width as well And then I'm just going to make sure my Minimum height is 700 pixels I can leave all the other options as They are And then for style I'm just going to Click on that and then we can choose the Type of background that we have for this Container so we have an option for color Gradient image and video I'm going to Choose an image And then I'm just going to click this

Button right here to choose the image From the media library I've already Selected an image that I'm going to use For this and it's this image right here So I'm going to choose that and click Select and as you can see that image has Been put right there and it's filling The container there are other options Further on down as well which you can Change the position of the image in the Container and as I'm going to be using Some text over this image I'm just going To add an overlay to this image so I'm Just going to click on classic and then Under image overlay color I'm just going To choose Gray color and then choose a Transparency there are other options Further on down there but I'm quite Happy with that so then to add some text To this there is a little button right Here to add a block so we're just going To add another block we're going to Choose a column so choose this column And then we're going to do a 50 50 Column And then within this column right here So you can click on different columns to Add different things to these columns But for this column right here I'm just Going to click add a block and then I'm Going to choose a heading Just going to choose to add this as a Heading and then to add the text all you

Need to do is Click within the heading Right here and then add the text you Want to add So I've added my text right there and Then to choose the color of that text You can just come over here onto the Right hand side to the settings and then Just click on text and then choose the Color now below this text I just want to Add a button as well so I'm just going To click within this column right here And then choose the block inserter type In button I'm just going to add this Button right here Then I'm going to change the text And then there's plenty of options over Here if you want to change certain Settings for the button I'm just going To leave it as it is I'm just going to close the block Inserter So Below this I just want to Add some links to the category Pages for The products that we have on the site so To do that I'm just going to click the Add block button right here I'm going to Add another container I'm going to scroll down a little bit Now I'm going to use Three columns in this container and then Each one of these I'm just going to add A cover block so just search for cover In the search box and then add that in And there's an option to upload or Choose an image from your media library

Or use a block color I'm going to choose An image from media library because I Already have some images ready for this Purpose so the categories I'm going to Add to this section of the home page are Smartphone category Smartwatch category And a headphone category so I'm going to Use this image right here for my Smartphone category Then in here you can write the title but I want this to link to the category page So all you need to do is come up this Settings bar right here and just click On the link tab right there and then you Can search for the page you're looking For so I'm currently looking for the Smartphone category showing you products There and then further on down there's Your product category page I'm just Going to click on that and that's added Smartphones to that cover To change the color of the text as it's A link I'll change the link Change that to White It stands out a bit more and then you Can add the other categories in here Which I'm going to do So now I've added some links to my Categories underneath my hero section And to make it look a little bit more Cleaner just going to click on the Container right here and then come to The Container settings if you go to the Style settings and then click onto

Spacing you can change all the spacing For the columns that you have right here But you can also change what we call the Padding and that is the space around the Container so what I'm going to do is Just click this little icon right here So it's not linked and now I'm going to Put 100 In the top and 100 in the bottom And now that gives it a bit more space And it's a bit further away from this Image so the next thing I'm going to add Is I'm going to add a featured product Section underneath this to display some Of the products we want to really Showcase on the website so to do that I'm just going to click the little add Block button right here and then I'm Going to add in a block called products By tag I'm going to click the products By tag right here And what this is telling us right now is That this block displays products with Selecting tags but we don't currently Have any products that are tagged at the Moment so all we need to do is Click Update right here to save the changes to This page then we're going to click the Little WordPress icon right here to head Back to the dashboard and then we're Going to come down to products right Here and then we're going to hover over That and click on tags now just like how We added categories to the website we're

Just going to add a tag here I'm just Going to call that featured Going to give it the same Slug and then I'm just going to click add new tag so Now we have a featured tag right there If we head back to our products so we Can click products here or all products Now we can see all the products we have On the site right now and what I'm going To do is I'm going to add tags to three Of these products so I'm going to choose This Smartphone right here I'm just Going to click on the quick edit and That brings us up a lot of information That can be edited really quickly from This screen which is fantastic So we've got everything from the price The shipping to the tags that we can add To also the product category so if we Want to change things quickly we can do That from this page so I'm just going to Add the featured tag I'm going to copy That And then click update right here Now we can see that product has a Featured tag and I'm just going to do it Two more products So now we have those products with a Featured tag I'm going to go back to Editing our home page so we can click on Pages right here and then we're going to Come down to home page and just click Edit then we're going to scroll down to The section that we just added and we

Can see it now has recognized that we've Got the featured tags we're going to Select that featured tag and we're going To click done so now that's displaying The products that we've tagged with Featured so what I'm going to just do to This is I'm going to add it to a Container so I'm just going to add a Container down here I'm just going to Choose a single container and then I'm Just going to click on this block right Here and then I'm just going to drag it In to that container so now as you can See we can get a few more options if you Put things into container but we can Click on the container we can change and Style this as we want I click on the Actual products by tag block there are a Few options here that we can look at we Can change tags that we display in this Block You can also change the layout you can Also display certain content from the Actual products so whether we want the Add to cart button to display or not we Can choose to add that we can also order By and also filter by stock status so if Things are out of stock we don't want to Show them in this feature product Section we can turn that off and also The products that are on back although We can turn that off as well and another Thing that we can do inside this Container is if we just click on the

Container and click on the Block Inserter up here we can add a heading we Add that heading in just type in Featured so if you want this inside the Container you just have to drag it up Into the container and that will put it Into the Container right there you can Also reorder it by clicking these up and Down buttons right here and it's got a H2 tag as well so that's good another Thing that we can add to this home page As well is an offer for a specific Product so to do that all we need to do Is add the block we're going to add a Container I'm going to choose a single container And then we're going to add a block to That called featured product so here's a Feature product block right there I'm Just going to add that And then we can search for a product to Display or we can pick it from products That we can see down here I might want To add a smartphone to this so I'm just Going to click on that and then done so Now we've got the product selected we Can come to the settings on the side Right here and we can choose to show the Description and show the price I Currently do have a description on this Product but if we did it would be here As well Then we can choose media settings so we Can make the image fit to the actual

Size of the container If we scroll down a little bit You could choose having an overlay on This image And then we can choose to change the Text color as well Just going to close this Our Dimensions here we can add some Padding to Also add a border to it so if you want Rounded edges to your Image you can do that by adding a radius To the border and that gives you a Rounded edges if you're happy with that You just click update So now we've added our featured product In we're going to add a section to view The latest blog posts that we have on The site so we're going to add another Block down here so to do that all we're Going to do is click on this add block Section it's going to add another Container And then within this container we're Going to search for posts I'm going to Choose post grid right here and just add That as you can see that's dragged in Our current blog posts from here we can Look on the right hand side and we can Choose the different settings that we Want for our post so we can choose the Post types and you choose by category And we can also exclude posts and we can Choose the amount of posts per page so

At the moment I want to display just Three posts I'll scroll down a bit we Can order by date or title or random I'm Going to order by date because this is Going to be the latest posts the order Can be descending number of columns is Three whether we have them all equal Height and then if we scroll down a Little bit more we come to the image Section We can choose to not show featured image And we can choose how we want to display Those images I'm going to choose Woocommerce thumbnail that makes it a Bit more of a square image close out we Can look at the content and we can show The title from the blog post and also Show the HTML tag we can choose to show Authors the dates the number of comments And we can also choose whether we want To read more Link at the bottom which Heads to the blog post itself So I'm quite happy with how that looks So I'm just going to click update on my Page to save those changes and finally The last thing I'm going to do on this Page is I'm going to add a send us a Message section at the bottom of the Page so to do that all I need to do is Click on this ad block button right here Add another container and then within This container I'm going to add Two columns so I've got columns right Here so I'll just click on that and with

This container I am going to edit it so That it shows a color but click on Background right here for the color I'm Just going to give it a gradient color And with gradient colors you can choose The two different colors by clicking on These so I'm just going to click on this One and I'm going to choose a darker Color over here and then a Lighter color there Change the angle and then I will use the Container height to 600. Scroll down and then within this column Right here I'm just going to add an Image So just type in the image select this Image I'm going to choose an image from The media library and this is the image That I've selected for this that's going To display that image right there and With this image you can change any of The settings right here And then within this column right here I'm going to add a contact form but Before I do that we're just going to Create the contact form and then we'll Add it to the page so to do that I'm Just going to click update on this page To save the changes then I'm going to Head back to the WordPress dashboard and Then I'm going to head to WP forms right Here hover over that and then click on Add new so WP forms is a fantastic form Builder for WordPress and the great

Thing about WP forms is even if you're a Beginner to WordPress you can create a Contact form in no time at all and that Is by using a template so all we need to Do is give our former name I'm going to call my phone contact us And then in the templates right here you Can see some simple contact form Template you can view a demo of it or You could use a template I'm just going To click on use the template and what That's done is is created a contact form For us so really quickly just to go over What we see right here on the left hand Side is what we called builds or form so We can drag any of these items into Place on this form and we can add any Field we want to deform if we actually Move our Mouse over the form itself we Can see it's broken up into sections and These are each one of the fields that Are currently on the form if you click On a specific field you'll then get the Options for that field on the left hand Side so if you want to change the format Of the field to a more simple contact Form field we can do that and then on The email field you can mark it as Required or not required and then with The comments and message you can also Mark that as required as well so if you Wanted to add another field in here Which was a single line text maybe order Number you could drag that into place

And then you could change the label to Order number and then someone could Write their order number in there if They are inquiring about a specific Order I'm just going to remove that from The contact form so I'm happy with how That looks there are other settings you Can change right here so you can change Your form name And also give the former description if You want to add description I'm going to Change the submit button to something Else you can do that and you can also Add some spam protection for your form And also change the notifications and Confirmations that people see when they Send a message to you I'm happy with how Everything is set up with this template So I'm just going to click on Save right Here to save this form and then once You've saved your form you can just Click the little X right here to close The form Builder and as you can see We've got this contact us form that We've just created so what I'm going to Do is go head back to our home page Edit that we scroll down to the bottom We just add to the block if we just Search for WP forms and just click on That And we can select the form we want so we Can choose our contact us form and then That added the contact form into that Block right there we can click update to

Save those changes and what I'll just do In this block right here is I'll just Add in a heading I'll just change that to H4 so it's a Bit smaller and I'll change the text Color to white And click on update save all those Changes and then to preview the page all You need to do is click the preview Button right here and then click preview In a new tab that's going to open a new Tab and show you the page so if we take A quick look at what we've created for Our home page we've put a hero Banner in With a bit of text and a button which we Can link up to any of the pages on our Site We've also added in some links to our Category pages so if we click any of These links they'll go to a category Page then we've got some feature Products so products that have been Tagged with the featured tags so that They show up in this area on the home Page as well We've also got a featured product Block put in here which could be for a Product that's currently on offer or Something that we really really want to Sell on the site and then below that We've got a block to display three of The latest blog posts on our site as Well with links to them and then at the Bottom here we've got a simple contact

Form For people to be able to contact us on The website and this form can also be Placed on the contact us page as well so If we just take a look at the rest of The site click on store and we can see All of the items that are currently in Our store from here and on the blog page As well we click on that we can see the Blog articles that have been added to The site there And then if we add an item to our Shopping cart let's click the add to Cart button there see it's been added to Our shopping cart click on this it Slides out and we set all this up then We can click on view cart right here That's going to take us to our cart page Which woocommerce out for us This is customizable as well and then we Can click on our proceed to checkout Button right here to go to the checkout And here we are on the checkout page Which we set up in woocommerce and People can enter all their details A shipping information and then they can Check their order and select their Payment method and then click place Order and then we would receive the Order at our end and could fulfill that Order so that's it for our video on Starting an online store with WordPress I hope you've enjoyed it and you now Have a website that you can grow and is

Super successful in the future on that Note we have a ton of amazing videos to Help you develop and grow your WordPress Site so make sure you give the channel Subscribe and check those videos out If this video helped you out or if You've got any questions let us know in The comments below thanks for watching

You might like

How to Create WordPress Forms with a Payment Option

How do SEO competitor analysis for FREE!

Steal Your Competition’s SEO and Rank Higher

The 5 of the best Security Plugins for Your Website

How to Connect Your Website with Google Search Console Video (2023 Edition)

Should You Update to the LATEST Version of WordPress