Create an eCommerce Website with WordPress

I’m all approximately helping you build the excellent and maximum professional website possible.

I gained’t train you how to construct a cheap crappy internet site (like all of us else)
I gained’t just maintain making tutorials after tutorial and no longer educate you a way to build a commercial enterprise
i will only endorse to you what I recognize will work
This educational will teach you the way to create an online keep (eCommerce website) and might be using the pinnacle selling ecommerce theme to be had (Flatsome)

I’m all about saving money and helping you create a domain that makes money from Day 1. you can pay a person heaps of dollars to create you the equal website online, or you could comply with this educational.

I say the above in all seriousness. a person just emailed me saying they used certainly one of my free tutorials and charged a person $1,200 to construct the website online and they haven't any technical background. sad however it occurs. Don’t get taken advantage of!

Pre-requisites

• None without a doubt.
• simply an hour or so and the potential to observe the academic

What You Don't Need

• You do no longer need to have a technical heritage
• You do not need to know the way to code or program

What You Will Need

• a site (web deal with in your ecommerce website)
• web hosting service (the engine that powers your on line store)
• The Flatsome subject by UX issues

Step 1. Register a site and get website hosting provider with hostgator

a website is your net cope with (what you kind in to get for your website). this is a should.

You need hosting if you want to run your website and store all of the records (content, photographs, video). each internet site wishes website hosting, so make certain you get hosting in any other case we will’t build out your website. this is a have to.

visit Hostgator -> click on Get began Now -> select a Plan -> click on sign on now (doesn’t remember which)

• I recommend Hostgator because it’s cheap and smooth plus extraordinary customer service – I clearly like them! (but you could pick out any carrier you need!)
• reasonably-priced
• suitable customer service
• clean to put in the entirety you need to make your internet site

Step 2. Go to Your Email

you will receive a hostgator e-mail on your inbox with all your login and account info

Use that facts to do Step 3

Step 3. Log Into Website cPanel

• Pull up your new account e mail from Hostgator
• click at the link that asserts “Your control Panel”
• Login with the username and password out of your e mail

Now the laugh starts!

Step 4. Install WordPress

Now we need to install the platform we’re going to apply to make it. The platform is referred to as WordPress – it’s a content material management machine and awesome popular with a massive community of users.

1. Now that’re you’re logged in to your cpanel
2. Scroll down to software/offerings segment of the principle page
3. click on at the icon that asserts “QuickInstall”
4. click on WordPress at the left side menu
5. click on preserve
6. input an admin email (which you get email from), weblog identify (you can trade this later), person name and different details
7. click on “Install now!”

sweet! Now we have wordpress installed! you could visit your domain cope with and see that we've simply uploaded a website on your website online (we’ll fix this complete thing and make it quite – don’t fear!)

Step 5. Log Into WordPress

you would possibly ought to wait five-15 minutes before you may click on to log into your new website. Take a wreck in case you want.

There are  approaches to log onto your web page

1. you could click on at the link supplied at the hostgator web page after the fast install and use the username and password
2. you could visit your email and open the brand new e-mail you get with details about logging into your site (same data as above)

To personalize and add content material in your site, you will usually log into the website online with the subsequent deal with: www.YourSite.com/wp-admin

So pass beforehand and go online!

Step 6. Get the Flatsome Theme

I don’t like making you spend money but for this tutorial its important. all of the unfastened themes are unpleasant and unprofessional and it would take me too lengthy to recreate some thing from scratch for you.

1. Follow this hyperlink to ThemeForest to the subject matter homepage (affiliate hyperlink)
2. click on purchase Now (that is the simplest element we need to buy)
3. Fill out your account facts
4. comply with the commands to down load the ZIP report that carries your new top rate theme

you still turn out to be saving loads if no longer heaps of dollars through buying this subject and customizing it yourself. It’s a great investment.

Step 7. Install Flatsome Theme for eCommerce Site

Now it’s time to install the the subject that you just purchased.

