Transform Your WordPress Site Into Straight-out eCommerce Store

279 Views

Today, e-commerce has become the best way to earn business. What do you need to know to start a successful online store on WordPress? The simple answer is, WooCommerce …! You will need to know about WooCommerce as well as one of our great WooCommerce themes which provides optimum design and settings for your blog.

So in this article, we will share a step-by-step guide to transform your WordPress Into a Straight-out eCommerce Store and the best WooCommerce themes for you.

What is WooCommerce?

Transform Your WordPress Site Into Straight-out eCommerce Store | Iqonic Design

WooCommerce is a WordPress plugin that helps sell products online. If you want to create an online shopping website like – Flipkart, or Amazon, then you can create it with the help of the WordPress WooCommerce plugin. In this, all the features are available that the product has to be created and shown to the customer online payment, etc.

It helps you sell any type of product easily on a fully functioning website without needing to code a single line from a beautiful home page to a streamlined checkout process you can use plugins and other resources to set up everything quickly and effortlessly.

Features:

To create a product, we get the defining feature of image, content, and price in the WooCommerce plugin. After creating a product from which it is easily displayed on the website. After ordering, all the features of processing the order are found in the WooCommerce plugin. Other features are the order complete feature, managing the stock, and deleting the product.

Most importantly, if we talk about online payment, as you buy a product from an e-commerce website and pay for it online, then all these features are also found in the WordPress WooCommerce plugin. From this, any customer can pay online with their debit card, credit card, Paytm, UPI, Airtel money, etc. Many such options are available with the WooCommerce plugin.

Let us tell you how to use WooCommerce in WordPress…!

Choose Your Domain

Your e-commerce store cannot exist without a unique domain in hosting. The domain is the identity of your website. People can type it into a browser and instantly reach your website and the hosting is where all your website’s information and files are stored. It’s like a computer that sends your website’s information to people looking for it at any time from anywhere in the world.

You can purchase the domain name separately and pay for a different service to host it on its servers, but the cost-effective way is to buy them both together. There are plenty of good hosting services out there like Kinsta, Cloudways, Hostgator, WP Engine, A2 hosting, and Hostinger. But WordPress officially recommends Bluehost Siteground and Dreamhost on its website. You’re free to compare all these options and pick the one that suits you best. But no matter which one you pick the steps will be the same. The service will offer you multiple paid plans like these depending on the price, web space, and other features. Choose the best plan for you.

How to install a WooCommerce plugin on WordPress?

To use WooCommerce, you must first install the WooCommerce Plugin. Installing WooCommerce is a very simple task. But before that, you should check your hosting environment. For that, we recommend:

  • PHP version 7.3 or greater
  • MySQL version 5.6 or greater OR MariaDB version 10.0 or greater
  • WordPress memory limit of 128 MB or greater
  • HTTPS support

For installing WooCommerce on a WordPress website, you have to follow the following steps.

Step 1 — First of all, log in to the admin page.

Step 2 — After login, the dashboard opens. After that, you have to click on the plugins.

Step 3 — After clicking on the plugins, you have to click on Add New.

Step 4 — Now, you have to search for a plugin called WooCommerce and click on Install. After clicking install, wait for a while until it gets installed. Activate after installation.

Step 5 — After Activate you come to know that a form is open in front of you, you have to fill in all the details in the form. Such as address, zip code, currency, your plan. After filling, you have to click on Let’s Go.

Step 6 — After this, you have to choose the payment method in this step you can use Paypal, offline payment, bank transfer, and cash on delivery. Fill in all the details you want and click continue.

Step 7 — After it, a new form will open. This form is used for shipping details. If you want to charge shipping charges from customers, you can enter this form and also make it clear that you can pay any tax on the shipping of the goods. After filling in all the details, click on continue.

Step 8 — You will see the step of recommended extras, in which you will see the continue button. In this step you don’t have to do anything, just click continue. The WooCommerce plugin will be successfully installed.

Step 9 — Go back to the WordPress dashboard for activation, after which you will find a page called Connect with Jetpack. Click skip to this step.

Step 10 — Now you are ready to sell your product on the website. Just click Return on your dashboard.

Step 11 — Check WooCommerce on the WordPress dashboard. See WooCommerce on the left menu, and click on it.

WooCommerce Setting and Options

Choose a Theme

In the Setting option, you will be asked to choose a theme. The theme you choose will determine the starting look and layout of your store/site though you can customize it from there! You can use a free theme included with WordPress or purchase a premium WordPress theme to stand out from the rest.

