Premium Themes & Plugin Club - Quomodosoftsoft

How to Add Products in WooCommerce Store: Step-By-Step Guideline

How to Add Products in WooCommerce Store: Step-By-Step Guideline

So, you just finished setting up your WordPress website and are thinking about how to set up a WooCommerce store page?

In case you haven’t used WooCommerce before, no worries. It’s a very simple platform that allows you to add products in WooCommerce. With WordPress you can edit product details, manage basic stocks, and create e-commerce store pages without any hassle.

In this step-by-step guide, we’ll be showing you the basics of how to add products and create a custom single-product page in WooCommerce. And how to do so faster with ShopReady simple one-click page template.

Before we get started, let’s get to know a bit more about WooCommerce.

What is the WooCommerce WordPress Plugin?

WooCommerce is a feature-packed WordPress eCommerce plugin. That simplifies the process of developing & managing an E-Commerce storefront. By providing respectable levels of flexibility as well as various important tools like basic inventory management and tax administration, secure payments, shipping integration, etc.

Check out the recent post 6 Best WordPress E-commerce Plugins Comparison

Why Should You Start Using WooCommerce Now?

WooCommerce plugin comes with a plethora of useful features like order monitoring, adopting different currencies, shipping status notifications, inventory management, and more.

Most E-Commerce websites created with WordPress are powered by WooCommerce.

It does not matter if you are creating a new e-commerce site from scratch or updating an existing one. WooCommerce can easily be integrated into your WordPress website with minimum effort and no coding requirement.

We’ll walk you through the process of adding WooCommerce products and configuring every last element.

Let’s get started with this step-by-step guide…

Additional resource on – How To Add Navigation Menu In Elementor

How to Add Products in WooCommerce Store

To get started with WooCommerce, you’ll first need to download and install WooCommerce on WordPress.

To do so, head over to WordPress Dashboard > Plugins > Add New and search for the plugin.

WordPress Dashboard

From here, install and activate the plugin.

WooCommerce Setup Wizard

After activation, the integration process needs to be completed by following the WooCommerce setup wizard prompt.

The basic setup wizard requires some minor information such as user name, address, product category, etc.

Products to Your WooCommerce

Open your WordPress dashboard and navigate to WooCommerce > Products after the WooCommerce setup is complete. Then, to create your first product, click the Create Product button.

Products to Your WooCommerce

This should redirect you to the WordPress editor screen. From here you’ll be able to add, remove, and edit product details for your website.

Step 01: Add the Product Title & Description

From the WooCommerce product page editor, add the name of the product in the title section. Followed by a detailed product description that best represents the product.

Each product must be featured with product attributes, color, design details, etc. You can use typography, color, effects, etc in the product description.

Add Product Title & Description

If you’re unsure of what to write in the description section, you can follow this insightful blog by WooCommerce.

Step 02: Adds New Product Type Data

Depending on your goods and services, you can select between the product types from the WooCommerce product page customizer.

Choose between one of four different product types depending on your goods and services:

  • Simple product.
  • Grouped product.
  • External/Affiliate product.
  • Variable product.

Within each product type, you will also find options to customize the additional variables within each product type.

Step 03: WooCommerce Product Data Meta Box

After you’ve chosen your product type, fill out the remainder of the information in the product data box. Move between sections by using the tabs on the left-hand side of the screen, which refers to each product’s metadata categories.

General Tab

From the General Tab, you’ll be able to edit the usual and sale prices for each product.

When you decide to conduct a discount campaign, use the sale price. Otherwise, you can keep the regular pricing enabled for the standard pricing.

Also, you have the option to select the tax status, which determines if the goods are taxable or not.

General Tab

Inventory Tab

Thanks to WooCommerce, WordPress is not only fantastic for beginning a dropshipping business. But also for creating an inventory-based store with inventory tracking and a stock management system.

The wooCommerce inventory tab assists you in properly managing inventory. By default, the SKU, stock status, and other choices will be available.

You also have the option to manually assign the SKU or utilize a WordPress plugin to generate unique SKUs.

Inventory Tab

Shipping Tab

This is another requirement for selling goods online; you have to provide accurate product measurements and weight.

Shipping Tab

Linked Products Tab

Linked products are a brilliant feature that allows shop owners to link items that are suggestions to promote products and increase shop income.

There are two methods to achieve this: either link-related goods on the product page that your buyers might be interested in or (cross-sells).

Alternatively, you might propose more expensive items with superior features, thus increasing the product’s worth (upsells).

Attributes Tab

