In this article, we will explain step by step how to create an online store based on the WordPress system and the Woocommerce add-on for managing online stores, where you can sell tangible or digital products, services and consultations.
What is woocommerce add-on?
The woocommerce add-on is a free add-on that can be installed on the WordPress system easily, and it is the most famous and powerful add-on for managing an online store through the WordPress system.
In order to be able to create an online store that works on the WooCommerce system, we will need the basic requirements for any website, which are: a domain and hosting .
The woocommerce system for running online stores works best when it is installed on a hosting with appropriate resources and capabilities. In a moment, I will mention to you some tips related to that, but first let us provide you with this brief guide to the article you are reading.
What do I need to build a comprehensive woocommerce online store?
- Know the things that should be taken care of when choosing hosting for the store.
- Know how to book suitable hosting for the store.
- Know how to install and prepare the woocommerce add-on for the first time.
- Criteria for choosing a suitable template for woocommerce stores.
- Explaining how to install a WordPress template for your store.
- General knowledge of the options available in the WooCommerce system for managing online stores.
- Good knowledge of how to set up shipping and delivery options.
- Good knowledge of how to set up payment options and collect money from customers.
- Know how to add, edit and delete the main and sub-sections of the store.
- Know the detailed way to add new products to the store.
- Know the detailed method for adding downloadable electronic products, and how to manage them.
- Know the detailed way to set up the store so that products of multiple descriptions, such as clothes and food, can be added.
- Know the detailed way to add and manage products with multiple types and descriptions.
- Know some additions to protect and secure your woocommerce store.
- Know some woocommerce store acceleration plugins.
- Find out some other additions to enrich and improve your store.
These are the things you need to know to create your online store, and they are what we will talk about in detail in this article, so let’s review those details.
Step 1: Choose reliable hosting to build a WooCommerce store
As we said, hosting is the service you rely on to host your online store files, and therefore you need to rely on. You will need to choose reliable hosting to rely on. Here are some things to pay attention to in order to choose the appropriate hosting:
Speed
The speed of the hosting you will book from is very important. Because it will directly affect the speed of your online store, whether the effect is negative or positive, and you certainly do not like losing your customer who will leave your store due to slow operation while he is shopping in your store.
Security:
If the hosting is not secure enough, or has a bad reputation in this aspect, then you cannot book from that company, because with the first problem related to the security of your store, it will acquire the same bad reputation and inherit it from this company, and of course you cannot risk the trust of your customers. Which is actually the fuel for your online store!
Carrying an appropriate number of visits
It is necessary to review the number of visits that the hosting company allows to your site at the same moment, as well as per day and month, because when your store grows sufficiently and if the hosting cannot bear this growth, it means the site will fall, and display a message to your customers that it is not working!
This is never a good situation for your store or your customers, so you must take into consideration how many visitors your site can serve at the same moment with the hosting you will be dealing with. This varies from one store to another based on the plan you have set.
Providing an SSL security certificate
as long as we are talking about an online store, this means customer data and financial transactions; Information and transactions coming to and from your site. In this business, you cannot leave the way open for snoopers and hackers to intercept the customer’s connection and exploit his personal and financial data in fraudulent operations and the like. Therefore, it is not your choice whether or not to run your site via secure HTTPS links that protect data during Exchanging it between the client and the site is your duty.
Technical Support
The importance of good technical support lies in the speed of handling errors and problems, and thus your site recovers in the shortest possible time, receives customers, and operates the required operations correctly.
Yes, a problem is possible on any website, but it is absolutely unacceptable that you do not find the technical support of the hosting company by your side at this time! Or you find him next to you, but without sufficient experience or capabilities.
Backup
A backup copy is an exact copy of your site that is kept in a safe place, and is updated on a daily, weekly, or monthly basis so that it matches your site at that time. Look for that and make sure that you can update the copy periodically and automatically so that your store is safe.
At any moment, your online store may encounter a problem due to an error, and this error may be irreparable! At this particular time, the solutions will not benefit you as much as your store’s backup.
There are many hosting service providers around the world. You can rely on any technical provider that offers you the above features and is reliable to rely on. You can rely on one of the following companies, as all of them provide high-quality cloud hosting that enables you to provide a satisfactory user experience to your store’s customers:
Note : The previous ranking is not a descending order from best to least, but the previous list contains different companies worth relying on according to the budget and characteristics provided by the company, or you can rely on any other trustworthy provider.
Criteria for choosing the appropriate hosting plan
After selecting the appropriate hosting company, you will need to determine the most appropriate plan for you before purchasing from the appropriate hosting that you decide to deal with, because each hosting company has many different plans and packages to suit many needs, with the need to be aware that the names of the plans and packages do not have specific standards. Rather, it is subordinate to the company’s vision, so do not be influenced by the names and focus on the details of each plan.
Here are a heads up on where plans often differ:
1. Storage space
is the space on which you store your store’s files. It is to the store what a hard disk is to a computer. Whenever you upload files or images to your site, part of the free space available to you is occupied.
It is necessary to pay attention to space because it is the container in which you store your site’s files, images, etc., and it is also necessary to address this item within yourself in preparing your store’s plan and determining the required amount roughly so that it is easy for you to make a choice when comparing plans.
2. The amount of data transfer (Bandwidth)
is the amount available to transfer data. For example: You have an image of 75 KB, which was visited by 10 people, so the size of the data consumed is 750 KB. This amount of data was consumed from the total bandwidth available to you, and so on. Apply this matter more broadly.
Of course, with every visit and page opened on your site, multiple images and files are called, thus consuming a portion of the bandwidth. With many visits, the bandwidth is consumed greatly, especially if the number of visits is high.
3. Number of visits
: This is an alternative to the previous one and may be integrated with it, meaning that some hosts determine the amount of available data transfer, and some treat you with the number of available visits regardless of the amount of data consumed due to those visits, and some hosts treat you based on the number of visits provided that data consumption does not increase. About such and such…etc.
You must review these matters and make sure that you choose the most appropriate for your site.
4. Random memory (Ram) and processor (Processor).
If I asked you to calculate the following equation: 1 + 1, you would answer 2. Yes, this is one simple equation, but running an online store is a huge matter that includes implementing millions of simple and complex equations, and these things are done at a terrible speed. No. We can barely notice it, and the one who does these things is the processor, and the memory helps it perform its work smoothly as it allows for multitasking (which are equations that need to be calculated).
At the same time, the larger the memory capacity, the more the processor has the opportunity to perform additional operations at the same time as long as its capacity allows it. So, you must check the number of processors and the capacity of each processor, as well as the number of RAM and the capacity of each one to ensure that you choose a plan that runs your site efficiently.
5. Backup
We talked about it a little while ago as one of the criteria for choosing hosting, and here we focus on it more, as each plan in hosting has a method for backup, in terms of whether it is free with the plan or has separate costs, as well as in terms of copying times, is it daily, weekly, or Monthly or instantaneously.
Consider these and other differences between the available plans, knowing that you can upgrade to a higher plan at any time if you find that the plan you are on no longer suits you.
This is why it is necessary to determine your needs at the beginning of the work, and your needs after a month, several months, or a year, for example, based on your study of the project. This will help you avoid bearing costs at the beginning for something that you will need after six months, for example. So let’s start with what’s right now and upgrade after six months, thus saving some costs.
Before we finish talking about hosting and its plans, we would like to briefly mention another type of hosting, which deals with you based on consumption, so you only pay for what your site consumes, and you are not obligated to book a plan in which you pay for some extras that you do not need, and among the hosts that offer this Type of services: Liquidweb and Digitalocean.
Now let us explain to you step by step how to book your hosting.
Step 2: Reserve hosting for your Woocommerce store
Whatever service provider you rely on, the steps for purchasing hosting are similar to the steps for purchasing any digital product on the Internet, as the process of purchasing web hosting includes the following steps:
- Determine the appropriate hosting plan
- Register a new account with the hosting company
- Complete the payment and purchase process
- Receive hosting data via your email
All hosting is close to each other in terms of the necessary steps for purchase, but we will rely on purchasing hosting from Digital Ocean (as an example only), because it is considered one of the best hosting companies, knowing that you do not have to rely on this company exactly, but rather you can use the accreditation of another company, But we always advise you to rely on a reliable company and cloud hosting, and to stay away from using shared hosting because of its problems that negatively affect the online store.
In order to reserve hosting from Digital Ocean, go to the company’s website, then click on the ( Sign Up ) button located at the top right.
A page will appear asking you to choose one of 3 methods provided by the company to create an account. You can choose to create an account via your Google account, via your GitHub account, or via email.
The easiest method is the one that relies on a Google account, because when you rely on it, information is imported from the Google account, but we will explain the method of creating an account via email, because it is suitable for use in all cases, so click on the ( Sign Up with Email ) button.
You will be taken directly to a page asking you to enter some information. Fill out the fields by entering your full name, email, and a new password for the account you create with the hosting company, then click the ( Sign Up ) button.
Within a few moments, you will see a message stating that a message has been sent to your email, and you must click on the link in it to confirm the email.
Go to your email inbox, open the message that was sent from DigitalOcean, then click on the link in it.
The email will be confirmed, and you will be directed to a page asking you to specify some information about your project. Choose from the first list ( E-commerce company ), then choose ( A website or content site ) from the second list, then choose what suits you from the other two lists, then click the ( Submit ) button.
A page will appear asking you to enter payment method data. Click on the option corresponding to the type of method you want to add (credit card or PayPal), then enter the information for the payment method you chose. You will be directed to a window that displays a welcome message that allows you to create your first project on Digital Ocean.
With this, you have finished creating an account on DigitalOcean, but you still need to create a project in the account, create what is called a droplet within it, choose the appropriate hosting plan, and install WordPress on the hosting (or droplet), and we have explained how to do that in detail. In the article ( Steps to install WordPress on Digital Ocean hosting ).
We would also like to point out that we explained more about Digital Ocean and the steps for creating an account in it in detail in a separate article entitled ( Steps for creating and activating an account on Digital Ocean hosting ), which you can review if the steps explained above are not sufficient for you.
Warning: The steps necessary to purchase hosting may vary from one company to another, but in the end they are similar and clear.
If you will rely on another hosting different from Digital Ocean, and you choose a dedicated plan for managing your Woocommerce store, you will find your account management panel prepared to manage the site directly, or at least give you the ability to create your site through very simple steps, as is the case with Digital Ocean.
But if the plan you purchased is not customized or does not provide what is required through clear and prominent steps, then you must install WordPress manually first, which is an easy matter that was explained in a previous article ( How to download and install WordPress on hosting ).
After that, you can go to the WordPress dashboard. After entering the WordPress control panel, move with me to the next stage.
Step 3: Install the Woocommerce plugin
After logging in to the WordPress control panel, from the side menu, choose “Add-ons” and then “Add New.”
In the search box, type Woocommerce and from the results click “Install Now” when adding WooCommerce as shown in the following image.
After the installation is complete, click the “Activate” button that will appear in place of the “Install Now” button.
Thus, the installation and activation of the Woocommerce add-on has been completed, and we will move to the next stage of setting it up.
Setting up a Woocommerce plugin for the first time
After activating the add-on, it will automatically start directing you towards setting up the add-on to run your store for the first time, which is as follows.
Specify the store address as shown in the following image
Then we determine the store’s business areas, in other words we determine what areas of goods or products we will sell?
We put a check mark in front of the appropriate sections, then click “Continue”
In the next stage, we will determine the type of products that we will sell through our online store.
Physical products: These are tangible products that need someone to deliver them to the customer where he is, or for the customer to come and pick them up from the store, such as: clothes, computers, etc.
Downloads: These are digital products that can be obtained through the Internet and do not require shipping or delivery to the customer. This type includes: programs, PDF files, videos, etc.
There are other types as shown in the picture, but they are not free, and you need to purchase to run them on the site.
Choose what is appropriate for your store by placing a check mark, then click “Continue” as shown in the following image.
In the next stage, you will be asked for some information about your business activity, which is different depending on your choice. Other fields will appear for you.
Complete as you see fit and then click Continue. Below is a snapshot of some of the options being offered.
After that, some templates compatible with Woocommerce are displayed, including free and paid ones. Of course, the first option is the template currently activated on your site if you do not want to get another template. The second suggestion is directly the Storefront template , which is officially nominated by the Woocommerce developer. Or install any other template suitable for you.
Click Continue with my active theme to continue using the activated template on your site, or click Choose on the template you want to use as shown in the following image.
After that, some helpful tools are displayed, and you have the option to accept or reject, as shown in the following figure.
Now we have finished setting up the basics of your store through the setup wizard as you saw, it remains to look at the platform settings and capabilities to see the most important options available to us.
But before that, you must choose an appropriate template that supports your online store, because it is the interface that visitors to your store deal with. If it is not appropriate, your visitors will be exposed to a bad experience, which will expose you to losses in several directions.
Step 4: Choose a suitable template for your Woocommerce store
First, you should know that obtaining a template from its original source is imperative if you want the success and protection of your store. Always try to obtain your tools from reliable sources, whether private or public.
Many reliable developers offer their templates for free or paid on their own sites, and there are some who offer them through public sites such as: the official WordPress template repository , or the Picalica store .
Whatever you choose, make sure the theme is documented and that it supports Woocommerce stores, gets updates on a regular basis, and keeps up with the developments provided by WordPress and the Woocommerce plugin.
Also, do not forget that the template supports the Arabic language and displays it correctly, whether the template’s control panel that you will deal with, or its external appearance that your customers will deal with.
The security of the template, its compliance with SEO rules, and its convenient display of products and sections are things that cannot be ignored when choosing a template.
Also, make sure that there is technical support from the template developer, and that he speaks the language or languages that you are fluent in so that you can benefit from it if there is a problem or something that bothers you.
If you want practical and detailed steps explaining how to choose the appropriate WooCommerce template, we advise you to review our detailed article on this topic ( How do you choose the best WordPress template for you? 8 practical steps ). Also, if you want to learn about some of the best templates, you can review the following articles:
- The 9 best templates for WooCommerce online stores (free and paid) .
- The best 10 free Arabic WordPress templates .
- The 8 best paid Arabic WordPress templates suitable for various websites .
Explain how to install the template
After choosing a WordPress template, you must install it on the site. Installing WordPress themes is a simple process, whether from the official WordPress repository or from an external source. Both are easy to install, and the work can be summarized in the following steps:
⦁ From the side menu, choose “Appearance” then “Templates” as in the following image.
⦁ From the Templates window, click the “Add New” button at the top, or “Add New Template” at the bottom, as shown in the following image.
⦁ Select the template you want to install from the templates that will appear to you, or search for the desired template through the available search box. Point to the desired template and then click “Install.” After the installation is complete, a new button will appear titled “Activate.” Click on it to activate the template and show your store with the new appearance. . The following image shows this step.
⦁ If you have the required template on your device, press the “Upload Template” button as in the following image, and complete the steps as explained.
Thus, the new WordPress template was installed in simple steps, and you can view the available template options, as in most cases a complete control panel for the template is provided within the WordPress control panel, which you will find in the right menu.
Other options for the template are also available in the customization area, and they can be accessed from the right menu of the control panel. We click “Appearance” then “Customize” as in the following image.
You will find many options in the customization section and the template control panel so that you can modify the appearance of the site as suits you.
For more detailed information on how to install WordPress and WooCommerce templates, see the article ( Install a WordPress template through 3 easy methods ), in which we have explained in detail multiple ways to perform this step.
Options available in the Woocommerce store system
In general, the Woocommerce system gives you many options to control many things. We will explain some of them in detail shortly, God willing. This is a summary of most of the available options and settings: store address, the regions you sell to, the regions you ship to, the currency you sell in, buyers’ ratings on Products or services, units of measurement of weight and dimensions, control of stock of goods and their availability or out-of-stock status, management of the sale and loading of intangible electronic products.
In terms of products or services, the Woocommerce system allows adding main and sub-sections in which the products are arranged appropriately. In addition, products can be added in a simple manner that includes many options for each product, and we will learn about these matters in detail in the stage explaining adding a new product to the store shortly.
Shipping options
: Specify the main and sub-shipping areas, the shipping cost for each area, or whether you want to make shipping free.
Payments and receiving funds
Cash on delivery, payment through PayPal and credit cards, payment by check, direct bank transfer.
Settings for creating and managing customer accounts, invoices and orders, allowing customers to manage their accounts, and subsequent alerts and emails related to orders and so on.
Managing alerts and messaging processes related to the customer and the store manager according to order status, and account control processes.
We also have order settings and control, and communicate with customers with notes on their orders…etc.
There is also a customer panel that shows each customer’s orders, total invoices, average orders, and many useful statistics.
The Coupons and Discounts panel is also available, where specific discounts can be set up at a custom amount or percentage, on specific goods or on the entire shopping cart, permanently or in a specific period, while restricting the maximum discount, the number of times the coupon can be used…etc.
The system also contains an analytics panel to display sales in terms of total sales, net profits, use of discount coupons, as well as sold items, orders, best departments or best sold products…etc.
This is part of the capabilities and options available, and in the following stages we explain some of these matters in detail. Of detail.
Step 5: Shipping and delivery settings in your Woocommerce store
The Woocommerce system provides us with a shipping tool with flexible options and settings that meet the needs of stores and customers. To set up this important section of the store, follow the steps shown in the following image in order.
⦁ From the right menu, click Woocommerce.
⦁ Then click “Settings” from the drop-down menu.
⦁ From the settings tabs, click “Shipping”.
Now we are in the shipping settings section, and to add a new shipping area, click the “Add shipping area” button, which is indicated by arrow number 4
But before adding a good zone, let me explain to you the general idea of the principle of charging zones.
Suppose you sell a type of clothing on your store, and you already have a store in a neighborhood in Cairo or other cities in other countries, and accordingly we have different segments of customers regarding product delivery.
⦁ First segment: In the same neighborhood where your store is located, you would like to book orders from the online store and receive the goods from the store.
⦁ The second segment: Same as the previous one, except that she wants to deliver orders to her homes.
⦁ Third segment: Inside Greater Cairo, she would like to purchase from the online store and have the orders delivered to her homes.
⦁ Fourth segment: In other governorates inside Egypt, and would like to purchase and deliver as well to their own addresses.
⦁ Fifth segment: In countries other than Egypt, and you would like to buy your products, but for one reason or another you are not ready to deal in other countries and have decided to exclude this category for now.
It is logical that these SIM cards will not be equal in shipping costs, as the first and fifth SIM cards are excluded from the shipping settings, the second SIM card can be shipped for free, the third SIM card is at a reasonable cost, and the fourth SIM card may have a higher cost.
Hence, different shipping areas must be prepared, as each area has a different price from the other, depending on the costs you bear.
Now let’s see what Woocommerce offers us in this matter.
Click the “ Add charging area ” button and follow the following image.
Here is an explanation of the numbers in the picture.
1. Area name : A title that you can write to identify the area, for example: store neighbors, Cairo customers, governorate customers.
2. Region scope: Specifying the regions to which these settings will be applied. It could be one or more countries, a city within one or more countries, a combination of specific countries and cities within other countries… and so on.
3. Add a shipping method: This is the shipping method related to this region, and you can see its settings in the following image.
Choose the desired method, then click the “Add shipping method” button , knowing that you can add more than one method, then activate or cancel one of them.
Note that after adding the method, you can edit its details and costs by clicking “Edit” as in the following image.
Thus, you complete the shipping settings and costs for different regions according to the plan you have set for your online store.
Step 6: Payment and collection settings
The Woocommerce system provides four methods for collecting your financial dues from customers, which are: cash payment upon receipt, payment by check, payment by bank transfers to your bank account, and payment using PayPal, which includes the use of credit cards.
To view payment options, go from the WordPress control panel to Woocommerce, then Settings, and from there choose the “Payments” tab, as in the following image.
In this image you see the payment methods, all of which are activated on the store.
To set up the options for these methods and complete them so that they are ready to work, click the “Manage” button as shown in the following image.
Enter the payment methods one by one and adjust the settings as you like, then press the “Save Changes” button and your settings are complete and ready to work on the store.
Any time you see that you need to stop some of these methods, turn them off using the button shown in the following image, then press the “Save Changes” button.
And the first steps in preparing the departments and products that you will present to your customers.
Step 7: Add the main and sub-sections of your online store
Here we begin setting up the store’s sections according to the categories of goods or services we have. However, if your store includes very few goods or goods that belong to one small category and cannot be divided, then you can skip this stage and move to the next stage directly.
To start creating store sections, follow these steps:
⦁ Go to the WordPress control panel.
⦁ From the right side, choose “Products” then “Categories” as in the following image.
On the left side, you will find some sections that are ready by default. You can delete them by pointing at the section and then choosing “Delete.”
You can also modify it to suit you by clicking “Modify” as shown in the following image.
⦁ To create a new section, start by filling out the required fields on the right side, which are as in the following image.
Display type: It is the way this section appears when the visitor opens it. Do only the sub-sections appear in it, or do the products within this section appear with it, or do the products appear but the sections do not appear?
⦁ Complete the previous fields as appropriate for your work, then click the “Add a new category” button as shown in the previous image.
Now the first section in the store has been successfully added, add the rest of the sections in the same way, taking into account the main and subsidiary sections, so that you place each section within its main section and your store is well organized and not chaotic, which gives a good impression to visitors to your store, which contributes to increasing your sales. Indirectly.
If you later wish to edit one of the sections, you can do so by clicking “Edit” as explained previously.
Step 8: How to add a new product to the Woocommerce store
To add a new product or service to your online store, follow these steps:
⦁ Go to the WordPress control panel.
⦁ From the right side, choose “Products,” then “ Add a new product,” as in the following image.
⦁ Or from the top bar, choose “New ” then “Product” as in the following image.
Below is a picture of the Add New Product panel, which is as follows.
This is an explanation of what the numbers in the picture indicate:
1. Product name: The name that appears with the product and by it we know what it is.
2. Product description: A detailed explanation of the product and its advantages, etc.
3. Product data: A section that we will explain in the next stage, God willing.
4. Short description of the product: A brief description of the product.
5. Product categories: Here the store sections appear as we added them in the previous stage. We put a check mark on the section or sections to which the current product belongs. Note : A single product can belong to more than one department.
6. Product tags: Tags are for the things that distinguish the product. Through the tag, more than one product can be displayed if many products share the same tag.
7. Product image: The main image for this product, and it is displayed with the product name in sections, pages, etc.
8. Product Image Gallery: Additional images of the product, which are displayed within the product image page itself when that page is opened to view the full product details.
Below is an explanation of the third point, “Product Data,” which is as follows.
This is an explanation of what the numbers in the image indicate:
1. Product type: This field provides many types as follows:
A- Simple product: A regular, tangible product that is sold on the store, and does not have multiple specifications or options, such as: a magazine.
B- Combined product: It is not a new product in your store, but it is a collection of several related products in one order, such as: five serving dishes.
C- An external product: This product is not one of your store’s goods, but is sold in another store, so you display it and place a link to the other store so that the customer will be transferred there when he wants to purchase. This is useful in affiliates.
D – Multi-type product: Products that have different specifications from one piece to another, such as clothing: they have different colors and sizes.
2. Virtual product : These are intangible products that do not require shipping. Accordingly, shipping options are hidden, and shipping costs are deleted in this type of product.
3. Downloadable product: These are products that can be downloaded via a link through the Internet, such as books, videos, programs, and the like.
4. Default price: is the price of the product.
5. Discount price : It is the price of the product after it has been reduced, and not the value that you want to deduct from the normal amount, and of course it must be less than the default price.
6. Scheduling: Determine the beginning and end of the time during which the product is calculated at the discounted price automatically without your intervention. This is useful when placing offers for a temporary period.
Based on your inputs in the fields shown in numbers 1, 2, and 3, you will find some additional tabs and options appear or some existing ones disappear, to serve the type you have chosen.
Complete what you need according to the required options, then press the “Publish” button as in the following image.
How to add a downloadable electronic product
⦁ Go to add a new product as I explained a moment ago.
⦁ Complete the necessary fields, descriptions, images, etc.
⦁ In the product data panel, put a check mark in front of “Virtual Product” and “Downloadable Product” and complete the required data as shown in the following image.
1. Click the “Add File” button to select the file you want to sell. Note that more than one file can be added.
2. The name of the file that will appear to the customer after completing the purchase, so that he can download it from it.
3. Link to the file to be downloaded after purchase.
4. Choose a file from the local files within WordPress media.
5. The number of times the customer is allowed to download the file. After downloading the file for a number of times corresponding to the specified number, he will be unable to download the file after that.
6. If you wish to specify a specific number of days in which the client can download the file, enter the required number here. After the specified period, the customer will not be able to download the file again.
Complete the product details as usual and click “Publish” .
We have explained how to add and manage products and categories in more detail in a comprehensive article that we advise you to read to learn more about this topic ( How to Manage Products and Categories in a WooCommerce Store | A Comprehensive Guide ).
Preparing the store to add a multi-type product (product with multiple options)
This method is useful in products that have different specifications, such as clothing, where each piece has a different color and size. To do this follow the following steps.
Go to the WordPress control panel, and from the side menu choose “Products” then “Themes” as shown in the following image.
At this stage, we will add the titles of the variable attributes, such as: color, size, fabric material, etc.
After clicking on “Attributes” from the list, you will find a screen similar to the following.
Here is an explanation of what the numbers in the picture indicate
1. Name: The name of the feature or characteristic that you want to provide in your products.
Note that now we do not add the available colors or sizes, but rather we only tell the system that we will have variables, which are: color, size…etc.
But what exactly are the colors and sizes? This will be later, not now. Now let’s add the attribute: color.
2. Nice Name : A unique, non-recurring link specific to this attribute.
3. Activate archives : Activating this option later provides you with the ability to provide a link that includes all products that have this characteristic, regardless of the section to which the product belongs.
4. Add a theme: To approve this theme and add it to the store.
5. Configure elements: This is the option concerned with adding variables dependent on this attribute. For example: Configure elements for the color attribute: This is the appropriate option in order to add the available colors: white, black, red…etc.
6. Variables that are already available and previously added to this attribute.
Now we have finished preparing the attributes (variable descriptions) for the store’s goods, knowing that these attributes are not for one product only, but for the store in general. All of them can be used with any product, and only some of them can be used as we will see shortly.
Adding a new multi-type product
⦁ Go to add a new product as you learned previously.
⦁ Complete the necessary fields, descriptions, images, etc.
⦁ In the product data panel, choose from the list “Multiple product types” and follow the steps shown in the following image in the order of the numbers present to add the first characteristic to your product.
Note that step number 3 in the image varies according to your desires and the needs of your product. Here the attribute is color, but your attributes may be different based on what you entered previously.
After clicking “Add” you will find a window similar to the following.
Here is an explanation of what the numbers in the previous image indicate.1⦁ The title of the theme you are currently working on.
2⦁ Click here to review the variables of this attribute and choose from them. In this example, when you click, the colors that we entered previously will appear: white, red, black.
3⦁ Click the button to list all available options. It is like the previous option No. 2, but this adds all options without exception.
4⦁ Clear the options you have chosen and empty the place to reselect again.
5⦁ Add more colors that we did not add before in the elements configuration panel. For example, this product has a blue color, so it can be added directly from here without the need to go back to managing and configuring attributes.
Complete the options according to the product you have, and enter the other attributes you need along with their options, then click “Save Attributes.” It is very important that you do not forget to put a check mark in front of “Used in Types” because it is the basis for the next step.
Before moving to the next step you should know that I added the attributes: color and size. In color, I added white and red, and in size, I added L and XL.
In this case, what results are available?
White L
White XL
Red L
Red XL
If there are more attributes, you will find more results, and the more options for one attribute, the greater the final results as well.
In each final result, you have the freedom to specify its own price, the amount of stock you have of it, its image, its discounted price…etc. Meaning that each final result will be as if it were an independent product with all the characteristics known in the store.
Click “Types” from the left menu to move to the next step.
As in the following picture, we have two options
The first: Adding a type, where we manually create a product that has several characteristics of the attributes we added.
For example: white L, red L, and white XL.
Second: Creating types from all the attributes, where the system automatically creates all the final products that can be produced from mixing all the available attributes.
Choose what is appropriate for you, then press the “ Apply”
button . I chose “Add a type” and this is the result as in the following image
Here is an explanation of what the numbers in the previous image indicate.
1. The default color of the product is among the available colors.
2. The default size of the product is among the available sizes.
You may find items other than these two depending on the attributes you have chosen.
3. Add a new type of product.
4. Choose the size for this type.
5. Choose the color for this type.
You will find these two fields again if you add a new type.
6. Cancel work on this type (or types if you added more than one type).
7. Save the changes and approve the details of the added types.
8. Clicking on this empty space opens the type options for you as if it were an independent product, so you can specify its price and so on.
Complete the rest of the details according to the goods you have, and look at the previous image, as it is the appearance of the product as the visitor will see it, with a difference in the display method based on the template you are using.
To learn more about how to take advantage of multi-type products in WooCommerce, see the article ( Learn to create products with multiple types and prices in Woocommerce stores ) in which we explained in detail different methods and options related to this based on the default WooCommerce settings and plugins.
After your store is complete and ready for launch, you must not overlook two important things, which we will discuss in the following paragraphs.
Step 9: Some Additional Steps
Woocommerce store protection and security
Although we previously pointed out the security factor when choosing hosting and template, there is more that can be done, and therefore you must install a good add-on that works to protect your site and secure it additionally. Here we recommend the Wordfence add-on, which is a powerful add-on that is available for free on the WordPress add-on repository, and it works. At the time of writing this article, it is on more than 3 million websites, and you can get it from the App Store .
You can also rely on the All In One WP Security add-on, as it is one of the most famous and best add-ons in the field , and it works to protect more than 900,000 websites at the time of writing this article.
It is also available on the official WordPress plugins repository for free, and can be downloaded from the WordPress App Store.
Speed up your Woocommerce store
The second thing is the speed of your store, which is an important factor in the level of security of the site. Therefore, we point out it here, even though it was pointed out when choosing the hosting and template as well.
We recommend the WP-Optimize add-on , which is one of the premium add-ons on the official repository, and has so far received more than 900,000 active installations on websites.
Also, the powerful premium plugin WP Super Cache , which works on more than 2 million websites at the time of writing this information, is free and available on the official WordPress repository.
Other add-ons we recommend to improve your online store
What we have presented in this article is not everything, but there are other things that can improve Woocommerce stores and move them to distinct stages of work, and below we show some of these additions and services.
First: CDN services for storing and transferring content.
These services are important in protecting and accelerating your store and saving some of the effort required from your hosting. The idea, in brief, is that it stores parts of your store, especially fixed parts such as images and format files, on a network of servers distributed around the world, so that if someone visits the store, it provides These parts come from the server closest to the visitor’s country instead of your hosting company’s servers, and thus your site opens with the visitor faster.
Also, the hosting company does not deduct these parts from the amount of available bandwidth except when the CDN service requests them. As for the rest of the times the service provides the required parts to the visitor, they are not counted. In addition, when your site enjoys very many visits, these visits are distributed among several servers around the world according to Visitors’ countries, so your hosting can be done comfortably while the CDN service takes care of the hard work for those heavy traffic.
This process takes place only in parts of the site, while vital processes such as purchasing, payment, inquiries, etc., take place directly with your site.
Companies that provide this service include Cloudflare and Sucuri.
Second: Adding UpdraftPlus to backup services.
We talked before about backup services, and the most prominent additions that meet this service professionally: Adding UpdraftPlus , which allows you to create a copy of the databases and files of the entire site, including templates, add-ons, products, pages, articles… etc.,
and you can make this copy. Manually, or automatically every certain period, and this copy is automatically saved on your hosting or in another place such as Google Drive or Dropbox, or downloaded to your device.
Pre-existing copies are recalled and the site is restored to any version you want based on the desired date.
Third: Adding Smush to improve site images.
This add-on is formerly known as WP Smush, and it specializes in making improvements to site images in terms of size and dimensions so that they are faster in loading. This includes the images you already have, as well as those that you will upload later, and it also includes images. From outside the site.
In the end, the plugin will reduce the size of the images while maintaining their quality, which will reflect positively on your site.
Fourth: Adding Dokan to create a multi-seller store.
If your plan is to create a store that includes many sellers with their own accounts, then adding Dokan is very suitable for this purpose, as it allows each seller to create his own store for you with control over his products, customers, and orders independently of the main site administration. It also provides each seller to create a profile for himself or his store with distinct customizations.
And of course, adding Dokan as the main store owner allows you to keep track of seller accounts.