Two options are given in the left menu. WooCommerce and Products. There are several Widgets including with WooCommerce.

Let’s set up our WooCommerce store from the settings section under WooCommerce.

  • In the general options, you can choose your selling locations. If you’re ready to sell worldwide keep this setting as it is, but if you’re only selling in a specific country like India then you can select sell to specific countries from the drop-down and search for India.
  • Below you can also select which countries we want to ship our products to in a default customer location that will appear during checkout.
  • If you want to enable taxes, tick the option you’ll select the currency specific to our selling location, save changes, and click on the tax tab. Here you can manage your tax options but if you want to remove or add tax classes you’ll have to use this option.
  • After saving changes you’ll use the newly created sections to add your tax rates. Click on cgst 14, insert the row enter the country code and rate percentage information then disable shipping and save changes.
  • Do the same steps for the other tax rates as well with the only difference being the tax rates of 14, 12, and 18. When you’re done you can move to set up your shipping rates.
  • Click on Add shipping zone and name and pick a zone for which the shipping cost will be the same. If you’re shipping to different countries or regions with varying costs of shipping you can add multiple zones. Then click on add shipping method and choose the type of shipping method from the drop-down.
  • let’s go with a flat rate, then click on edit to add the shipping cost in the pop-up. Enter the unit shipping cost and add an asterisk and qty in square brackets to have the shipping cost multiplied based on the number of products. Let’s save the changes.
  • Now move on to the payments tab. Here you’ll choose how your shoppers will be able to make their payments. You can use built-in payments like direct bank transfer, check payments, cash on delivery, and Paypal or you can download third-party payment methods like Paypal checkout, Amazon Pay, and Stripe. All these options are easy to set up. Save all the changes.
  • Now move on to the accounts and privacy tab. Let’s allow shoppers to create an account during checkout. Using this option, if you’re selling to customers from the European Union you’ll also need to enable the account erasure request option.
  • Customize and set up a detailed and compliant privacy policy page. And set personal data retention periods in the emails section. You can manage the emails required to run your store. These emails have the administrator emails as recipients. This means you’ll get email notifications for every new order, canceled order, and failed order.
  • For the emails that have the customer as the recipients, you can see that they’ll get email notifications for orders, on-hold order processing completed orders, new accounts, etc. You can click on the manage button to customize and edit the email. Here you can edit the subject line, email, heading, and the email body. You can also disable the email by unchecking the box.

Now moving on to set up our WooCommerce store from the settings section under the Product Section.

  • In the products section, you can select the page that you want to display as the shop page from a list of automatically created WooCommerce pages.
  • Below you can customize the cart behavior and set a placeholder image for products that don’t have images for physical products.
  • You can set the weight and dimension units to maintain consistency across your store.
  • Finally, you can enable or disable product reviews for your products. Show a verified owner label on customer reviews. Only allow verified owners to leave reviews.
  • Enable star ratings on reviews or mandate star ratings to be part of reviews. The inventory sub-section lets you manage your stock. You can keep this box checked to enable stock management.
  • Here you can choose the period in minutes for which you want to hold stock for unpaid orders. if you enter 120 the product will be held in stock for two hours. If you leave it blank the pending order will be cancelled as soon as the shopper leaves the page. So, you can keep these options enabled if you want to receive notifications for low-stock and out-of-stock products the notification will be sent via email to this recipient.
  • You can also set the amount of products at which you get these notifications with this setting. You’ll get a low-stock notification when there are only two products left and an out-of-stock notification when there are zero products left.
  • Below you can hide the out-of-stock items from your catalog. The final setting controls how stock quantities are displayed on the front end with the first setting shoppers can always see the stock availability with the second one stock quantity is only shown for low stock products. And the final setting completely hides the stock quantity from the shoppers.
  • You can use the final subsection if you’re selling downloadable products like downloadable music, ebooks, or online tickets.
  • Here you can choose the file download method, manage access restriction settings, and add file name settings.
  • After setting up your store you can view and manage your orders under the order section, in the coupons section you can create coupons for shoppers you can generate a coupon code add a description, and have additional options like discount types, coupon amount usage restrictions, and usage limits.
  • The customer’s section lists the details of all our customers while the reports section generates detailed reports with in-depth data and insight.
  • Finally, a robust analytics section lets you put a finger on the pulse of your business with data on revenue orders, product categories, coupons taxes, downloads, and stock. Whether it be physical or downloadable products you can easily add them using this tab.
  • Now, You can either create a product from scratch or import it in bulk. Let me tell you the first option. When you click on it you’ll see the new product page. Here you can add a product title and a product description. This is where the product price will be added.
  • You can also add a sale price and schedule the dates when the product will go on sale. You can select the type of product you want to add.
  • WooCommerce lets you add simple grouped affiliate and variable products. In the inventory tab, you can add an SKU number to give the product a unique ID and select the stock status in the shipping tab you can add product weight and dimensions and assign a shipping class.
  • You can also add linked products for upsells and cross cells. Add custom product attributes in the attributes tab add purchase notes and enable reviews in the advanced tab.
  • Below you can add a short description for the product. In the right sidebar, you can assign a product category and add a product image. When you’re done click publish to make the product go live and see how it looks on the product page..!
  • This is a simple product, you can add three other types of products a variable product, a grouped product, and an affiliate product.