The Attributes Tab can assist you in configuring things like color choices, sizes, and more. Attributes can be configured with a predetermined preset or using custom attributes.

Attributes Tab

Advanced Tab

The Advanced tab can be used to add a purchase note that appears after placing an order.

You can also select the custom ordering position for the item and check the box to enable customer reviews.

From the Advanced Tab, you are able to edit the product expiration date, time, purchase note, enable/disable review, etc.

Advanced Tab

Step 04: Create a Unique Highlighting Short Description

The short description is normally shown prominently on your single product page.

Short descriptions are short burst of text that is published to upsell products, highlighting their features and making them more enticing to the consumer.

Depending on your shop home page requirements, you might choose to display the short description or not.

Some WordPress WooCommerce Elementor themes provide users with both of the short description display options.

Highlighting Short Description

Step 05: Product Feature Image

Product images are important for bringing customers’ attention to your products and providing them with visual content. You can upload a featured image highly lighting your product from the Product Image menu from the right hand sidebar.

Product Feature Image

Step 06: Set WooCommerce Shop Categories

The WooCommerce shop display categories are important for helping customers filter out items with a few clicks. This is a must-have option for any modern e-commerce platform.

WooCommerce Shop Categories

Step 07: Publish the Product 

You can publish your product by clicking on the Publish button. Once you’ve double-checked all the product details.

Using a Free WooCommerce Store Product Page Builder to Create a Simple Product Page

If you’re looking to create a single product page in a hurry, then using the best page builder for WooCommerce is highly recommended.

Compared to other plugins in the WordPress repository, ShopReady offers an impressive collection of free-to-use Elementor widgets, modules, and it even includes free WooCommerce templates.

How to Create a WooCommerce Single Product Page with ShopReady

Step – 01:

To make a basic product page using ShopReady – WooCommerce Builder, go to the dashboard and select the Templates tab.

Enable the Product Template category and look for the Single Product setup before clicking Save Change.

Product Template

Step – 02:

Click the + icon and you’ll be sent to the Elementor editor screen.

From here, you can start by clicking on the Add New Section icon in the Elementor editor. To begin adding all the required elements to create a product page and choose a structure.

Add New Section

Step – 03:

To add the product title, look for the Product Title widget on the left-hand side of the screen. And then drop it into the new section that you have just created.

Choose a title from the demo product drop-down in the content tab under the product title. And toggle on content refresh to have it show on the product page.

Step – 04:

By selecting the Style tab and then Typography, you have the option to further alter the title’s typeface, font size, spacing, etc.

Make sure to customize it to match your WooCommerce platform’s overall aesthetics.

Style tab

Step – 05:

To add a product-featured image use the Thumbnail With Zoom widget and drop the widget into the section next to the product title to add a product image.

To enter a product image, go to the Content tab, choose Editor Refresh, and then search for the image you want to use.

Note: In order for this data to appear correctly, you must enter or modify your product information.

Thumbnail With Zoom

Step – 06:

Your product page needs to have a price tag. To add one, search for the Price tag widget, and insert it beneath the product title.

Select the Editor Refresh option under the content heading to look for the product that you’ve added.

Price tag widget

Step – 07:

The next thing you’ll need for your product page is a brief description. Find the product description widget from the search box.

Next up, your product needs a brief description to be featured on the store page. For that, search for the ShopReady product description widget.

Place it next to the product image, and browse for the correct product that you have already published on the Product Dashboard.

Step – 08:

Use the Editor Refresh menu from the Content tab and browse for the Demo Product you wish to feature on the product page.

Please keep in mind that in order for this data to appear correctly, you must update or change your product information.

Editor Refresh menu

Step – 09:

To implement the most critical feature: for any modern e-commerce store page, the Add to Cart button.

Search for the Add to Cart widget from the ShopReady widgets list and place it beneath the product description.

From the Add to Cart widget’s Settings tab, you may choose between parameters such as product quantity, stock information, and variable product type.

Step – 10:

To add a social share function to your product page, you can utilize the ShopReady social icons widget. This will allow you to add social media shareable links with icons for any platform.

ShopReady Social Icons

To add links and edit the social icons, go to the content tab and select the social icons option. From here you can alter the icons and add unique URLs to each icon.

Publish or Update your single product page after you’ve completed customizing it.

To Wrap It Up,

We sincerely hope that you’ve found this piece of content sightful. On the topic of how to add products to WooCommerce and creating single product pages using a free WooCommerce plugin.

Get our updates, tutorials, and
amazing offers right in your inbox