You can integrate online shopping features by using one of the most popular shop WordPress plugin “Woocommerce”. In order to use it, you can download Woocommerce plugin for free from Woothemes.. Then follow below steps to install Woocommerce.

  1. Log into your WordPress Admin area.
  2. Look down the left hand column for “Plugins” and then click on the word “Plugins”.
  3. Just to the right of the title “(Manage) Plugins” in the image above, you can see a button marked “Add New”, click this button.
  4. The image above shows the option to upload the plugin from your own PC, Select the you had previously downloaded from Woothemes. Install the zip and click on “Activate Plugin”.

Then please find full documentation of “Woocommerce” plugin here

Woocommerce Page Setup

You should see a nice magenta banner “Welcome to WooCommerce – You’re almost ready to start selling :)”. WooCommerce needs some pages to be created for it to function, it can do this automatically for you by simply clicking “Install WooCommerce Pages”. (You can change these page names later if you want to).

Woocommerce General Settings

The first thing we need to do is setup where we are and our currency. These are simple dropdowns and you also get a third dropdown to allow you to limit which countries you are willing to ship to.

Next we get some Checkout and account options. Here you can configure things like enabling guest checkouts (so they don’t need to register an account with your site), you can force SSL on checkout pages (particularly useful if your payment gateway requires this), if you want to enable coupons (more on this later). You can also set some account functions like allow user registration without an order, whether to use email addresses for usernames and if you want to hide the WordPress Admin from customers.

You also get a couple of UI options including quite a nice Lightbox effect which I usually enable. Finally on this page we see our digital downloads options. With WooCommerce you can easily sell virtual and downloadable products these options allow you to define how they should be handled and how to grant access. The options are pretty self explanatory as with most of the WooCommerce setup.

Woocommerce Recommended Image Size

In Woocommerce settings. You can change product’s images size. From your WordPress admin dashboard. Go to Woocommerce > Settings > Products > Product Image Sizes. Below are recommended image size. After changing these settings you may need to regenerate your thumbnails.

Screen Shot 2558-06-15 at 4.51.17 PM

Alright now you should have Woocommerce basic settings and ready to be used. However you can also configure other advacned settings ex. tax, shipping etc too. These are some more in-dept tutorials about how you can configure that options.

Shop Page Background Image

Screen Shot 2558-06-15 at 4.52.10 PM

Once you setup Woocommerce shop and other pages. You can customise header background image of shop pages. Go to edit shop page, upload background image you want to display via “set featured image” option at the bottom right of edit shop page.

Customise Shop Page Layout

Screen Shot 2558-05-18 at 4.14.28 PM

Open Appearance > Customize > Shop and you can customise shope page layout from fullwidth or with sidebar. Also can change number of products display per page option.