Variable product

  • variable product offers multiple options for a product like size and color. To add a variable product select the option from the drop-down, then add the attributes that you want to vary for each product. Let’s add the first attribute is size. You have two product sizes medium and large, so you’ll type them in the values section separated by a vertical bar. select the used for variations option and click on the save attribute.
  • Now, let’s see you’ll add another attribute say color, you’ll add the available color values, select the used for variations option, and click on save attributes. In the variations section, you can create product variations using the attributes that you previously entered.
  • Select Create Variations from all attributes from the drop-down and click go, you can see all the possible product variations medium red, medium blue, large red, and large blue.
  • You can now click on the triangle icon there to set the picture, price, and other options. For each of those variations. You’ll also set a default variation that buyers will see first. You’ll click publish to send the variable product to the live store page shoppers can now select different variations of your product.

Grouped product

  • Now let’s create a Grouped product. This product type groups different versions of the same product under the same title. To create a grouped product click on add new under the products tab and make a parent product like a smartphone then select the grouped product from the drop-down. Once done click publish this is how it will appear on your shop page.
  • Now you need to create the child products. You’ll add a new product and name it six gigabytes of RAM then set a price in the sidebar. Set the product’s catalog visibility to hidden so that it doesn’t appear as a separate product on its own. Finally, publish it. Similarly, create an 8 gigabytes RAM version with its price. Set a hidden catalog visibility and publish it as well.
  • Now you’ll go back to the products list click on edit below the grouped product scroll down and switch to the linked products tab then click there and add the newly created child products by searching for them. When you update the page see how it will appear to the shoppers. They can then select the one they want and add it to their cart.

Affiliate product

  • The final product type is the Affiliate product. With this, you can earn commissions by referring your shoppers to other people’s products. You can add the product’s title there then add its link there and type the button text. The product will be published and lead your shoppers directly to the product page.
  • To add more products you can click on add new to add products one by one or click on import. To import them in bulk choose your product csv file and let WooCommerce automatically map csv fields. Finally, click on run the importer and wait for the products to be imported. As you can see all our products will automatically be added to the products list. If you go to the shop page on our website you’ll see that the products have also been added automatically.