1. visit WordPress website web page (www.yoursite.com/wp-admin) – that is your Dashboard
2. on the left facet, find the appearance link – hover over it and click “issues”
3. close to the pinnacle you’ll see a button that says “add New” – click on that
4. Then click on the button that asserts “upload subject”
5. click the button that asserts “pick record” proper inside the center
6. go to your download folder (or anywhere the Flatsome subject matter is saved) and pick that document and click add and “install Now”
7. You’ll be added to another web page – click on “activate”

Now you should be lower back at the Dashboard

Step 8. Install Plugins

Now we want to install the first rate famous ecommerce plugin that supports almost all of the on-line shops personal the net.

The Flatsome subject has a package deal of pre-packaged themes so we can install them unexpectedly.

• WooCommerce – WordPress eCommerce plugin (Required)
• Ninja paperwork – Used for contact shape and publication signup (non-compulsory)
• Regenerate Thumbnails – Use to resize product snap shots to recommended sizes. (non-compulsory)
• Taxonomy Metadata – Used to create custom fields in settings for Product classes. (non-compulsory)
• WooSidebars – Create unlimited sidebars for pages and footers (non-obligatory)
• YITH WooCommerce Ajax seek – adds live seek functionality to go looking container(elective)
• YITH WooCommerce Wishlist – provides want list functionality to class grid and product pages(optional)

1. visit your dashboard > plugins
2. check the box above all of your plugins so it selects everything
3. in which it says “Bulk movements” click on that drop down and click installation
4. click practice

Now take a look at the field above all the plugins once more and this time click “activate” in the drop down menu and click practice

Step 9. Install WooCommerce

Now we just need to click a button so we've our Default pages like save, Cart, and Checkout

• go to your Dashboard
• on the left hand site hover over appearance > click on on issues
• right on this page you will see a banner that announces “install WooCommerce Pages” – click on on that
• Now visit Pages at the left hand facet and click on “All Pages”
• just to peer a group of default pages are up (if you see pages like Cart, My Account, Checkout…you’re desirable to move!)

Change Image Size

This topic uses photograph sizes aside from WooCommerce regular sizes. go to  WooCommerce > Settings > products >display and exchange sizes to those:

Note: You don't have to use the same heights. however its advocated to use the same widths

Step 10. Save And Upload Images

at this time, you'll want to apply your personal images (for the reason that our instructional pictures really don’t do you any proper!)

After photo sizes are set, you’ll need to resize all pictures. we are able to try this automatically with the plugin: “Regenerate Thumbnails”.

go to tools > Regen. Thumbnails

click on Regenerate All Thumbnails

You’ll need to install “Regenerate Thumbnails” if you cant locate it under gear.

Tip: You ought to in all likelihood regenerate your thumbnails when you add them for your pages/put up so this step might not be necessary till you upload a few merchandise and submit some weblog posts.

Step 11. Choose Layout Setting

1. go to DASHBOARD > look > topic options
2. we can undergo all the important alternatives proper now

global Settings

• if you need to expose a Message in preference to your website while you build it -> select protection Mode

Logo and Icons (we can do that in a separate section)

Layout

1. choose the format you need within the first phase (we are the use of the first format – left with no borders)
2. make sure you scroll down and click save

Header 

1. No changes necessary
2. you can upload some textual content to “pinnacle Bar right” in case you need
3. We may do a little additional paintings here in Step 25

Footer

• you can alter the textual content within the “Footer Button Left content material” vicinity
• we will do some extra work right here in Step 25

Fonts

• choose what type of font you need on your website. we will be the use of LAGO

fashion and hues

1. pass in advance and pick out what colors you need to your internet site here. 
2. watching the video will assist you recognize the variations between the primary and secondary coloration better

Product page 

class page

Cart and Checkout

1. No adjustments important

Catalog Mode

1. No changes wished

blog

1. We’ll paintings on this segment in Step #

Featured items

1. No adjustments wished

Backup and Import

• No modifications wanted

Step 12. Now customize according to your need

create custom pages, logos, images, form, navbar blocks etc for your website and enjoy.