Learn to Use WooCommerce and WordPress to Create Your E-Commerce Website. In this post, we’ll show you (bit by bit) how to set up an online store utilizing WooCommerce and WordPress where you can sell both physical and digital products/services.
What is WooCommerce:
WooCommerce is a free plugin that is basic and direct. In a sentence, WooCommerce is the most ideal approach to transform your WordPress website into a completely utilitarian web based business store.
- It’s free and open-source – much the same as WordPress.
- It’s the most well known internet business plugin for WordPress out there.
- You can set it up and arrange it without help from anyone else.
- The arrangement is quick. As a rule, it’s simply an issue of 60 minutes.
- It works with any design/theme you at present have on your WordPress webpage – you don’t have to discard your present website design.
We could proceed with the list above, yet all things considered, let us simply say that WooCommerce basically gives you all you might require for building an excellent online business store with WordPress.
What Can You Sell With WordPress + WooCommerce?
- Digital products (for example programming, downloads, digital books),
- Actual products,
- Appointments (for example for arrangements, or whatever else that can be reserved),
- Others’ products – as an offshoot,
- Customizations (for example extra customizations on top of your item postings), and that’s just the beginning.
All in all – you can bring in cash with your website.
We would even chance saying that WooCommerce permits you to sell whatever can have a sticker price allocated to it. In addition, anybody can utilize it (on the off chance that you’ve just figured out how to get a WordPress site dispatched, you will likewise have the option to deal with WooCommerce).
How to Build an Online Store With WordPress and WooCommerce
Attention: The objective of this piece of the guide is to show you the least complex strategy for building a utilitarian internet business store on WordPress with the goal that you can get your store online as quickly as time permits. That is the reason we will zero in on the fundamental things and avoid the further developed perspectives.
STEP 1. First, Get a Domain Name and Web Hosting
To begin an online store or some other kind of website, you will require two things:
- Domain name is your store’s unique location on the web. Something like YOURSTORE.com
- Web Hosting is essentially a distant computer that stores your website and afterward serves it to whoever needs to visit it.
There are many diverse hosting/domain suppliers, we typically get both from Bluehost.com. They offer reasonable web hosting (counting a free domain name for a year) and dependability. They’re likewise one of only a handful few recommended (official) hosting suppliers by WordPress.org. Cost? Beginning from $2.75/mo.
To start, you simply need to go to Bluehost.com, and click the “begin” button.
This will take you to a page where you can choose a hosting plan for your store. You can begin with the least expensive alternative, marked “basic”:
The next step is all about picking a domain name for your new online store.
This requires some conceptualizing. All in all, you need your domain name to be one of a kind, simple to recall, and snappy. On the off chance that you as of now have a business substance set up for your store, you ought to maybe go with that as your domain name.
When you settle on your domain decision, you can conclude the arrangement and pay the underlying hosting charge.
Fantastic! You’ve quite recently got yourself a domain name and a hosting plan.
STEP 2. Install WordPress (FREE)
The subsequent stage authoritatively denotes the beginning of your experience with WordPress – you will install WordPress on your hosting account.
This may sound troublesome, yet it’s really not. You should simply to go to your Bluehost client board (Bluehost will send you a connection in the confirmation email) – generally accessible at my.bluehost.com.
Once there, look down until you see a symbol marked “Install WordPress”:
Click on it and follow the on-screen instructions. You will go through the entire cycle stride by-venture, there’s nothing to stress over!
Now, you ought to have a clear WordPress website installed.
- You can see it by going to your principle domain name (e.g., YOURSTORE.com)
- You can sign in to the admin board by going to YOURSTORE.com/wp-admin
Presently it’s an ideal opportunity to transform that clear WordPress website into a completely utilitarian web based business store utilizing the fantastic WooCommerce plugin.
STEP 3. Install WooCommerce Plugin (FREE)
Like with all WordPress plugins, the greatness starts by exploring the navigation of your WordPress Dashboard/Plugins/Add New. Once there, type “WooCommerce” in the inquiry field. You’ll consider WooCommerce to be the first search result:
Simply click the “Install Now” button close to the plugin.
Following a few seconds, the content on the button will change to “Activate.” Go ahead and click it
At this stage, you’ll see WooCommerce’s on-screen launch/setup wizard. This thing makes the interaction super simple and takes you by the hand through everything. To begin, click “Let’s Go!”
Create the Essential Store Pages with WooCommerce
Online stores are a specific sort of website, and they need some specific pages to work appropriately. The initial phase in the WooCommerce wizard is tied in with making these pages for you:
- “Shop” – this is the place where your products will be shown.
- “Cart” – this is the shopping basket where your clients can change their request prior to continuing to checkout.
- “Checkout” – this is the place where the clients pick the shipping/delivery technique and pay for whatever they’ve purchased.
- “My Account” – a sort of a profile page for enrolled clients (they will have the option to see their previous orders there and oversee different subtleties).
All you require to do at this phase of the WooCommerce wizard is click the “continue” button. WooCommerce will set up those pages for you.
Set Up Locale
The locale is a genuinely vital piece of your store arrangement. Those couple of parameters characterize your business beginning, currency, and favored units:
Once you’re done, click “Continue”.
Understand Sales Tax
Tax is by a wide margin the most important piece of running a web based business store, but at the same time it’s something we can’t ignore, unfortunately.
You will be satisfied to see that WooCommerce causes you with this part as well.
To start with, you can choose in case you will dispatch actual products or not. On the off chance that you check the case, WooCommerce will pre-set the excess shipping-related subtleties in the settings.
Then, tax! WooCommerce has an extremely perfect tax module, the best thing about it is that it encourages you sort out the tax rates dependent on your store area (you’ve set it in the past advance).
In case you will charge deals tax (much of the time you are), simply check the primary tax box. When you do this, another arrangement of boxes will show up and educate you regarding what will occur straightaway.
Attention: Even however WooCommerce will pre-fill the tax settings for you, you actually need to twofold check with your nearby specialists what the genuine current taxation rules are, particularly in case you’re not in the US. To become familiar with WooCommerce’s method of taking care of deals taxes, read this. You can make a huge difference later don’t as well, stress in case you don’t know over the standards at this moment.
Pick a Payment Method (PayPal is Recommended)
Being able to accept online payments is at the core of any e-commerce store, WooCommerce really offers a lot in terms of the available solutions.
Here’s what you can choose from:
Two of the most popular payment options are at the very top – PayPal and Stripe – it’s enthusiastically recommended that you integrate your site with both. Simply click on their comparing checkboxes.
You can likewise choose other payment techniques that appear to bode well. There will be considerably more choices accessible later on in your WooCommerce settings board.
Note: In request to make online payments work, you need to join with either PayPal or Stripe independently. The settings in WooCommerce are just for incorporating your current PayPal and Stripe accounts with your new internet business website.
Once more, click “Continue” when done.
The following stage is only an confirmation screen that everything worked out positively. At this stage, your essential site arrangement is done – you’ve quite recently fabricated a clear internet business store with WooCommerce!
The subsequent stage is adding products.
STEP 4. Add Your Products or Services
To have the option to call your store operational, you need a few products in the database (or services, or downloads, or whatever it is that you need to sell).
To begin working with the products, go to your dashboard, at that point Products/Add Product:
What you’re going to see is a classic WordPress content editing screen:
Steps to Follow
1. Product name.
2. The fundamental product description. This enormous field permits you to enter as much data about the product as you wish. Since this is WordPress, you can put straightforward content there as well as pictures, sections, headings, even recordings, and other media. Essentially, whatever you see fit!
3. The central product information area. This one is the place where you set the sort of product that you’re adding, and whether it’s a physical, a downloadable or a virtual product (services are viewed as virtual products as well). As a component of this central area, you likewise get tabs for different boundaries of the product:
Basic Steps Under WooCommerce Website:
- General. This is the place where you will set the estimating and taxes.
- Inventory. WooCommerce permits you to oversee stock levels.
- Shipping. Set the weight, measurements, and the expense of shipping.
- Connected Products. Extraordinary for setting upsells, cross-sales, and so forth (Think, like “Customers who purchased this additionally purchased that.”)
- Attributes. Set custom product attributes. E.g., in case you’re selling shirts, you can set elective tones here.
- Advanced. Extra settings. Not fundamental.
4. Short Description. This is the content that gets shown on the product page under the name. Works best as a short synopsis of what the product is.
5. Product Categories. Gathering comparable products together. E.g., “caps.” It works much the same as the standard WordPress classes.
6. Product Tags. An extra method to assist you with getting sorted out your database of products. It works much the same as the standard WordPress labels.
7. Product Image. The actual main product picture.
8. Product Gallery. Extra product pictures to feature their applications.
The first occasion when you visit this panel, WooCommerce will show some helpful tooltips to clarify what’s the reason for each field:
Whenever you’re finished setting the entirety of the abovementioned, click on the huge Publish button – your first product has recently been added!
Subsequent to adding a small bunch of merchandise to your database, the products area in the dashboard should look something like this:
STEP 5. Choose a Theme for Your Online Store (FREE)
There’s generally excellent reasons behind why we initially covered how to add products to your store, prior to examining the visual appearance of the whole thing.
Quite frankly, with no products in the database, you wouldn’t have the option to see the individual pages of the store in any delegate structure. You wouldn’t have the option to ensure that everything looks right.
Since you have the greater part of your products added, we can ensure that things are all together from an absolutely visual standpoint.
WooCommerce vs Your Current Theme
As a matter of course, WooCommerce works with any WordPress theme. This is extraordinary news particularly in the event that you’ve just picked your design and you need to stay with it.
Then again, you can go with uncommon WooCommerce-streamlined themes. Those themes come with pre-set styles that make all WooCommerce components look extraordinary.
Here’s our recommendation:
Then again, you can visit the internet business area at ThemeForest – the greatest catalog of premium WordPress themes on the web.
If you’ve chosen to stay with your present theme or have gone for something new and WooCommerce-upgraded, what you need to do next is ensure that the individual pages of the store look great. How about we do that at this point:
STEP 6. Make Your E-Commerce Store Design User Friendly
How about we examine a small bunch of significant perspectives before we get into the low down.
Basically – what makes an internet business store design great (read: profitable)? Here are the most pivotal boundaries:
- The design should be clear and not confounding at all. A guest who’s confounded won’t accepting anything.
- The center content block needs to catch the guest’s eye just after they come to the site. That center block is the place where the products will be shown.
- Customizable sidebars. You should have the option to choose the number of sidebars you need and furthermore handicap the sidebar by and large for certain pages (more on that later).
- Responsive and mobile-improved. Research demonstrates  that around 80% of individuals on the web own a smartphone. As per another research , 61% of your mobile guests will leave quickly and go to your competitors if they have a baffling mobile perusing experience. At the end of the day – ensuring that your website is advanced for mobile is critical.
- Great navigation structure. You need clear menus that are not difficult to get a handle on – so your guests can discover the page they’re searching for.
Having the above as a main priority, this is what you can do with the individual pages of the store:
Your Shop Page
This is the place where the main posting of your products is found. If you’ve experienced the WooCommerce setup wizard, this page can be found at YOURDOMAIN.com/shop
This is a standard WordPress page – you can alter it through WordPress dashboard/Pages.
The things that merit doing:
- Add some duplicate that will urge your guests to shop with you.
- Choose if you need to have the sidebar on the page. This is done through your theme’s own page templates. For example, Storefront permits me to go full-width, which we will do:
The main trait of the Shop page is that directly found under the standard content, it includes a custom part where it shows your product listings. This is what it resembles on the Storefront theme:
As you can observe, pleasant product pictures are the key, it’s the principal thing that you ought to get right! All in all – you ought to presumably work on your product pictures more than on whatever else.
WooCommerce likewise empowers you to show your products in elective manners on this page. At the point when you go to the WordPress dashboard/WooCommerce/Settings/Products and afterward the Display segment:
… you can pick whether you need to show singular products or product categories on the Shop page. Select whatever bodes well for you, at that point save settings
Individual Product Pages
To see those, click on any product listing from the Shop page.
If you’re using a quality theme, you shouldn’t encounter any difficulties on this specific page. Fundamentally, the lone thing you can do is change the measure of text that you’re utilizing for singular product descriptions, to ensure that everything fits visually and that there are no clear spots that could confound the purchaser.
Here’s our example with the Storefront theme (with no extra customization):
Another vital page that can be changed through Dashboard/Pages.
The one thing we would recommend is to go for the full-width layout. You would prefer not to give the purchaser an excessive number of choices on this page, aside from continuing to checkout.
Checkout is maybe the main page of all. It’s the place where your purchasers will settle their orders and make the payments.
We don’t really urge you to do any changes to that page separated from one:
The Checkout page totally should be full-width. The solitary acceptable way out of the page for the purchaser ought to be to finish their request, and not get diverted by the things accessible in the sidebar.
You can do this by means of Dashboard/Pages (simply rehash the cycle you proceeded with the Shop page).
Apart from that, the default look of the Checkout page is extraordinary:
At this stage, you are basically done with adjusting your store design, now let’s look into the possibilities to extend the store’s functionality.
STEP 7. Extend WooCommerce
Something more that makes WooCommerce a particularly great internet business arrangement is that there are tens or even many extensions and plugins available.
Let’s list some of the most useful ones:
How about we start with the extensions – the authority additional items that have been endorsed by the WooCommerce group.
To perceive what’s available, you can go to this page.
That inventory is really great and immense. We don’t need you to feel threatened by it. You surely needn’t bother with those extensions. Treat that rundown as a smorgasbord – pick whatever appears to be cool.
Some of the more worthy mentions:
- Payment gateways. These extensions permit you to acknowledge greater payment techniques on top of the standard PayPal. By and large, the more techniques for payment you can bear to acknowledge (those gateways are regularly paid), the better.
- Shipping extensions. These will be helpful if you need to naturally integrate your store with the authority shipping rates from companies, for example, UPS or FedEx.
- Accounting extensions. Integrate your WooCommerce store with your preferred Accounting instrument.
- WooCommerce Bookings. Permit clients to book arrangements for services without leaving your site.
- WooCommerce Subscriptions. Allow clients to buy in to your products or services and pay a week after week, month to month or yearly charge.
- EU VAT Number. For those working inside the EU.
- TaxJar. Put your sales tax on autopilot.
On the other hand, if you would prefer not to spend any cash on new extensions, you can peruse around in the free class. There’s a sizable amount of stuff there to keep you involved.
Plugins That Supercharge Your E-Commerce Store
Setting the extensions aside, you can likewise utilize other WordPress plugins to additionally supercharge your store. This is what you ought to get:
- Yoast SEO. Improve the SEO of your entire website.
- Yoast WooCommerce SEO plugin. Improve the SEO of your products and different territories of your internet business store.
- WooCommerce Multilingual. Run a completely multilingual WooCommerce site.
- Contact Form 7. Let your site guests get in touch with you straightforwardly.
- UpdraftPlus. Back up the entirety of your site content, including your products and other store information.
- Social Share Buttons by GetSocial. Allow your purchasers to impart your products to their loved ones through online media.
- MonsterInsights. Integrate your site with Google Analytics.
- iThemes Security. Security presets for your website.
- W3 Total Cache. Accelerate your website through caching.
Creating an Online Store in a Nutshell
As you can observe, the level of difficulty with regards to making your own web based business store with WordPress isn’t high, however it will in any case take you some time to traverse the entirety of the means above – presumably an evening or two.
That is as yet amazing considering that just, say, five years back you would have to employ a designer and pay them north of $5,000 to get something comparative made. Presently you can do everything yourself!
Anyway, to assist you with getting the tasks needed, here’s a cut-out-and-keep checklist:
Before You Begin
- Get a domain name for your store, sign up for web hosting and get a working WordPress installed.
- Make sure that your new blank WordPress site works properly.
- Install and activate the main WooCommerce plugin.
- Go through the WooCommerce setup wizard, paying close attention to:
- Getting the four mainly required pages created (Shop, Cart, Checkout and My Account).
- Setting up the store locale.
- Setting up sales tax and shipping.
- Choosing initial payment methods.
- Add most (or all) of your products or product categories to the store.
- Select the right WordPress theme for your e-commerce store. Go either with your existing theme or browse through other theme possibilities for your online store. Review the rules of e-commerce store design when doing so.
- Customize your Shop page.
- Customize individual product pages.
- Adjust the Cart page.
- Customize the Checkout page
- Install the payment gateways that you want to use in your online store.
- Consider some of the shipping extensions for shipping and delivery.
- Consider an accounting extension.
- Browse and choose through other extensions and the free category.
How about installing all of the plugins that will supercharge your e-commerce store:
- Yoast SEO
- Yoast WooCommerce SEO
- WooCommerce Multilingual
- Contact Form 7
- Social Share Buttons by GetSocial
- iThemes Security
- W3 Total Cache.
This article is a WordPress eCommerce how-to manage that has strolled you through each progression of building your own online store on probably the greatest stage on the Web. You’ve figured out how to pick your hosting provider, choose what module to utilize, install your module of decision, add your absolute first product, and set up a payment gateway for your site.
Before the finish of this article, you ought to have a completely useful, albeit barebones, eCommerce site that you can proceed to extend and improve as your necessities require.