Build Page

  • To start building a page you can hover over the pages tab and click on add new. You can see the WordPress default block builder. You can start by adding your title then follow it up with some text for a fresh paragraph press enter and keep typing.
  • To add an image you can hit enter and click on the plus icon, choose the image block then click on upload image and select it from your folder. Similarly, you can add other types of blocks like paragraphs, headings, galleries, lists, and quotes.
  • But building every single page and posting on your website this way requires a lot of time, effort, and some design knowledge as well. So it’s a much better option to import pre-built templates and edit them according to your needs to do it.
  • Now let’s go back to your WordPress backend. Now hover over the appearance tab and click on themes. Click on the add new button to add a new theme in the search bar in the top right corner, search whatever you want hover over the first one, and click install then activate it to choose a template. Click Get Started.
  • You’ll choose the Elementor page builder as it’s the easiest one to use. You can now see more than 100 pre-built website designs, you can use what you want. It’s up to you.
  • Now to publish these changes to the live website click on the update button down there. While editing you’ll notice that you can’t edit the header and footer section of your website in Elementor.
  • Now click on the customize button up there to change the website logo. Click on the edit icon next to it then click on the change image button and upload your logo. You can resize the logo too.
  • Now go back to the customization panel using the back button. Click on menus and open the main menu, with these settings you can rename, replace, and rearrange the header part of your website. The customization panel also lets you customize your website’s footer sidebar and widgets. When you’re done click publish to see the changes reflected on the live site.
  • Now that’s how you edit the existing pages of your website, but what if you wanted to add a completely new one to do it you need to go back to your website’s backend.
  • Now hover over the pages tab and click on add new. Let’s give your new page a title, then click on edit with Elementor to build it using the Elementor blocks. Now there are three ways to create a new page: the first is to drag and drop the blocks that you need from that section.
  • Let’s add a heading by dragging the block then you can type its content directly on the page to add an image you’ll use that block then click on choose an image to replace that with your own image. This way you can build a page block by block from scratch.
  • Now the second method is to use designed templates for pages. Click on the icon. you see a library of page templates for various uses. Use the search bar to narrow down your results then choose one and click on the insert button up there. You’ll get a prompt to connect your website to the Elementor template library.
  • Click on get started then click on create account and supply an email and a password. Click on Create Account when you click on Connect, and your selected template is imported to your page.
  • The third and final method is to use pages from other design templates. Click on the icon then click on a design template. Now you can see the page templates, click on the one you like, and select the import template at the top. The template is applied to our page, click on publish to push the changes to the live website.

With all these settings and setup your fully functioning WooCommerce website is ready to welcome shoppers from anywhere in the world. You can of course add many more functionalities to your ecommerce store using plugins from marketplaces like the WooCommerce marketplace.

Now you can use our Interactive and user-friendly WordPress theme. These are the following:

KiviCare — Medical Clinic and Patient Management WordPress Theme

What is KiviCare?

KiviCare is a first-of-kind theme with a fully functional clinic management solution built into it. You get a complete Appointment booking engine, Patient records, Medical history, and much more. KiviCare – Medical Clinic and Patient Management WordPress Theme is packed with fully customizable Elementor widgets. Our ultimate Medical Clinic WordPress Theme is powerful & functional. It would save you 1000+ Hours and dollars for setting up software for your clinic. Its 200+ Theme Options allow crafting almost any imaginable design.

Home Pages

Medical Clinic WordPress Theme | KiviCare | Iqonic Design
  • Clinic Management
  • Dental Clinic
  • Eye Care Clinic
  • Skincare Clinic
  • Fertility Clinic
  • ENT Clinic

Doctors

Complete Clinic Management Solution | KiviCare | Iqonic Design

Pages

Medical Clinic and Patient Management WordPress Theme | KiviCare | Iqonic Design

Main Feature of Medical Clinic WordPress Theme

  • Hassle-free 24×7 appointment bookings
  • Maintain patient records
  • Maintain medical history
  • Manage all encounters and process them
  • Add holidays and important events and notices
  • Provide customizable templates for clinic and patient management
  • Super Admin can view the complete activity log for all doctors
  • Super admin can create doctors, patients, and other users
  • Keeping track of appointments
  • Manage day-to-day encounters
  • Create and check invoices/encounters
  • Check on the status of clinic session changes

You can find more about this KiviCare — EcoSystem

SofBox — Tech and SaaS Multipurpose Software Landing Page

Tech and SaaS Multipurpose Software Landing Page | SofBox | Iqonic Design

Sofbox’s harmonious design and super clean looks will make your website look beautiful and elegant. This Tech and SaaS Multipurpose Software Landing Page works seamlessly on all major web browsers, tablets, and phones.

Just replace the content and your WebApp images and you are ready to go. Simply choose the layout that suits your needs, customize the sections, headers, sliders, and colors, and choose from pre-made useful elements. Every page is fully responsive and retina-ready, making your creation look good on any device.

Template Features:

  • 5 main homepage layout
  • 3 video layout
  • 3 particles layout
  • 3 main gradient homepage layout
  • 3 gradient particle layout
  • 3 gradient video layout
  • Woocommerce
  • 3+ Header style
  • Clean Code
  • Easy To Customize
  • Unique, Clean, and Modern Design
  • Fully Responsive
  • Cross Browser Optimization
  • Free Google font and icon used
  • And much more….
Tech and SaaS Multipurpose Software Landing Page | SofBox | Iqonic Design

The Awards that SofBox – Tech and SaaS Multipurpose Software Landing Page got:

  • “Theme of the Day”
  • “BestCSS”
  • “CSSReel”
  • “Web Guru Awards”
  • “TopCSSGallery”
Tech and SaaS Multipurpose Software Landing Page | SofBox | Iqonic Design

EnerZee — Renewable Energy WordPress Theme

Renewable Energy WordPress Theme | Enerzee | Iqonic Design

Enerzee – Renewable Energy WordPress Theme comes with amazing customization features. With full creative control over its appearance, Enerzee offers various options to create your website. Besides the customization tool, the Enerzee – Renewable Energy WordPress Theme can be used to create an interactive website. The effects used in this Renewable Energy WordPress theme can give an impressive look to your brand. Their eye-catching homepage banner, multiple sections, and attractive about us page make Enerzee one of the most sorted after Renewable Energy WordPress themes. The testimonial slider, portfolio, and team help promote your promising agency.

Each page is fully responsive and retina-ready, making your creation look good on any device.

Main Features:

  • Creative and Modern Design
  • Powerful Theme Options panel
  • Fully Responsive
  • Retina Ready
  • One-Click Demo Import
  • Elementor Page Builder Included
  • Highly Customizable
  • Simple One-Click Import of Demo Content
  • Slider Revolution Responsive WordPress Plugin ($26 value)
  • No coding knowledge required
  • HTML5 & CSS3 Validated
  • Google Fonts Included
  • Customizable Contact Forms with Contact Form 7 support
  • Custom Build Theme & Page Options
  • Browser Compatibility
  • Clean Code
  • Sticky Navigation
  • XML File with Demo Content
  • Big custom shortcode collection
  • 5 Homepage examples
  • 5 Footer layouts
  • Masonry Portfolio List
  • Portfolio Project Info shortcode
  • Portfolio Slider shortcode
  • Parallax sections
  • Mega Menu
  • Powered by the Redux framework, bring to you unlimited color and Google fonts options
  • Customizable Google Maps
  • Blog List widget
  • Translation ready
  • WPML Plugin compatible
  • And so Much More…
Renewable Energy WordPress Theme | Enerzee | Iqonic Design

Foodsto — Grocery and Food Store WordPress Theme

Grocery and Food Store WordPress Theme | Foodsto | Iqonic Design

Foodsto – Grocery and Food Store WordPress Theme is a perfect theme if you are willing to create a personal online food store. It is ideal for organic food and Fresh farm vegetable store website projects. With a clean, minimal, and fresh design, your website will look great on all devices. Start your simple food store website easily and start selling online without any hassle.

You get a Modern Shop Layout, Store Functionalities, Wishlist, Quickview, Cart view, and fresh style. A perfect theme for simple Food Stores and Markets, Organic Producers and Farms, Vegetable stores, Grocery Stores, and so on.

Benefits You will get from FoodSto:

With our exceptionally professional support, you get Foodsto bundled with all the benefits of a developer. You can personalize your website experience with a powerful theme options panel. You can build your unique online store flawlessly. The Elementor plugin allows you to create pages in the least time allowing you to create your online Food store easier, faster, and better.

Grocery and Food Store WordPress Theme | Foodsto | Iqonic Design

Main Features:

  • Creative and Modern Design
  • Powerful Theme Options panel
  • Fully Responsive
  • Retina Ready
  • One-Click Demo Import
  • Elementor Page Builder Included
  • Easily Customizable
  • Slider Revolution Responsive WordPress Plugin
  • No coding knowledge required
  • HTML5 & CSS3 Validated
  • Google Fonts Included
  • 800+ Google Fonts
  • Custom Build Theme & Page Options
  • Browser Compatibility
  • Clean Code
  • Sticky Navigation
  • XML File with Demo Content
  • Awesome Custom elements collection
  • Powered by the Redux framework, brings you unlimited color and Google font options.
  • And so Much More…
Was this article helpful?
YesNo
Share This Article:
Jasmin M
Jasmin M

Believer and follower of 'running the show', Jasmin Majmudar is a freelance marketing content writer, blogger, and branding consultant based in London. With a master's degree in business management, content is her forte. Extensively working with startups, artists, brands, and companies from more than 7 years, Jasmin's work has successfully made to great brand stories. A millennial soul with an introverted mind and extroverted heart, Jasmin is always with her bag, blazer, and a book (half-read).
                                                                                                                                                                                          
She has nourished her passion of writing and creating successful client experiences and will continue to do so. Drop her a line here whether it's about a feedback or your craziest business idea, we will pull things together. Cheers!

Articles: 110